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

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

「ライドゼロ (RIDE ZERO)」ゲームのUIを調整できる機能を用意するだけではなく、ユーザーがどのように設定できると効率的であるかまで意識されている

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

 

このブログでは「ゲームのUIを見てみましょう」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。

 

今回は 「ライドゼロ (RIDE ZERO)」からゲーム設定の項目を紹介をします。
ゲーム設定、ゲームオプション、コンフィグなど様々な呼び方があると思いますが、今回紹介するのは、具体的にはゲームプレイ中のUIのレイアウト調整ができる画面の紹介です。

 

それでは早速見ていきましょう!該当の画面はこちらです!

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



 

画面上部に「コンボフォントの細かい調整ができます」と書いてあります。
画面下部にあるスライダーでコンボを示すUIの表示について以下の項目に沿って調整できます。

  • 表示サイズ
  • 表示位置
  • 透明度

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

 

 

 

ゲームプレイ中の画面はこちらです。
デフォルトのコンボ数の表示位置はこの辺りですね。

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

 

サイズ、位置、透明度、3つの調整項目の紹介

では、それぞれの調整項目を見ていきます。

 

まずフォントサイズの調整はこんな感じです。
コンボ数を小さくするとノーツは見やすくなりますが、コンボ数が見づらくなってしまうため、数字がカウントアップする際のカタルシスについては感じづらくなってしまうかもしれません。

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



続いてフォント位置の調整はこんな感じです。
画面中央という軸は変わらずに、上下に移動させることができます。

画面下部にあるとノーツと被りやすくなってしまうのですが、視線移動しなくてもコンボ数が視界に入るため、スコアの把握はしやすくなるため、成績を気にする際には便利かなと思います。

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

 

 

最後に透明度の調整はこちらです。

表示が薄くなることによって、ノーツとの干渉を控えることができます。
数字を見ようと思った際には目を凝らす必要があるのですが、視線移動しなくて済む分には楽かもしれません。

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


 

以上が

  • 表示サイズ
  • 表示位置
  • 透明度

の調整項目の紹介でした。
各項目の評価軸としては、ゲームの快適さとスコアを伸ばすカタルシスとの兼ね合いであるように感じました。

 

 

ゲーム画面を動的に確認しながら設定ができるので、より精度の高い調整ができる

また、ゲーム画面を動的に確認しながら設定ができるので、実際にゲームをプレイした際に、どのように見えるかがイメージしやすいのが特徴的でした。

 

このデザインであることによって、より精度の高い調整ができます

 

実際の画面をプレビューしながら調整できるゲームは稀にあります。
例えばこちらは「パニシング:グレイレイヴン」のデザインです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆
▲パニシング:グレイレイヴン

 

他にも「ガール・カフェ・ガン」

f:id:appgameui:20191224214949g:plain 
▲ガール・カフェ・ガン

 

「ドールズオーダー」などのゲームでも見ることができました。
いずれもアクション性の高いゲームです。 

f:id:appgameui:20200424092607g:plain

▲ドールズオーダー

 

しかし「ライドゼロ (RIDE ZERO)」のように動的に確認できるゲームとなるとあまり数は多くありません。

 

唯一「モダンコンバットVersus」のゲーム設定画面で例を見た程度です。

f:id:appgameui:20200423213153g:plain

▲モダンコンバットVersus

 

ゲームのUIを調整できる機能を用意するだけではなく、ユーザーがどのように設定できると効率的であるかまで意識されている

以上です。

音ゲーはやり込むと瞬間的な判断が連続する、アクション性が高いゲームです。
高難度な楽曲ほど、少しのストレスが結果に現れてしまいます。

 

ユーザーの判断疲れを抑えることでゲームの没入感を高めたり、プレイ時間を伸ばすことにつながるのかもしれません。

「ライドゼロ (RIDE ZERO)」のゲーム設定画面では、ゲームのUIを調整できる機能を用意するだけではなく、ユーザーがどのように設定できると効率的であるかまで意識されていました。

 

ゲームのUIを調整する機能を実装する際の参考になれば幸いです。