ゲームアプリのUIデザイン

プレイしたゲームアプリのUIデザインに関して書き残します。毎日頑張って更新!

2020-05-01から1ヶ月間の記事一覧

「VOEZ」水彩風の画面遷移がきれい!

こんにちは!ちょこです! 「VOEZ」のタイトル画面に入る時の画面遷移がきれいでした! ▲タイトル画面。淡く水彩のような質感 遷移はこんな感じです! ▲イラストがにじみ出るような演出 アニメーションの尺はそこまで長くなくテンポも良いです。尺が短いとイ…

「VOEZ」動画広告視聴で楽曲がプレイできる実装だった

こんにちは!ちょこです! 「VOEZ」で動画広告を観ると楽曲がプレイできる仕様があったのが気になったので紹介します! 上の画面は「楽曲選択画面」です。 複数のカテゴリで楽曲をフィルタリングすることができるのですが、いくつかの楽曲は動画を視聴するこ…

「ビーナスイレブンびびっど!」キャラアニメーションが良いとキャラの魅力も伝わり没入感も阻害されない

こんにちは、ちょこです! 「ビーナスイレブンびびっど!」のSDキャラのモーションが丁寧に作られていたのが良かったです! 具体的には試合準備の直前の画面での待機モーションです。 動きとしてはこんな感じです。 ▲ぴょーん シンプルに可愛い! ▲足元の影…

「ビーナスイレブンびびっど!」メジャーで便利な導線紹介

こんにちは!ちょこです! 「ビーナスイレブンびびっど!」でミッションを達成するための導線があるのが便利だと感じました! 任意のミッションを選択し詳細を開くと、ミッション達成のための導線が配置されています。 結構見かけるというか、もはや一般的な…

「ビーナスイレブンびびっど!」キャラプロフィールにあだ名という情報があるのが興味深い

こんにちは、ちょこです! 「ビーナスイレブンびびっど!」のキャラクターのプロフィールで「あだ名」という情報があることに驚きました! キャラクターのプロフィールが表示される画面ですが「あだ名」という情報があることに気付くかと思います。 ▲ゆうか…

「ビーナスイレブンびびっど!」会話ウィンドウのデザインが多様だと感情表現も豊かに見せることができますね!

こんにちは、ちょこです! 「ビーナスイレブンびびっど!」の会話ウィンドウの種類が多く用意されていたのでご紹介です! 見た感じ以下のようなデザインがありました。 1:通常デザイン 2:シャウト 3:不安 4:心理描写(主人公) こういった表現を用いること…

「ビーナスイレブンびびっど!」DL時間中にミニゲームで遊べるとストレスに感じない!

こんにちは、ちょこです! 「ビーナスイレブンびびっど!」でデータDL中に遊べるミニゲームが実装されてたので紹介します! ゲームの概要ですが、右から走り抜ける何かにサッカーボールをぶつけてスコアを競うルールです。 動きで見るとこんな感じです。 ▲ど…

「ビーナスイレブンびびっど!」ユーザーに悩んでほしくないところは選択肢だけ見て分かるようにすると良さそう

こんにちは!ちょこです! 選択肢を見るだけでユーザーが何をしたら良いのか分かるデザインが良いと感じたので紹介します! こちらの画面です。 レビューをするかしないか、選択肢を見ただけで分かるデザインになっています! こちらは他タイトルのレビュー…

「ビーナスイレブンびびっど!」かわいいエンプティステートの紹介

こんにちは!ちょこです! エンプティステートの紹介です! エンプティステートを紹介するのも9タイトル目です。今のところ約10タイトルに1タイトルの割合で見かける感じです。 ゲームらしいエンプティステートがあると世界観の没入も削がれないので良いと思…

「ビーナスイレブンびびっど!」キャラクターが伝えるというデザイン

こんにちは!ちょこです! 「ビーナスイレブンびびっど!」にて、色んな画面にキャラクターが配置されているのが良い工夫だな、と感じました! いくつか紹介してみます。 まずはプレイヤーのレベルが上がった時の通知ポップアップ。 昇格がかかった試合に行…

