こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「404 GAME RE:SET-エラーゲームリセット-」（以降、エラゲ）からナビゲーションのデザインをご紹介します。
ソシャゲはコンシューマと比較して画面数が多かったり、機能を横断する導線が増える傾向があるため、特にゲームに慣れていない内は自分が今どこにいるのか見失うことが珍しくありません。そういう意味ではナビゲーションを意識することはソシャゲのUIにとって重要な要素のひとつなのかもしれません。
以下、主な特徴です。
©SEGA
現在地のアイコンを目立たせている
こちらはキャスト画面です。いわゆるキャラクター一覧画面ですね。
アニメーションで見るとこんな感じです。
©SEGA
よく見ると画面右に表示されているメニューアイコンの一部がアニメーションしています。これは現在いる画面に対応したアイコンにアニメーションが付けられています。
今はキャスト画面にいるので、キャストアイコンがアニメーションしている、という状況ですね。
コントラストが高く、アニメーションの速度が高いのでしっかりと目立っている
遠目からでもかなり目立っていますが、よりアニメーションの中身が分かりやすいように該当部分を大きくしてみます。
©SEGA
このようにキャストアイコンの周囲を光がくるくると回っているのが分かります。
周囲のグラフィックと比較してコントラストも高めで、アニメーションの速度も速いため、動いている面積は小さくてもしっかりと存在感をアピールしています。
「エラゲ」の場合、現在地をユーザーにしっかりと伝えたい、と考えたのかもしれません。どの程度目立たせるのが適切なのかはケースバイケースですが、視線誘導をさせたい場合は多少大げさに動かすと良いのかもしれませんね。
ナビゲーションとアニメーションの関係はよく分からない
©SEGA
メニューアイコンがアニメーションし、視線が誘導されていることは分かるのですが、ナビゲーションとアニメーションの関係性までは十分に分析できていません。
ソシャゲの場合、イベントやガチャなどでアイコンをアニメーションさせるなどして目立たせるケースは珍しくないこと、
また、アニメーションさせるほど情報を目立たせる必然性が自分の中で解釈できていないことなどが主な理由です。
以上です。
ナビゲーションのデザインの参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「404 GAME RE:SET-エラーゲームリセット-」のガイドラインを確認したところ、以下の記載がありました。
本ゲームの著作物は、個人用かつ非営利目的のホームページ（Webサイト、ブログ、SNS、画像・動画投稿サイト、掲示板などのサービスを対象とします）において、以下の範囲、条件のもと公開することを許可いたします
これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
