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

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

「ドクターマリオワールド」パズルゲームなら色覚多様性の対応は必須。改善案を考えてみたので開発者に届けたい!

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

 

事前DLしてたドクターマリオワールドがサービス開始していました。

BGM懐かしい!

早速UI周りを見てみます。
 

 

 

パズルゲームなので「色覚多様性」の対応が気になりました。

f:id:appgameui:20190710220128p:plain

この3色の組み合わせは大丈夫そう。

 

 

 

念のためPhotoshopのフィルタで確認してみました。

f:id:appgameui:20190710220418p:plain
ブロック部分と赤は気になるけど、ウイルスの方は動いているのでギリ許容かなぁ…。

 

 

 

 

他の色の組み合わせも見てみます。

f:id:appgameui:20190710220638p:plain

 

 

Photoshopのフィルタで確認してみます。

f:id:appgameui:20190710221247p:plain

ん~、ちょっと怪しいかも…。

 

 

 

ウイルスの方はシルエットや表情でも分けてるのでギリギリ…か?

f:id:appgameui:20190710215748p:plain

 

 

 

それより問題はカプセルの方です。 

f:id:appgameui:20190710221747p:plain

これはシルエットで差をつけていないので、ガチンコで色のみの情報になっています。

 


よくユニバーサルデザインの本を読むと、

色だけの情報は避ける
色以外の情報の手掛かりとなるものを付与する

 

ということが書かれています。

例えば模様であったり、パターンであったり、質感であったり。
ゲームであればアニメーションという手法も使えます。

 

 

なので、色だけのガチンコの勝負は危険。

 

 

特に「黄と緑」または「青と紫」の組み合わせが区別が付かなさそう…。

f:id:appgameui:20190710224752p:plain

 

では、ゲーム画面を見てみます。

f:id:appgameui:20190710222033p:plain

 

 

 

先ほどと同様にPhotoshopのフィルタで確認してみます。

f:id:appgameui:20190710222442p:plain

P型もD型もかなり区別つきづらいですが、P型はもう無理ですね。
色の差があることは認識できますが、どっちがどっちのウイルスに対応してるのか分かりません。

 

瞬間的に判断できないので、時間制限のあるステージや、ましてや対人戦は対応不可だと思います。

 

 

じゃあ、どうすれば良いか、という話ですが
カプセルのシルエットを変えるのが無難な気はしています。

 

雰囲気こんな感じ。

f:id:appgameui:20190710223445p:plain

 

 

 各ウイルスのシルエットに合わせるようにすれば判別つくのかな、と。

f:id:appgameui:20190710224018p:plain

あまりやりすぎると「ぷよぷよ」になるのと、カプセルの残りなのかウイルスの残りなのか分かりづらくなるのも心配。

 

とはいえ、見やすさは人によって差があるので、オプションで複数タイプに切り替えられるようにするのが良いかと思います。

 

 

オプションついでに余談なのですが、
設定で過去のBGMに切り替えられたらウケると思う。

 

 

 

 

▼色覚多様性に関して書いた記事を貼っておきます。