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

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

「魂器学院」縦に長くなっていく端末でタブはどこに置けばよいのか

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

 

「魂器学院」は縦画面のゲームなのですが、タブが側面についていたのが気になりました!

 

該当の画面例を紹介します。

 

魂器学院のチャージ画面です、いわゆるショップ画面です

 


横タブは画面左端にあるこの部分ですね。 

チャージ画面左にあるタブ部分をトリミングしました

 

色んなタブデザインの思想があるなぁ…。

 

 

なんとなくのデザインの思想の経緯ですが、

  • ガラケーの頃はタブは画面上部にあった
  • ボタンを選択する時に上から順にカーソルを移動させていた
  • スマホゲーになり、画面上部のタブは片手操作の時に押しづらいと感じられるようになった
  • 横画面のゲームでは左右に広くスペースが使える
  • そういった経緯から、画面の左右や下部にタブを配置するゲームが増えてきた

…という感じでしょうか。

 

体感による仮説ですが、初期のタブデザインはwebの文脈であり、情報の階層、メンタルモデルによりデザインが構成されていました。

しかし、その後は情報の階層などよりも押しやすさが優先されたデザインになっているように感じます

 

 

タブが見切れていることで分かるかもしれませんが、この部分はスクロールするデザインになっています。

タブ部分の下の方を目立たせるためにトリミングしました

 

タブが上部にあり、左右でスクロールするデザインになっているものよりは…

  • タブが横にあると指が届きやすいのでスクロールしやすい
  • タブが上部にあると指で隠れてしまう

 

などのメリットが考えられます。

 

以上です。

タブの配置は設計を考える際に、デザインを悩ませるもののひとつでもあるかと思います。

情報の階層やメンタルモデルも重要なのですが、操作性と天秤にかけて設計する柔軟性も必要なのかな、と思います。

 

タブデザインを検討する際の参考になれば幸いです。