【考察】なぜ『ファイナルファンタジー』シリーズのHPゲージは右下なのか？システムによって変化する最適なUIデザイン

今更言うまでもない事ではあるが、ゲーム画面においてHPゲージを始めとした『UI（ユーザーインターフェース）』は重要な要素としてゲーム内に存在しており、HPゲージやMPゲージ、弾薬数、速度計、スコア、そしてレーダーや地図、クエストやコマンド、アイテム欄など様々なもので構成されている。

f:id:shiftwinter:20161127111035j:plain

しかしこういったゲージ類は作品によって大きく異なった位置に割り当てられている。例えば、ある作品では左上に配置されていたHPゲージが、別の作品では左下に配置されていたり、中央上部に表示されているというケースも見たことがあるだろう。

それはなぜだろうか？

なぜ、HPゲージは左上で固定されていないのだろうか？

なぜ、弾薬類の表示は右側に集中しているのだろうか？

なぜ、速度計は右下に配置されているケースが多いのだろうか？

なぜ、コマンドメニューは下側に配置されているのだろうか？

そもそもなぜ、普段遊んでいる時は、このような配置で「収まりが良い」と感じてしまうのだろうか？

普段は見過ごしがちな点だが、一度考えるとなかなかどうして疑問が尽きなくなってくる。

今回はこういったゲームにおいて最適なゲージ類の配置とはどういったものなのだろうかという事を、遊び手側からの目線ではあるが、複数の観点から考えていきたいと思う。

今回の記事には独自研究が過分に含まれているため、実際の認知心理学的な側面から考えた際の観点からは大きく異なった推測を行っているかもしれないことはご容赦願いたい。

ていうか検索しても基本的な配置方法に対して見つからないし書籍やスライド探しても大抵が既に前線にいる人が前線にいる人に向けて書いているタイプの見栄えや使い勝手に対するTipsばかりでアンチパターンの提示とかそういうのがまずヒットしてしまいそれはそれで大変便利なんだけど、そもそもの基本的な認知的視線移動の側面からのアプローチが行われているような資料が少ないので割と作成に苦労したというか良い書籍あったら教えてください探し方が悪いんだと思うごめんなさい

視線移動からの分析

HPゲージは左上に集まる

さて、無作為にゲーム画面を眺めてみるとその多くの場合でHPゲージが左上に配置されているケースが多いことに気付くだろう。

f:id:shiftwinter:20161127103904j:plain

なぜこの配置が良いと認識されているのかについて考察してみたいと思う。

この考察を行う上で確認しておきたい概念が存在する、それは「Zの法則」「Fの法則」と呼ばれている視線移動の基本原則だ。

Zの法則から考えるUI配置

さて、「Zの法則」「Fの法則」とはなんだろうか？

一部の言語を除いて文字の大半が左や上から始まることからも分かる通り人間の目は左から、上から読み取ろうとする習性がある。この視線移動の傾向を大まかに分析すると大抵の場合が「左上」→「右上」→「左下」→「右下」とZ字状に移動する事が多いため「Zの法則」と呼ばれているのだ。

ちなみにこの視線移動の縦幅を短くしたような「左上」→「右上」→「少し下がった左上」→「少し下がった右上」とスキャンするように確認するケースも存在しこちらは「Fの法則」と定義されている。

web-directors.net

「Fの法則」はスクロールを伴うような場面、いわゆるWEBサイトを中心に適用することが可能であると考えられている。

対して「Zの法則」はチラシなどのような単ページで完結するようなものを中心に適用されやすいと考えられている。基本的にゲーム画面は大幅な遷移が頻繁に起きない単一の画面とみなすことが出来るためこの「Zの法則」が適用できるものと仮定してこれから考察を進めてみる。

f:id:shiftwinter:20161127103924j:plain

こうしてみると分かるように、視線移動における始点となる左上部分に、HPゲージなどが配置されていることが確認できるだろう。

便利と煩さは紙一重

次の項目に進む前に、上部にUIを配置する際に発生するリスクについても語っておく必要がある。こいついつも寄り道してんな

