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

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

018_UIパーツ

「崩壊3rd」リングゲージUIは長押しすることで操作できることがある、と伝えるための工夫

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「崩壊3rd」から、リングゲージのUIデザインご紹介します。 該当の…

「崩壊3rd」ドロワーのデザインを考えてみた

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「崩壊3rd」から、ドロワーのデザインと開閉の挙動についてご紹介し…

「ポケモンユナイト」ゲーム設定に色覚多様性対応があった、オンにすると自キャラのHPゲージが目立ちやすくなる

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ポケモンユナイト」から、ゲーム設定の中に色覚サポートがある事…

「ポケモンユナイト」ロードの進捗状況に合わせて、プログレスバーの上にいるピカチュウも進んでいくエンタメ感あるデザイン

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ポケモンユナイト」から、プログレスバーのデザインを紹介します…

「ガーディアンテイルズ」敵を倒した時のHPゲージの消滅アニメーションの紹介

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ガーディアンテイルズ」通称「ガデテル」から、敵を倒した時のゲ…

「ドラゴンクエストけしケシ!」消しゴムモチーフだから進行度合いが消えるデザインでも成立している!

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです! 今回は「ドラゴンクエストけしケシ!」通称「DQけしケシ」のロード中の進…

「オクトパストラベラー 大陸の覇者」長押しするとゲージが表示されるので、何かアクションがあることが分かりやすい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「オクトパストラベラー 大陸の覇者」通称「オクトラ大陸の覇者」の…

「ディープインサニティ アサイラム」長押しするとリングゲージが表示されるので、長押し操作に気付きやすい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ディープインサニティ アサイラム」の長押しをすると表示されるリ…

「ドラッグ王子とマトリ姫」チェックマークのデザインがハートマークになっていて華やか

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ドラッグ王子とマトリ姫」、通称「マトリ姫」のシナリオのフィル…

「ワールドエンドヒーローズ」リングゲージがあることで長押しに必要な時間が分かるデザインになっていました

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ワールドエンドヒーローズ」、通称「ワヒロ」のリングゲージのUI…

「あんさんぶるスターズ!!Music」メニューアイコンとドロワーのアイコンが一体となったデザインになっていました

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「あんさんぶるスターズ!!Music」、通称「あんスタ」のアドベンチ…

「ドラゴンクエスト ダイの大冒険 -魂の絆-」サムネイルを長押しするとリングゲージが表示されて分かりやすい

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ドラゴンクエスト ダイの大冒険 -魂の絆-」、通称「魂の絆」で採…

「永遠の7日-終わりなき始まり」ゲージの境界線に白い筋を表示して視線誘導をし、情報量の多い画面でも見やすくしていた

こんにちは!ちょこです! このブログでは「ゲームUIを見てみよう!」というテーマで毎日ゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです。 今回は「永遠の7日-終わりなき始まり」、通称「とわなな」のゲージのデザ…

「ロマンシング サガ リ・ユニバース」ちょっと特殊なドロワーメニューのデザイン紹介

こんにちは!ちょこです! このブログでは「ゲームのUIを見てみよう!」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ロマンシング サガ リ・ユニバース」、通称「ロマサガRS」のUIパー…

「ブラック・サージナイト」縦長のスライダーを採用している理由は手数の省略の為?

こんにちは!ちょこです! このブログでは「ゲームのUIを見てみよう!」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「ブラック・サージナイト」のゲーム設定画面にあるスライダーのUIを…

「極夜大陸:メテオの彼方」タブボタンは上にあるのが当たり前?下タブの方が押しやすい

こんにちは、ちょこです! このブログでは「ゲームのUIを見てみましょう」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「極夜大陸:メテオの彼方」の下タブのデザインについて考えてみま…

「極夜大陸:メテオの彼方」HPゲージが斜めだった時の減少アニメーション

こんにちは、ちょこです。 このブログでは「ゲームのUIを見てみましょう」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。 今回は「極夜大陸:メテオの彼方」のHPゲージがナナメであった時の減少ア…

「パニシング:グレイレイヴン」敵のHPゲージを重ねるデザインは画面に動きが出るのでアクション系のゲームに向いてると思う

こんにちは!ちょこです! 今回は「パニシング:グレイレイヴン」の敵HPゲージのデザインについて考えてみました。 敵のHPゲージのデザインを検討する際の参考になれば幸いです。 該当の画面は以下です。 分かりやすいようにHPゲージを拡大してみます。HPゲ…

「アッシュアームズ-灰燼戦線-」長押しできるところには、それが分かるUIがあると良さそう

