視線誘導の話
ビデオゲーム作りで使えるテクニックの紹介。今回は視線誘導についてです。
視線誘導とは
当たり前ですがビデオゲームは画面を見ながら遊びます。そして、画面上にはキャラクター・ギミックといったオブジェクトや、地図・ステータスといったUIなど、様々なものが同時に表示されます。
視線誘導とはその文字通り、視線をオブジェクトやUIに誘導することです。一般的にそういう呼ばれ方をされているかどうかは不明ですが筆者はそう呼んでいます。
視線誘導の２つの使用目的
視線誘導には大きく2つの使われ方があります。
- プレイヤーに情報を認知（気づき）してもらう使われ方。
- プレイヤーの視線移動をサポートしてあげる使われ方。
前者は視線誘導がないと一部のプレイヤーが困ってしまうようなもの。後者はあるとより快適にゲームプレイできるようになるものです。
これらの使われ方を１つずつ説明していきましょう。
認知のための視線誘導の例
認知のための視線誘導についてお話します。
この手の説明は実例を見ていただくことが早いはず！ということで、パズドラ公式さんの動画をリンクさせていただきます。
パズドラは、ドロップと呼ばれる玉を操作するパズルゲームです。同じ色のドロップを縦か横に３つ連続並べると消えます。
では、こちらの動画のドロップを消した際の演出をご覧ください。
[パズドラ公式チャンネル] コツを掴もう！十字組み方講座！ 2:10〜2:25
https://www.youtube.com/watch?v=t-xZdvpjfCs
この演出では次のようなことが連続して起きています。
- プレイヤーがドロップの並び替え操作をする。
- 同じ色が３つ並んだドロップが消える。
- 消えたドロップの箇所から画面上部のキャラクタのアイコンに向かってエフェクトが移動する。
- 移動先のキャラクタのアイコンからダメージの数字が表示される。
視線誘導が関係するのは3番のところです。3番の演出により**「ドロップを消した結果キャラクタにダメージが与えられる」**という認知をプレイヤーにさせています。
このように、プレイヤーが注目しているところから別のところに視線を移して見て欲しい（気づいて欲しい）という場合に使う視線誘導、これが認知のための視線誘導になります。
もし、この視線誘導がない場合、一部のプレイヤーはドロップを消したときに何が起こるのか気づかない、もしくは気づくまでに時間がかかるといったことが起こります。（そんなアホなと思う方もいらっしゃるかもしれませんが、ゲームプレイに慣れていない人だとわりと起こります。）
他にはこんな例があります。
- 『Newスーパーマリオブラザーズ』 マップ移動後のマリオの出現位置からワイプ演出を開始する。（マリオの位置を認知させるため）
- (発展系）『ゼルダの伝説』 謎解きをしたときに扉が開く場合にその扉までカメラスクロールする。（扉の位置を認知させるため）
視線移動で疲れるパターン
続いて視線移動サポートのための使い方についての話をしましょう。ですがその前に視線移動で起こる疲れについてまず知っておく必要があります。というのも、視線移動サポートというのは視線移動で起こる際の疲れを軽減するためのものだからです。
ビデオゲームは視線を移動する行為をプレイヤーに長時間、そして何度も強いるものです。そして、視線の移動はわりとエネルギーを使う行為であり、その行為を繰り返し続けるとプレイヤーは疲れてしまいます。
どういう理由でエネルギーを使い疲れてしまうのかについて、主に２つのパターンがあると筆者は考えています。
１つは、目的の情報への能動的な視線移動時の疲れです。
実生活でイスから立ち上がる際に「よっこいしょー」と奮い立たせる場面があると思います。例えば画面の左端から右端への移動など大きく視線移動する場合に「よっこいしょー」が発生します。
もう１つは、目的の情報の画面範囲を切り替える際の疲れです。
狭い範囲から広い範囲を見るような場合に疲れます。画面上の小さなキャラクタを集中して見ている際に画面全体を覆うようなUIがプレイヤーの予期しないタイミングで表示されたとき目に圧迫感を感じた、というような事例はこれに該当します。
そもそもこのような２つのパターンに該当するような演出はなるべく避けることが大切です。どうしても避けられない場合は、このあと説明する視線移動サポートのための視線誘導を検討すると良いでしょう。
視線移動サポートのための視線誘導
では、本題に戻りましょう。
視線誘導をうまく使うと視線移動の疲れを軽減することができます。
今回例に使う動画は3DS版ドラクエ8の公式動画です。この動画のバトルコマンドを入力している画面をご覧ください。なお youtube では該当のシーンが見られる公式動画が見つからなかったため今回は niconico になります。
ドラゴンクエストⅧ ゲーム実況 DAY1 12:20〜
http://live.nicovideo.jp/watch/lv292470057
「たたかう」「とくぎ」といったキャラクタ毎のメインコマンドが出る際、コマンドのウィンドウが左から右に移動するようなアニメーションをしていることに気づいたでしょうか？
前提として、人間には動くモノが視界に入ると反射的にそちらに視線が移動するという性質があります。ビデオゲームにおける視線移動サポートの多くはこの性質を利用しています。
動画で紹介したドラクエ8ではウィンドウが動くことで自然とそちらに視線が移動します。そしてこのゲームは何回もこのウィンドウを見るゲームです。ですのでこの動きがあることで視線が自然とそのウィンドウに移動し、視線移動に伴う疲れが軽減されます。視線を動かす「よっこいしょ」のタイミングでアニメーション演出することで視線移動をサポートしている、といった感じです。電動自転車の電動アシストのようなものですね。
ちなみに、先ほど紹介したパズドラの例も「動くモノに視線が移動する」という性質を使っています。視線誘導においてこの性質はなくてはならないものと言えるでしょう。
視線移動サポート目的の視線誘導の例ですが、筆者がこの記事を書いている現在アクティブに遊んでいる『ファイアーエムブレム Echoes もうひとりの英雄王』のユニット移動後のメニューウィンドウなどでも見られます。わりと皆さんが知っているタイトルで視線誘導の例を見つけましたら後日追記させていただきます。
うまくデザインされたゲームでは視線移動がなるべく発生しないようなUIの配置をしていたりします。気になる方は「視線移動サポートをどういう風に実現しているか」という視点で普段遊んでいるゲームを見てみるとおもしろいかもしれません。
おわり
ビデオゲームではありませんが、パソコンのOSであるMacOSXではモーダルダイアログ（※）表示時のアニメーションも認知のしやすさや視線移動サポートといった視線誘導の役割があります。
（※「保存しますか？「いいえ」「はい」といった選択肢を表示するダイアログのこと）
このようにビデオゲームに限らずいろんなところで使われている視線誘導。皆さんのビデオゲーム制作で「うまく情報に気づいてもらえない」「視線移動が疲れる」といった症状でお困りの際はぜひ意識してみてください。
リンク：ゲームプログラマの小話-目次