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

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

「パニシング:グレイレイヴン」HPが少なくなったら画面が赤くなる。結果ユーザーの行動を変えることができるデザイン

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

 

今回は「パニシング:グレイレイヴン」にて、バトル中にキャラクターのHPが少なくなってきた時の画面演出を紹介します。

ユーザーに緊張感を与えたかったり、ユーザーの行動をデザインさせたい際の参考になれば幸いです。

 

該当の画面はこちらです。バトル中のワンシーンです。

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

 

 

…といっても、これだけ見ても分かりづらいですよね。通常のバトルと比較します。

通常のバトルはこんな感じです。

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

 

そしてピンチになった時の表現はこちらです。
画面上下が暗くなったりしているのが分かりますかね…

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

  

この演出はキャラクターのHPが減り、危機的状況になると表示されます。

ゲームの表現としてはレガシーであり、比較的よく見る表現ですが、この表現をすることによってユーザーにどういった印象を与えるかなどを考察してみました。 

 

   

演出の目的

まずは演出の目的について考えてみます。
HPが少なくなっているとゲーム進行上のリスクがあるため、ユーザーに危機的状況であると伝えるということが演出の目的かと思います。

 

 

手段について

続いて手段について考えてみます。


さきほど、演出の目的を「ユーザーに対して危機的状況であることを伝える」と仮定しました。

HPのリソース管理は非常に重要です。
HPが少なくなるとゲームオーバーになるリスクが高まり、ユーザーにとってデメリットがあります。


「パニシング:グレイレイヴン」はアクション性の高いゲームなので、短い時間でしっかりと情報を伝えることが求められます。

 

情報を伝えるだけであれば画面左上のHPゲージでも伝えています。

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

▲数字とゲージで直感的に伝えている

 

しかし、画面の面積に対してあまりに小さな情報です。
配置されている位置も画面端であり、戦闘中は視線が集中しない場所であると考えられます。

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

 

したがって、より分かりやすくするために、画面全体を覆うように大きく表示するデザインにしたと考えられます。

画面全体を覆う程大きければ、周辺視野で情報を拾うことも可能となり、ユーザーにも気付かれやすくなります。

また、アニメーションすることにより、注意が向く効果も見込まれます。
◆◆◆◆◆◆◆◆◆◆◆◆◆◆

 

また、画像では伝わらないのですが、キャラクターの声でも危機的状況であることを伝えています。

音声を使うことによって、目が不自由なユーザーであってもキャラクターの状態がわかる仕組みになっていました。

 

 

このUIがユーザー与える効果

最後に、このデザインによって、ユーザーに与える効果を考えてみたいと思います。
大きく3つの効果があると考えました。

  • キャラクターの危機であることが伝わる

1つめの効果は「キャラクターの危機であることを伝える効果」があると考えます。

画面の上下を赤くすることで、キャラクターの出血、視野狭窄、動悸などの体調不良をなどを表現していると推測します。

この表現によって、キャラクターHPが減っているという情報だけではなく、
いつもと違う状態という違和感、続いて危機的状態であることが直感的に察知され、HP残量に注意が行くデザインになっていると考えます。

 

整理すると以下の流れでしょうか

  1. 視覚的な違和感を覚える
  2. 危機的状況、ネガティブな状況だと察知
  3. HPゲージに視線移動

 アクションゲームのような画面内の変化が激しいジャンルの場合、アクションに注意を払い、キャラクターの状態を見落とすことがある。

なので、ちょっと強めに 伝えると効果的であるように感じました。

 

  • 過剰なストレス、緊張感を与える

続いて2つめの効果は「ユーザーに過剰なストレス、緊張感を与えること」が考えられます。

そもそも戦闘行為自体がストレスを与える行為です。
格闘家などは別にして、日常的に戦闘行為をすることは稀です。

実際に起きた場合は強いストレスになることが考えられます。

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

 

そういった土台がある中で、「パニシング:グレイレイヴン」では更に危機的状況を伝えるUIを強調しています。
そのため、ユーザーに過度にストレスを与え、緊張感を持たせることができるのではないか、と考えました。

 

  • 行動の変化

最後に3つ目の効果です。
3つめの効果は「ユーザーの行動の変化」が考えられます。

HPの残量が少なくなれば負ける可能性が高くなります。
その結果、ユーザー行動を変える可能性があります。

具体的には、ゲーム内における戦略の変更が考えられます。

例えば、他のキャラクターと戦闘を交代するか、現在のキャラクターのHPを回復するか、今以上に敵と慎重に戦うか、イチかバチか強行突破するか、などの選択肢があります。

ユーザーはそれらの選択肢から、よりリスクが少ない行動をとるように判断することが可能です。

負けてしまうとクエスト失敗となってしまうため、それを回避するための行動をとる可能性が高くなります。

そういった意味で、ユーザーの行動を変化する可能なのかな、と考えます。

 

 

以上です。

画面を赤く明滅するデザインを取り入れることによって、ユーザーの不利益を回避する機会を与える仕組みであるように感じました。

他にも伝え方はあるとは思いますが、一例として紹介させていただきました。 

演出の目的や方法などを検討する際の参考になれば幸いです。

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