こんにちは、ちょこです! 「アッシュアームズ-灰燼戦線-」にて、キャラクターのサムネイルを長押しすると反応がすることが分かるUIが実装されていました。 該当の画面はこちらです! このキャラクターのサムネイルを長押しすると円ゲージが表示され、ゲージ…

「魂器学院」HPゲージを重ねるデザインについて考察

こんにちは!ちょこです! 今回は「魂器学院」のボスのHPゲージのデザインについて語ってみたいと思います。 該当の画面は以下です。 HPゲージはこちらですね。 「×8」というのは、HPゲージが8本分あるということを示しています。96%というのは「現在HP/最…

「Re:ゼロから始める異世界生活 Lost in Memories(リゼロス)」トグルボタンのオン状態は右か左か

こんにちは!ちょこです! 「Re:ゼロから始める異世界生活 Lost in Memories(リゼロス)」にて、トグルボタンの挙動が気になりました。 該当の画面はこちらです。 トグルボタンはこの画面の下部にある「オート周回」のラベルのところに使われていました。 …

「三国志名将伝」見た目がチェックボックスなのに挙動がラジオボックスのアンチパターンデザインがあった件

こんにちは、ちょこです。 「三国志名将伝」をプレイしていたら、アンチパターンがあったので事例として紹介します。該当の画面はこちらです。 挙動としてはこのような動作をします。チェックボックスは複数の項目を選択できるUIパーツですが、見ての通り「…

「ハムスターコレクション」スライドバーがありえないくらい可愛い

こんにちは、ちょこです! 「ハムスターコレクション」のスライダーバーがありえないくらい かわいい…!! 該当の画面はこちらです。 こちらが「スライドバー」です。「スライダー」とも言ったりしますね。 動くともっとかわいいです! ほんと、なんでここだ…

「食物語」下地を暗くしてアイコンを明るく描くと、ボタンと認識されやすいよ!

こんにちは、ちょこです。 「食物語」のUIパーツの中でドロワーがありました。デザインの手法としてはスキューモーフィズムです。 デザインの特徴を実例を交えて紹介してみたいと思います。 ドロワーのモチーフとして巻物がよく使われていることを記事にしま…

「ファイナルギア」ホームボタンでメインコンテンツのボタンが縦に並べてあって、指の可動域的に押しやすいレイアウトだと思った

こんにちは、ちょこです。 「ファイナルギア」のボタンが押しやすい配置になっていました。 早速見ていきます! 具体的にはこちらのホーム画面です。 通常、画面下部に並んで配置されがちなメインコンテンツのボタンが画面右側に配置されています。 ここの部…

「三国 -IKUSA-」巻物の形をしたUIって大体ドロワー

こんにちは!ちょこです! 「三国 -IKUSA-」にて画面下部のメニューがドロワーになっていました。 中国のアプリってフッターがこういった挙動になってること多いですよね。なんでだろう…。 挙動としてはこんな感じです。 このドロワーのデザインは現実世界の…

「キャラバンストーリーズ」ドロワーで情報量をコントロールする事例の紹介

こんにちは!ちょこです! UIのパーツの中に「ドロワー」というパーツがあるのですが、ちょっと変わったドロワーがあったので、事例として紹介させてください。 「言葉は知ってるけど使いどころが分からない」 「どこで使っているのか知りたい」 など、悩ん…

「レッド:プライドオブエデン」猫モチーフのデザインがあちこちに。UIパーツに遊び心を取り入れたい際の参考に

こんにちは!ちょこです! 「レッド:プライドオブエデン」では【猫】がキーワードのタイトルです。したがって猫がモチーフのUIパーツが多く見られます。 世界観に寄せたデザインの作り込みの事例として、いくつか紹介します。 1:タップを促す指のマーク 2…

「AFKアリーナ」節電モードの効果を検証してみたけど、差が無かった件

こんにちは、ちょこです。 「AFKアリーナ」にも節電モードがあったので、UI目線でどういったメリットが考えられるのか紹介します。 2019年時点ではあまり気付いていなかったのですが、中国や東南アジアを中心に向けたゲームにしばしば実装されているように見…

「テイルズ オブ クレストリア」HPの数字は見えた方が良い思う理由

こんにちは、ちょこです。 「テイルズ オブ クレストリア」をプレイしていて、戦闘中にHPが数字で見れないのが直感的に違和感を感じてしまいました。その理由をちょっと考えてみます。 ▲キャラクター情報を示すUI まず、なぜHPの数字が見たいのか考えてみま…