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

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

「三国ドライブ」色覚多様性対応について。まずは「自分とは違った色の見え方の世界がある」というところから意識して欲しい

こんにちは!ちょこです!

 

「三国ドライブ」で視認性が良くない文字があったのが気になりました。
画面としては以下の画面です。

f:id:appgameui:20201025224423p:image

 

具体的にはこの部分です。
背景が無彩色に近い赤、文字が暗めの赤です。

見づらいと感じた部分をトリミングしました。ヒントの文字が視認しづらいです

オリジナルでも視認性は低いのですが、これをシミュレーターを通してみました。
P(protanopia)型だとこんな感じの見た目です。

背景は灰色です。文字部分は暗い赤です

見えなくはないけど…隠れてる感じがします。

「いや、見えるじゃん」と思う方もいると思います。
画面全体で見るとこんな感じです。

三国ドライブの修練の間のトップ画面です。P型のシュミレーション画像です

情報量が増え、より目立つ情報、読みやすい文字もあります。

ぱっと見で「ヒント」の文字が見づらいと感じるかな、と思います。

見えるかどうか、ではなく、相対的に見づらいかどうか、という軸で判断していただければ。

 

 

色覚多様性の対応はついつい忘れがちになります。
まずは「違う見え方をしているユーザーもいる」ということだけでも意識していくところから始め、慣れてきたらNGな色の組み合わせを意識していくと良いのかなと思います。

 

▼参考資料

 

ユニバーサルデザインの教科書 第3版

高齢者のためのユーザインタフェースデザイン─ユニバーサルデザインを目指して

▲(めちゃ高いけど良かったので会社で購入すると良いです)