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

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

「Re:ゼロから始める異世界生活 Lost in Memories(リゼロス)」トグルボタンのオン状態は右か左か

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

 

Re:ゼロから始める異世界生活 Lost in Memories(リゼロス)」にて、トグルボタンの挙動が気になりました。

 

該当の画面はこちらです。

f:id:appgameui:20210124135955p:image

 

 

トグルボタンはこの画面の下部にある「オート周回」のラベルのところに使われていました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

オン/オフの挙動はこんな感じです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

このデザインのどこが気になったのかと言うと、オン/オフが逆になっているところです。

 

例えばiPhoneのUIパーツはこちらです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

 

他にはchromeのパーツはこちらです。

 

どちらの状態がオン/オフであるかは特に厳密に決まってはいないと思います。

 

ただ、自分が見た限りでは代表的なプラットフォームは「右側にスイッチがある状態がオン状態」でした。

 

Re:ゼロから始める異世界生活 Lost in Memories(リゼロス)」はそれらと逆の挙動になっています。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

そのようなデザインを選択することは自由ですが、なぜそのようなデザインにしたのか説明できる必要はあると思います。

何か解決したい問題か、強いモチベーションが必要だと思うのですが、利便性の観点からはユーザーのメンタルモデルを無視するほどの意味は特に見当たらないように感じました。

 

例えるなら、エスカレーターに乗る際に右側を空けるか左側を空けるかは自由だけど、なんとなく周囲に合わせた方が無難、という感覚です!

 

 

話を戻します。

トグルボタンをデザインする際は 

  • ユーザーが見慣れているプラットフォームのデザインに合わせる
  • 現実世界でのスイッチのデザインと合わせる

 などを心掛けるのが良いのかなと思います。

 

また、ソシャゲのゲームUIはweb由来のUIパーツを利用することが多いです。

ですので、web由来のUIパーツの利用についてもある程度把握しておいた方が、ユーザーの学習コストや認知コストを抑えたUIが作れる確率は増します。

そういった意味で、webUIのパーツについて学ぶのは良いのかなと思いました。

 

ただ、webUIのデザインの思想をゲームUIにどの程度参考にするのが良いのかは難しいところがあります。それは個々が判断する必要があります。

 

最低限の参考に留めるのであれば

  • UIパーツ単位の挙動のルール
  • 利用する際のルール
  • どういった使い方が良くないのか(何がアンチパターンになるのか)
  • どういった時に利用するのが良いのか

などは参考にしても差し支えないと思います

 

以上です。

トグルボタンをはじめ、webUIのパーツを利用する際の参考になれば幸いです。 

 goworkship.com