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

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

「きららファンタジア」チェックとタブのデザインが同じなのが分かりづらい。挙動が違うデザインは見た目にも差をつけて。

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

 

「きららファンタジア」にて、チェックボックスとタブのデザインが同じなので、見た目から予測される挙動が分かりづらいと感じました。

 

f:id:appgameui:20190519223003p:plain

ちょっと分かりづらいデザインですが、上の段はタブの挙動で、下の段がチェックボックスの挙動です。

 

それぞれのパーツの挙動の違いですが、タブは複数選択できません。チェックボックスは複数選択可能です。

このように名前で定義するとそのパーツの振る舞いも定義できますが、見た目が同じですと見分けがつきません。

人は初めて見るものに対して知識や経験に基づいた予測や推測で物事を認識します。ですので、同じ見た目であれば同じ挙動をするものだ、という認識をします。

その後、触ってみて挙動が予想と違った場合、その事を学習します。

 

タブであればタブのメンタルモデルを利用したデザインにすると、ユーザーの学習コストが下がります。

なので、操作する前に見た目で分かるようにデザインに差をつけてあげると「どんな挙動かな」と悩まずに済みますので、触る前の心理的な負担が減ります。

 

 

まとめ

挙動が違うなら見た目も変える。その際はパーツにあるメンタルモデルを利用すると良いです。