先の項目で左上にUIを配置する利点は「目立つから」ということを説明した。だが目立つということは便利であると同時に画面がうるさくなるリスクも孕んでいる。目立たせるあまり肝心のキャラクター含めたゲーム画面が見辛くなっては元も子もない。

その為の対策として考えられるのが、ゲージ自体を細く長く設定したり状況に応じて消えるようにするというデザインやギミック方面でのアプローチや、そもそもの配置を下側に密集させるという項目優先度の変更などである。

例えばベヨネッタやモンスターハンターなどアクション系の幾つかは、HPゲージを細く長くデザインすることで見栄えと配置の両立を図っている。また、RDRやGTAなどのロックスター作品では左下にHPやSPなどのゲージに加え、地図などの要素も密集させた思い切りの良いミニマルなUIを実装している。

f:id:shiftwinter:20161127104009j:plain

このゲージ類を密集させるというのはファイナルファンタジーのUI構築においても重要なポイントなので抑えておきたい点だ。

重要なのはHPだけではない

また、ゲームによっては重要だと思われるものと判断されれば体力以外の要素が設置されるケースも少なくない。

例えばスプラトゥーンでは数発食らうことで即撃墜され、その瀕死具合は画面周囲から浸食するようなエフェクトを以って表示される。なので基本的にHPは意味を成さず、それ以上に戦力状況や残り時間などが重要視されると考えられる。

このことからスプラトゥーンでは「左上」に残り時間が、常に対峙する構図になるため戦力状況は「中央」に配置されるような構図で設定されていると推測することが出来る。

f:id:shiftwinter:20161127104235j:plain

また例えばFALLOUT3やFONV、4などのベセスダのRPG作品では、クエストや目標周りが特に重要であると見做され、画面左を中心にクエスト名やアイコン、短期目標、新規発見地点などが表示されていると考えることが出来る。

f:id:shiftwinter:20161127112156j:plain

以上から分かる通り、「画面左」にはHPを中心としたそのゲーム内で重要と認識される要素が配置されているケースが多いことが確認できる。

だが、作品によっては弾薬や速度などのほかにも重要と思われる要素が、先で示した視線移動法則における優先順位は最下位であると思われる「右下」に配置されているケースも少なくない。

その点については、今まで考察していた視線移動とはまた異なる概念で分析する必要が出てくる。

次項ではその点について考えてみたいと思う。

操作から分析する

右下に集中しやすい要素とは

ここで、いわゆるFPSやTPSなど、シューター系の作品に目を向けてみよう。

FPS/TPSで重要視されるパラメータとは何だろうか？

おそらく殆どの場合において体力よりも弾薬数（マガジン内含む）が特に重要であることは明らかであろう。特に体力の概念が自動回復される形式が一般的になった昨今では俄然その傾向が強くなっていると考えることが出来る。

f:id:shiftwinter:20161127105758j:plain

だがそういった弾薬数周りは大抵の場合は「右上」「右下」など主に右側を中心に表示されている。

次にアクセル操作が中心なレースゲーム系のUIを見てみよう。

f:id:shiftwinter:20161127104337j:plain

こちらも一部の例外こそ存在するものの、大抵の場合で「右下」に配置されているケースが多いことが分かるだろう。

ボタン指示としてのUI

右側に配置が集中しやすい画面表示物として他に考えられるのは、ゼルダの伝説やアサシンクリードに代表される「ボタン対応型の操作表示」だろう。

これらのUIはどう操作すればよいのかの即時把握にも一役買うのと同時に、状況に応じた操作変化への把握が容易になる利点も兼ね備えている。

f:id:shiftwinter:20161127105847j:plain

マリオ64辺りで発生していた「会話時のジャンプやパンチの暴発」という問題点を、時のオカリナではZ注目と絡めることで解決に向かっていったわけだし。延長としてアイテムやコマンドを好きにアサインする「ホットキー」「アイテムショートカット」という概念も実装することが出来るわけだ。

このボタン指示UIの例として当てはまるケースとして、モンスターハンターのアイテム欄も之に該当すると考えられる。

フィッツの法則

なぜ、これらの項目は右側の配置でわかりやすいと認識されているのだろうか？それはコントローラーの仕様から分析することが出来る。

