#2『Monument Valley』から学ぶゲームデザインの引き出し(2)「UIのアニメーション」
『Monument Valley』（モニュメントバレー）は「錯視トリック」が特徴的なスマートフォン用パズルゲームです。
『Monument Valley』 (c) ustwo games
本作は、ステージ中の通路をタップすることで主人公の少女を歩かせてゴールを目指すのが目的です。
ゲームシステムとして、錯視で有名な「エッシャーのだまし絵」のようなギミックが取り入れられているのが最大の特徴でしょう。
（PSP/PS3で発売されていた『無限回廊』シリーズをご存知の方はイメージが伝わるかと思います）
通路の途中には「回転させる床」や「スライドで動かせる床」などの数々のギミックがあるのですが、その操作により、錯視によって本来繋がるはずのない通路同士が繋がり、思わぬルートでステージを進んでいくことができる、不思議なパズルとなっています。
また、どこか退廃的で空気感のある雰囲気に溢れたビジュアルデザインや、ミニマルなUIデザイン、操作音のサウンドデザインも本作の魅力と言えるでしょう。
UIの操作可能性
さて、今回は「UIのアニメーション」について考えてみます。
UI（ユーザーインターフェース）は、プレイヤーがひと目見て「操作できるもの」なのか「操作できないもの」なのか、伝わる方がより親切です。
代表的なものでは、押せないボタンがグレーまたは暗くなっていて、操作を受け付けないものがありますね。
さて、本作『Monument Valley』では「UIのアニメーション」を用いて秀逸なデザインで、UIの操作状態を表現している箇所があります。
『Monument Valley』 (c) ustwo games
このゲームには回転できる床のギミックが登場します。
プレイヤーはこの床を自由に回すことができるのですが、主人公がこの床の上に乗っている間だけは回転操作ができない、といったものがあります。
このギミック床を回転させるには、建物から突き出た「ハンドル」をタップして回すのですが、主人公が床に乗った瞬間、このハンドルがカラカラと音を立てて建物の中に収納されてしまいます。
そして主人公が床から移動して操作できるようになった時点で、ハンドルがまた建物の中からシュッと現れるのです。
ゲーム中のチュートリアルでは特段「主人公が床に乗っている間は回転することができません」のような説明は行われません。
にも関わらず、ハンドルの出入りが視覚的アニメーションを伴っているため、「ああ、床に乗ったことで回せなくなったんだな」という仕組みを、プレイヤーは直感的に理解することができます。
それに加えてこのアニメーションによって、不思議なからくり箱を触っているかのような感覚になるのも秀逸なUIビジュアルデザインであると言えるでしょう。
UIの動作にアニメーションを付けるというのは、プログラムやビジュアルデザインの工数が掛かりますから、何でもかんでもアニメーションを付けるのが正解ということではありません。
また、単なるボタンのオン・オフに、いちいち大仰なアニメーションを付けたら操作のテンポも悪くなりそうです。
ですが、ゲームにとって重要なUI、伝わらないと困るUIに関しては、効果的なアニメーションを検討してみるのも一案でしょう。
UIアニメーションのアイデア
UIアニメーションが活きる場面を考えてみると、例えば……、
・図鑑のページをめくる操作で、一瞬で記述内容だけが切り替わるのではなく、ページがペラっとめくれる演出を入れる。
・回復アイテムを拾った場合は、それが画面上の体力ゲージに向かって飛んでいってゲージが増加する。
・お金や経験値を獲得した場合は、パッと数字が増えるのではなく数字がカウントアップする。
・残り時間が少なくなった場合は、１秒ごとにアニメーションをつけて警告音を鳴らす。
・鉄格子が開くときは単に消えるのではなく、ゴゴゴ……という音と共にスライドする。
色々な場所にUIのアニメーションを入れる余地はありそうです。
考えてみましょう
あなたの遊んでいるゲームや、開発しているゲームでは、UIの状態変化が分かりづらい部分は無いでしょうか。
プレイヤーが頻繁に行う操作箇所に「UIのアニメーション」を追加するとしたらどのような表現が考えられるでしょうか。
皆さんも是非考えてみてください。
『Monument Valley』
https://www.monumentvalleygame.com/mv1
本連載の趣旨については下記記事をご覧ください。
他の連載記事はハッシュタグ「#ゲームデザインの引き出し」からどうぞ。
（※本記事中のゲーム画像は、「引用」の範囲で必要最低限の範囲で利用させて頂いています）