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

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

020_アンチパターン

「フィッシングスーパースターズ」黒背景に赤文字つかいがち問題。色覚多様性について考えてみました。

こんにちは、ちょこです! 「フィッシングスーパースターズ」にて色覚多様性対応が不十分だと感じた画面を見かけました。 この画面。 一部の文字が読みづらくなっている箇所があります。 一見して分かりますでしょうか? ▲少し考えてみて欲しいです 正解はこ…

「アズールレーン」デザインが気になったところ。とにかく色覚多様性対応の意識だけは忘れないでいて欲しい!

こんにちは、ちょこです! 「アズールレーン」のUIでいくつか気になった箇所があったんですよね…。ちょっとまとめて考えてみます。 なるべく主観によらず普遍的な部分での話でまとめたつもりですが、考察不足であればすみません。 1:情報の扱い方 2:ボタン…

「VOEZ」画面が回転してて没入感に深刻な影響があったけど、記事書いてる間に修正されたので良かった!

こんにちは、ちょこです! 「VOEZ」プレイしているのですが 楽曲プレイ前後に画面が回転するのがストレスに感じます。 どういうことかと言うと… まず、楽曲前に180度回転します。 ▲ぐるーん 楽曲をプレイした後にも再度回転します。 ▲ぐるーん 再プレイを選…

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

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

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

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

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

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

「プロ野球PRIDE」ボタンは画面内に配置するようにしたい

こんにちは、ちょこです。 「プロ野球PRIDE」にてキャンセルボタンが画面外に表示されてて、押しづらく感じました。 ▲キャンセルボタンが画面の外に出ている しかもこれ、スクロールできないんですよね… ソシャゲは色んな画面の比率に対応しなければいけない…

「プロ野球PRIDE」黒い背景に赤い文字は避けた方が良い。色の組み合わせには注意が必要。

こんにちは、ちょこです。 「プロ野球PRIDE」で使用されてる文字色が視認性の観点から気になりました。 ▲お知らせ画面 ▲注意事項 ▲クエスト(?)画面のリストの強調表示 以上です。赤い >< 赤文字って強調色として認知されていますが、実は黒地に赤文字って…

「激ムズ彼氏~ホスト編~」アンチパターン、誤字やレイアウトの不揃い

こんにちは、ちょこです。 「激ムズ彼氏~ホスト編~」プレイしています。今回はアンチパターンの話です。 アンチパターンは「やらない方が良いデザイン」という意味で使われることが多いです。デザインに正解はないのですが、いくつかの不正解はあります。 …

「垢のプリンス~恋の人体錬成~」メッセージ送りの位置に話者グラフィックを表示するのはオススメできない

こんにちは、ちょこです。 「垢のプリンス~恋の人体錬成~」の会話ウィンドウにて、キャラの位置が右下にあったのが気になりました。 この画面。 一見するとメッセージ送りかと思いきや、話者のグラフィックです。 ん~…、これはちょっと分かりづらい…。 恐…

「ワールドサッカーコレクションS」アプリの場合、はいといいえの位置は他のアプリに倣うことが大事

こんにちは、ちょこです。 「ワールドサッカーコレクションS」ですが、 はいの位置が一般的なアプリと逆になっていました。 ▲これなんでだろう…? PCゲームと同時サービスでもないので単純に開発時の考慮漏れか予定外の運用だったのかな…。 2013年6月が配信…

「マギア カルマサーガ(Magia Charma Saga)」アンチパターン、誤字脱字は没入感を阻害する

こんにちは、ちょこです。 「マギア カルマサーガ(Magia Charma Saga)」の会話シーンでの誤字脱字が凄い… ▲語尾にnが付くキャラ ▲「右装備」ってなに? 他にも翻訳文が不自然だったり、ボイスとテキストが一致していなかったり、そもそも主人公の名前を言…

「KING OF PRISM プリズムラッシュ!LIVE」アンチパターン、汎用ボタンの挙動が不統一

