アプリゲームUIデザイン

プレイしたアプリゲームのUIデザインに関して、書き残しておこうと思います。毎日24時に更新!

「刀使ノ巫女」色覚多様性の対応について

こんにちは、ちょこきなこです。

 

刀使ノ巫女」をプレイしていて色覚多様性の配慮に関して気になった点があったので、書きました。

 

 

色覚多様性に対する認識

おそらく、デザイナーなら知識として色覚多様性(昔は色弱)の対応方法は知っているはずですが、素材同士の組み合わせだったり、うっかり見落としてしまうことがあります。

 

誤解していただきたくないのは、対応するにあたって、この色は使ってはいけない、という話ではなく、色の組み合わせに注意する必要がある、という話です。

 

例えば、赤と黒の組み合わせは割と頻出する組み合わせなので特に注意が必要です。(注意事項を赤文字にしたり)

 

 

刀使ノ巫女の場合はどこが問題なの?

 

刀使ノ巫女は「New」の文字が配慮不足でした。

f:id:appgameui:20190211112558p:plain

 

この部分ですね。

f:id:appgameui:20190715114353p:plain

見えなくもないのですが、見る気が失せるというか…、すっと目に入ってこないデザインになっています。 

 

 

色覚フィルタ(P型)を通してみると以下のような見え方になります。

f:id:appgameui:20190211112454p:plain

結構落ち込んで見えますね。

 

 

ゲーム中ではNewの文字はアニメーションしているのですが、見づらい文字がアニメーションしてても煩わしく感じます。

 

どうすればよいのか ?

見えづらいのは分かりました。

ではどうすれば良いのか、ですが…

 

マイページを見ると「New」と同様の「新着」を示すデザインは白文字になっています。

左上のトークアイコンのところですね。

 


なので、同じように白文字に置き換えてみます。

f:id:appgameui:20190211110456p:plain▲左上のトークのアイコンのマークは赤地に白文字

 

 

白文字に置き換えるとこんな感じです。

f:id:appgameui:20190211110845p:plain

比較しやすいように一部黒文字を残しています。

見やすくなった気もしますが、色覚フィルタで確認します。

 

f:id:appgameui:20190211113530p:plain

フィルタを入れるとこんな感じになりました。多少見やすくなったかと思います。

 

f:id:appgameui:20190211110316p:plain

大きくするとこんな感じです。

他の画面でも赤地に白文字は採用されているルールなのと、用途的にも同じものなので白文字にしても問題ないのかなと思います。

 

さいごに 

色覚多様性は国や地域差などあります。また人によって見え方に差もあります。あまり話題にあがることは少ないのですが、デザイナーはC型のユーザーだけでなく、他のタイプのユーザーもいることも忘れてはいけないな、と思います。

 

 

 

他のゲームの「色覚多様性」に関する記事も紹介します