「ビーナスイレブンびびっど!」編成画面は表示するパラメーターが多い画面。目が泳がないようにする工夫が隠れてた!

こんにちは!ちょこです! スタメンのキャラを入れ替える際にボーナスが付くかどうかが、UIが光って知らせてくれて分かりやすかったです! 画面の左上にフィールドのUIグラフィックがあるのですが、光ってるの分かりますかね…。 ▲フィールドが他と比べて明る…

「ビーナスイレブンびびっど!」ショップ画面がめっちゃ可愛いデザインだったのでご紹介!

こんにちは!ちょこです! 「ビーナスイレブンびびっど!」のショップがめっちゃ可愛かったので紹介です! 値札が貼ってあるのが凄く良いですね! 個人的にはこういう汎用パーツを使わないデザインの方針は「世界観没入型」と呼んでいます。反対に汎用パーツ…

「ビーナスイレブンびびっど!」動画広告を観せるための画面のデザインがスタジアムのスクリーン風のデザインだった!

こんにちは!ちょこです! 「ビーナスイレブンびびっど!」の動画広告を見せるためのデザインが世界観に寄り添ってて凄い! システム的ではなくスタジアムのスクリーンというデザインです!世界観に寄り添っていて凄く良いと思いました! 遷移としてはこんな…

「ドラゴンエッグ」典型的な損失回避の法則の実例を紹介します!

こんにちは!ちょこです! ギルド加入の訴求に「損失回避の法則」が使われていました! 「ハンターさん!こんにちは!もしかして………「連合ギルド」に所属されていませんか? 「連合ギルド」から脱退して、「一般ギルド」に入らないと大損ですよ!!!WARNINGで…

「ドラゴンエッグ」大事なリソースで桁数が多い場合は区切りのカンマがあると分かりやすい

こんにちは!ちょこです! 桁数があまりに多い時は区切りのカンマがないと、一見して桁数がわかりづらく感じます! こちらの画面は課金石で回すガチャの実行確認ダイアログなんですが… 消費数が500万となっててさすがにインフレが凄くて驚きました。 ▲衝撃的…

「ドラゴンエッグ」NEWの主張が強いんじゃあ

こんにちは!ちょこです! 「ドラゴンエッグ」のガチャ画面でNEWの主張が強すぎると感じました! ガチャ結果なんですが、NEWがサムネイルとがっつり被って何を獲得したのか分からないんですよね… 動きで見るとこんな感じです。 ▲NEWの主張がつよつよ ある程…

「戦国アスカZERO」スワイプした時のリアクションが素敵!カジュアルゲームの手触り感の参考になりそう

こんにちは!ちょこです! 「戦国アスカZERO」の城下町でリソースを獲得する時の操作が気持ちよかったので紹介です! 簡単に仕様を説明すると、ホーム画面である城下町にキャラクターや建物が複数表示されており、一定時間ごとに人口や貨幣などのリソースが獲…

「戦国アスカZERO」パネルミッションのパネルを開ける順番がデザインされていると感じた理由

こんにちは!ちょこです! 「戦国アスカZERO」のパネルミッションの開けられる順番のデザインがちゃんと考えられていたので紹介です! ▲初心者パネルミッションの初期状態 まずパネルミッションの挙動の説明を簡単にすると… 「何かしらゲーム内で条件を達成…

「戦国アスカZERO」武将一覧画面が良かった。メンタルモデルを活用しつつ、使い勝手も工夫されている

こんにちは、ちょこです! 「戦国アスカZERO」の武将一覧画面が画面の広さを十分に活かしたデザインだと感じました! 左にサムネイルの一覧が表示され、右側に簡易表示されていました。 良いですね! 今までプレイしてきたタイトルのキャラクター一覧画面っ…

「戦国アスカZERO」動画広告で石が貰える!ショップに導線があるけど最適な配置場所は今後どうなっていくのか

こんにちは!ちょこです! 「戦国アスカZERO」でも動画インセンティブが採用されていました! こちらのボタンを押すと動画視聴に遷移します。 ▲ブラウン管TVをモチーフとしたデザイン 先日紹介したQ&Qアンサーズでも動画インセンティブがありましたね。 ▲プ…

