ゲームアプリのUIデザイン

プレイしたゲームアプリのUIデザインに関して書き残します。毎日頑張って更新!

「プロジェクトセカイ カラフルステージ! feat.初音ミク」MVP獲得演出のUIアニメーションがMVPなので紹介させてください!

こんにちは!ちょこです!

 

「プロジェクトセカイ カラフルステージ! feat.初音ミク」のマルチプレイの結果画面にて、UIアニメーションを使って上手に視線誘導されている箇所がありました!

 

デザインとして、凄く良いと感じたので紹介します!

ああああああああ

 

 

場面としてはこちらです!

ああああああああ

 

画面遷移の一覧の流れとしては以下のようになっています。

  1. 楽曲クリア、ランク表示
  2. 各自のスコア表示
  3. MVPの発表
  4. 自身のスコア詳細表示

 

ああああああああ



一見すると各パネルが等間隔に並べられているように見えます。

しかし、よく見るとMVPを発表する際にMVPを獲得したユーザーを少しだけ大きく表示するようなアニメーションが実装されています!

ああああああああ

▲MVPを獲得したユーザーだけ僅かに大きく表示される

 

このアニメーションが凄く良いところだと思います。

 

このデザインの意図として考えられるのは…

  1. MVPを目立たせたい
  2. だから、他よりも大きく表示させたい
  3. しかし、画面遷移直後から大きく表示すると、MVPが表示されるまでのドキドキ感が損なわれる
  4. また、僅かに大きくする程度だと、意図が伝わりづらいデザインになる
  5. そこで、アニメーションを利用することにより僅かな変化であってもユーザーに伝えることができる
  6. その結果、MVP獲得演出を目立たせている

以上の様な意図があるかと推測しました。

 

このように、デザインする目的を定めるとブレにくいデザインが生まれます。

「プロジェクトセカイ カラフルステージ! feat.初音ミク」の場合は、アニメーションを利用することによって、デザインの目的がより強固になっていると感じました。

 

仮に「MVPを目立たせたい」という目的であったとして、
ありがちなのは、MVPという文字を目立たせてしまうことだと思います。

 

もちろんそれでも良いとは思いますが、より正確に定義するなら、この画面ではMVPという文字を目立たせたいのではなく、 MVPを獲得したユーザーを目立たせたいはずです。

ああああああああ

 

したがって、MVPという文字ではなく、ユーザーに焦点を当てているのも大切な視点だと感じました。

 

「プロジェクトセカイ カラフルステージ! feat.初音ミク」は、こういったさり気ないUIアニメーションが多く、そのクオリティも非常に良いと感じています。

 

 

 


権利者さまへ

以下はコンテンツ利用に関する認識の説明です。

「プロジェクトセカイ カラフルステージ! feat.初音ミク」のガイドラインを確認したところ、ゲーム内で使用されている画像やスクリーンショット画像はWebサイトやSNSへ投稿しても良い旨の文章がありました。

 

NEWS | プロジェクトセカイ カラフルステージ! feat.初音ミク

 

SNS動画共有サイトでの動画投稿または配信でのコンテンツ利用に関して

・本プロジェクトを取り扱った内容の静止画または動画について
本プロジェクトを取り扱った内容の静止画または動画をSNS、動画共有サービスへ投稿することについては、以下の禁止事項に抵触しない限りは問題ございません。

ストーリーの投稿または配信に関する禁止事項

開催中のイベントストーリー1話分や、サイドストーリーの内容がまるまるわかるような投稿は、未だストーリーを読んでいない方々に対して予告なく内容を伝えてしまうネタバレ行為に該当してしまい、楽しむ機会が損なわれてしまうため禁止しております。
以下に投稿または配信に関する基準を記載いたします。

■投稿または配信OK
チュートリアル
・メインストーリー(オープニングを含む)
・開催終了したイベントストーリー

■投稿または配信NG
・開催中のイベントストーリー
・サイドストーリー(前編、後編)
・その他のストーリー
※感想、及び感想に動画やスクリーンショットを添付しての投稿(目安として、動画であれば4〜5タップ程度、スクリーンショットであれば1ツイートに4枚程度)であれば問題ございません)
また、分割して大量の動画やスクリーンショットを投稿するなど、ゲームをプレイしなくても結果的に投稿または配信NGの内容がわかるようなものは問題が生じますので、ご注意ください。

 

これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。

画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。

 

お問い合わせ