こんにちは、ちょこです 「KING OF PRISM プリズムラッシュ!LIVE」のボタンの挙動が気になりました。 1:色変化(薄茶色) 2:色変化(濃茶) 3:色変化(濃茶2) 7:色変化(グレー) 4:ボタンが消える 5:大きくなるだけ 6:変化なし 8:下にさがる 1:色変化(薄…

「エピックセブン」画像を潰して表示するとゲームが面白さに関わらずクオリティが低く見えてしまいがち…

こんにちは、ちょこです。 「エピックセブン」で一番最初に気になったのはお知らせ画面の画像が潰れていることです。 ▲潰さないでー 私の表示環境のせいもあるのかな…。画像が横に潰れてしまっています。 ずっと見てるとよくわからなくなってきた…。 正しい…

「Chess Rush」スマホの画面をデザインする際は情報が指で隠れてしまわないように気を付けたい事例

こんにちは、ちょこです。 「Chess Rush」の図鑑画面の星押しづらいし、情報隠れるんじゃー! どういうことかと言うと… この星の部分、タップ判定あるんですけどね。 ▲進化度合いを示す星 押そうと思うとこのようになります。 ▲キャラが指でがっつり隠れます…

「アークナイツ」情報が指で隠れてしまう強化画面。実機プレビューも重要

こんにちは、ちょこです。 「アークナイツ」強化画面ですが、レイアウトが原因でストレスに感じる場面があります。 強化画面のデザイン 強化画面はこんなデザインになっています。 操作するとこんな感じです。 ストレスに感じた箇所 前提として、横画面のゲ…

「アークナイツ」誤タップが怖い!ボタンが指で隠れないように気を付けて!

こんにちは、ちょこです。 「アークナイツ」でボタンの配置が良くなく、指でボタンを隠してしまう画面がありました。 フレンド申請を承認するかどうかの画面右側にある「承認する」か「申請を拒否する」のボタンです。 これです。 ▲上下に並んでるぞ! 指を…

「アークナイツ」HPゲージで顔が隠れるのはアリやナシや

こんにちは、ちょこです。 「アークナイツ」のバトル中の画面ですが、キャラの顔に情報が被るのが気になりました。 ▲目線が入っているみたいで気になる 同じタワーディフェンスの城プロはこんな感じ。 ん~…正直ビジュアル的にはめっちゃ気になるけど、実際…

「Auto Chess」お知らせ画面。文字が小さいっ!

こんにちは、ちょこです。 「Auto Chess」のお知らせ画面に情報がなく見づらく感じました。どのような画面かというと、以下のような画面です。 ▲お知らせ画面 絵が大きいっ! ここでユーザーの判断や行動の手掛かりになる情報はこの部分だけです。 ▲ここだけ…

「Auto Chess」アンチパターンがあるとアプリに対する信頼性が下がる気がするのは私だけ?

こんにちは、ちょこです。 「Auto Chess」でフィルタのレイアウトで気になるところがありました。 グルーピングが出来ていない 気になるところですが、大きなところで言うとグルーピングです。 この個別のフィルタは以下のようなグループになっているのです…

「Auto Chess」色覚対応が必要に感じる理由をC型(多数派の色の見え方)の人にも実感してほしい事例を集めてみました

こんにちは、ちょこです。 「Auto Chess」に色覚対応のオプション設定が入っていたので、そういったリテラシーがあるのかと期待したのですが残念ながらそんなことなかった…。 一部ですが、文字がめっちゃ読みづらかったです… 1:ユニット詳細画面での事例 上…

「仮面ライダー シティウォーズ」年齢確認画面が気になったので他タイトルと比較してみた。そしたら全部フォーマット違ってた。

こんにちは、ちょこです。 「仮面ライダー シティウォーズ」からバッドUIなデザインがあったのが気になりました。 どんなUIだったか 画面のデザインとしては以下のようなデザインでした。いわゆる課金画面の前に表示される年齢確認の画面です。 枠内に生年月…

「仮面ライダー シティウォーズ」ドロワーのUIを採用する時に注意したいこと

こんにちは、ちょこです。 「仮面ライダー シティウォーズ」のホーム画面にある、メニューボタンのデザインと挙動が気になりました。 注意したいこととしては 挙動が(ある程度)推測できる見た目にする です。以下、詳細と解決案の提案を書いてみます。 どん…

「ガール・カフェ・ガン」数字は進んでいるのにロード画面のプログレスバーが全然進まなくてイライラしてた話

こんにちは、ちょこです。 「ガール・カフェ・ガン」のデータダウンロード画面ですが数字とゲージを合ってないように見えるんですよね… 進捗率を計算してみた 数字をベースに進捗率を計算してみました。 進捗を計算すると12.3%くらいでした。 10等分してみ…

「ヴァンガード ZERO」デッキ画面のUIが良くないと聞いたので、具体的な箇所がどこなのか考えてみました

こんにちは、ちょこです。 「ヴァンガード ZERO」のデッキのUIが良くない、という意見を見かけたので何が原因か考えてみました。 ▲デッキ画面のデザインはこちら.。 デジタルカードゲームのUIの不満は大体デッキ編集画面の使いづらさに対する不満とバトルテ…

「ヴァンガード ZERO」バトル画面のUIが気になりました。具体的にどこが気になったのか考察してみました

こんにちは、ちょこです。 「ヴァンガード ZERO」ですが、バトル中の画面デザインが気になりました。どこが気になったか具体的に挙げてみます。 ▲「ヴァンガードZERO」のバトル中の画面 1:配信で映えない 2:演出の解像度が足りていない 3:縦画面なので配…

「パレットパレード」フィルタがシルエットでも色でも分かりづらいアンチパターン。他タイトルから改善案を紹介します。

こんにちは、ちょこです。 「パレットパレード」のフィルタ機能ですが、どういったデザインなのかコレ…。 全部にチェックが入っているように見えますが、実は違います。 黒いチェックマークは未チェック状態を示しており、チェック状態はピンク色のチェック…

「パレットパレード」一つ一つは細かいけど、たくさん粗があるとアプリのクオリティが下がって見えるので勿体ない

こんにちは、ちょこです。 「パレットパレード」をプレイしていていくつか気になった部分がありました。 こういった部分がきちんと詰められるともっと良くなるのかな、と思います。 1:文字の境界線の不統一 2:画像が切れている 3:画像のパターンが綺麗に…

「ゼノンザード」画面によってメインコマンドの位置が変わるとボタンが押しづらい。目新しいということは、裏返すとやらない理由が隠されていること

こんにちは、ちょこです。 ゼノンザードにて、メインメニューのレイアウトが気になりました。 ホーム画面はメインコマンドが下の方にあります。 メインコマンドはこれです。 カードメニューは上…。 ストーリーメニューは下。 ショップメニューは右にレイアウ…

「ゼノンザード」どっちにスクロールして見える?色んな人にそう思った理由を聞いてみたい

こんにちは、ちょこです。 「ゼノンザード」をプレイしていて気になったので問題にしてみました。 問題:1 問題です。制限時間は0秒です。0秒で判断してください。 以下はカードコレクション画面ですが、どのようにスクロールするでしょうか? 見えましたか…