「戦国アスカZERO」画面遷移演出があるとメリハリが生まれる

こんにちは!ちょこです! 「戦国アスカZERO」の画面遷移の演出が良かったので紹介させてください! 襖 扇 城門 襖 まず最初は襖のデザインです。 こちらはゲーム中にロードが挟む場面で多く登場します。 動かすとこんな感じです。 ▲まぁまぁな勢いで開閉す…

「ステラセプト」パラメーターを上げるのは手段であって目的ではない。自動割振機能を使うと育成方針に沿ってLVを上げてくれる

こんにちは!ちょこです! 「ステラセプト」でキャラを育成しようとした際に、育成方針を聞かれてユーザーフレンドリーさを感じました! ▲ステータス画面からキャラ育成ができます こちらの「LVを上げる」からステータスを強化します。 すると以下の情報が表…

「ステラセプト」メッセージ枠の位置を演出によって変えていた。ユーザーに強く印象付けたい場面ではありかも

こんにちは!ちょこです! 「ステラセプト」にてメッセージ枠の位置を演出の一部として扱われていました! 通常はこういった感じで画面下部で会話が進行しますが、稀に 画面上部や… 画面中央など… メッセージウィンドウの位置を演出の一部として扱っているの…

「ステラセプト」移動時間はストレスの温床。ルーチンとなる作業にルーラは必須になるという話

こんにちは!ちょこです! 「ステラセプト」でクエストをクリアしたら瞬時に場所を移動してくれる機能が便利でした! もうMMORPGでは基本的な機能の一つだと思っていますが、改めて便利だな、と感じました。 この機能があることによって、移動時間の短縮に繋…

「レッドストーン2」移動中にUIパーツが非表示になる工夫

こんにちは!ちょこです! 「レッドストーン2」で移動時にUIが非表示になるのが良かったです! ▲画面は非表示アニメーションの最中 このように、キャラクターの移動を開始するとUIパーツが非表示になります。 ▲とことこ走るよ! UIパーツを非表示にすること…

「レッドストーン2」アイテムの区別は必要。シルエットに違いを持たせるのは目的ではなく手段という話。

こんにちは!ちょこです! 「レッドストーン2」のショップにて、デザインが似ているアイコンが画面内に複数あり、ぱっと見で区別出来ずにストレスに感じました… ▲ショップ画面 区別が出来なかったデザインはこちら。 ▲一瞬区別出来ず。よく観察してみても判…

「レッドストーン2」装備図鑑でLvごとのパラメータが確認できる。最大値以外も見たい…のか?

こんにちは!ちょこです! 「レッドストーン2」の装備図鑑で各Lvごとのパラメーターが確認できるUIが興味深かったです! レベルごとにパラメーターが確認できるのが面白い表現だな、って思いました。 スライダーは無段階での調整ですが、ボタンを押すと5ごと…

「レッドストーン2」クエスト報酬で獲得装備したアイテムをすぐ装備させる導線が便利!

こんにちは!ちょこです! 「レッドストーン2」でクエスト終了時に、獲得した装備品をすぐに装備できる導線が便利でした! 「レッドストーン2」ではクエスト終了時に装備が獲得出来ます。その際にすぐに装備できる導線があり、大変便利です。 ▲クエストをク…

「Q&Qアンサーズ ~クイズRPGでオンライン・バトル~」世にも珍しい表記の統一に関する参考資料

こんにちは!ちょこです! このブログでしばしば用語の統一に関する話題を書いてきたのですが、「Q&Qアンサーズ」のゲーム内に面白い資料があったので紹介します。 【クイズ作成ガイドライン(詳細版)】です! ゲームUIデザイナーの作業範囲のひとつに校正作…

「Q&Qアンサーズ ~クイズRPGでオンライン・バトル~」おためしプレイってコラボやキャンペーンでの新規流入を狙ってたのかな…

こんにちは!ちょこです! 「Q&Qアンサーズ ~クイズRPGでオンライン・バトル~」のタイトル画面におためしプレイというボタンがあります。 気になりますね!おためしプレイ! ▲タイトル画面にある「おためしプレイ」 ▲「おためしプレイ」ボタン ヘルプを見…