こんにちは！ちょこです！
このブログでは「ゲームのUIを見てみよう！」というテーマでゲームを紹介しています。少しでもゲームのUIに興味を持ってくれる方が増えると嬉しいです。
今回は「IDOLY PRIDE アイドリープライド」の見出しのテキストのアニメーションについて紹介します。
該当の画面はこちらです！ショップ画面ですね。
こちらのショップ画面の見出しですが、
子階層に遷移した際、親階層の見出しが小さく残り、子階層の見出しが表示されるようなアニメーションになっています。
実際の挙動はこちらです。
こちらは「ショップ画面」から「メインライブクリアパックの画面」に遷移した時のアニメーションです。
見出しの役割はユーザーに今いる場所を分かりやすく伝えること！
分かりやすいように見出し部分を拡大します。
このように見出し部分のテキストがスムーズに変化していることに気付きます。
非常に丁寧な演出です。
この見出しの役割は、ユーザー自身が今どこにいるかをユーザーに分かりやすく伝えることです。
親階層が保持されることによって、遷移前後の画面の関係性が分かりやすくなります。
前の画面に戻る際も、戻り先の画面が明確になります。
必ずしも親階層の画面名が残せるわけではない！
では、必ずしも見出しに上位階層が表示できるかというと難しい部分もあります。
例えば、階層が深くなってしまうと、すべての上位階層を表示するにも限界は出てきます。
また、ソシャゲの場合は同じ画面に遷移するための導線が複数用意されていることも珍しくありません。
育成の場合などが分かりやすいのですが、
育成メニューを選択してからキャラクターを選択する方法もありますし、
キャラクターの下位階層から遷移できるように導線が設置されていることもあります。
こういった事情から、見出しに常に上位階層を表示させ続けることは難しく、ゲーム全体で考えた時に必ずしも一貫性が担保されるわけではありません。
子階層への遷移の仕方が限られている場合は親階層の見出しが残せる！
以上です。
今回紹介した「IDOLY PRIDE アイドリープライド」のショップ画面のように、親階層と子階層の遷移の仕方が固定化されている場合は、親階層の画面名を表示させたまま子階層に遷移することができます。
見出しをデザインする際の参考になれば幸いです。
権利者さまへ
以下のガイドラインによりゲーム画面のスクリーンショットの公開については許可されている認識でおります。
著作物利用ガイドライン | 株式会社QualiArts（クオリアーツ）
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