ゲームのコントローラーはファミリーコンピュータの時代から一貫して「左側に十字キー」「右側にABボタンなど」が配置されている為、操作指示はコントローラーと同じようなボタン配置やデザインを割り振ることで即時の操作の把握を行うことが出来ると考えることが出来る。

その為結果的にボタン指示としてのUIは、その割り振りが行われやすいABボタン側である右側に設定されることが分かる。

つまり、『フィッツの法則』をコントローラーと画面間における、視線移動に加えて無意識下での認識の遷移として定義することで優位性が認められていると推測することが可能なわけだ。

フィッツの法則 - Wikipedia

また、FPSやTPS、レースゲームにおいても射撃やアクセルの操作は右トリガー側で行われている為、そのインタラクトの即時反映として右側にスピードメーターや弾薬数などのUIが配置されやすい傾向の説明にもなる。

以上の事を総括して分析すると、画面表示において左側は「何かしらの影響を与えた結果、生じる可能性のある比較的受動的な上下幅が存在する数値」、右側は「ボタンを押下した瞬間に発生する比較的能動的な表示」が配置されやすいと考察することが出来る。

FFにおける例外

ここでようやくファイナルファンタジーの話に移行することが出来る。前置き長いよ。まず分析するのはシリーズ内でも例外的なUI配置が行われている作品からだ。

さて、ボタン指示としてのUIが適用されているファイナルファンタジーシリーズの作品がふたつ、存在する。

それは『ライトニングリターンズファイナルファンタジーXIII』と『ファイナルファンタジー零式』である。

f:id:shiftwinter:20161127110104j:plain

このふたつの作品の特徴的な点は、ゲームパッドは右側ABXYポジションにコマンドが割り当てられており、その位置に対応するかのように、ボタン割り当て表示もまた右側に配置されている。これは先に挙げたボタン指示としてのUI、「ボタンを押下した瞬間に発生する比較的能動的な表示」としてのUIが適用されていると考えられる。

f:id:shiftwinter:20161127110127j:plain

(ちなみにMMOとして作られた『FFXI』『とFFXIV』はまた色々と前提となるシステムや取り巻く環境が異なるため、今回は割愛することにする。こちらはこちらで非常に面白い配置コンセプトが為されているのだが・・・・)

ボタン割り当てとしてのFFでのUIコンセプトはこれで判明した。そしてここから踏み込んで考えると他のFFのユーザーインターフェース配置の意図も見えてくるようになる。

FFは何をするゲームか？

項目決定型ゲーム

さて、ここで基本のFFシリーズの操作を思い返してみよう。

基本的なシリーズ作品で多く設定されているファイナルファンタジーにおいての操作は、基本的に「項目選択」と「決定」の連続である。作品によって自由移動が伴う作品もしばしば見受けられるが、それでも基本的にはコマンドメニューで選択して決定し行動を行うというパターンが殆どだろう。

f:id:shiftwinter:20161127110702p:plain

コマンド選択は十字キーで行う、ABXYボタン類は項目決定として機能する。つまり、この場合においての「ボタンを押下した瞬間発生する能動的表示」とは項目選択を行うことで微細に変化するコマンドメニューであると見做すことが出来るわけだ。

以上のことを踏まえると『ファイナルファンタジー』では、まずコマンドを確認して之を操作することが重要視され、HPゲージはじめライフライン周りはその次に認識するもの、と考えられてデザインされ続けているかもしれないと推測できるわけだ。

横に並べることの大切さ

さて、FFとはのコマンドメニューが左下に配置されている理由はこれで判った。ここでようやくFFがにおいてHPゲージが右下に配置されている理由について考察を行うことが出来る。

f:id:shiftwinter:20161127111220j:plain

先に挙げた「Zの法則」と「Fの法則」から再び分析してみると分かるのは、人の視線移動は縦方向での改行に伴い一度認識がリセットされ、再度左からのスキャニングを行うという点である。ここから分かるのは異なった項目を同時に認識させるには縦並びで配置するよりも、多少の距離が離れていることを承知で横並びに配置することが望ましいのではないかという説である。

f:id:shiftwinter:20161127111334j:plain