こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「鋼の錬金術師 MOBILE」、（以下、ハガモバ）のサウンドが聞ける画面デザインを紹介します。
音楽を流すとレコードが回るデザイン
「ハガモバ」にはゲーム内のBGMを聴ける機能が実装されていました。
画面のデザインはいわゆるスキューモーフィズムに寄っています。
また、レコードが若干見切れているため、圧迫感を感じにくい構図にもなっています。
BGMを再生すると画面内のレコードが回転し始め、音楽が流れているという状況が直感的に理解できます。
レコードのジャケットでカテゴリを選択
聴けるBGMの数は多く、カテゴリに分かれています。
カテゴリごとに専用のイラストが描かれたジャケットが用意されており、リッチなサムネイルに仕上げると同時に、これから聴く音楽を選ぶ、というのが直感的に理解できる画面デザインになっています。
画面の遷移はこんな感じです。
選んだレコードが蓄音機にセットされ、ページのナビゲーションが表示されていなくても、一連の流れで何が起きているか直感的に理解できるデザインです。
針を落とす瞬間、針が若干上に移動する
針のアニメーションをよく見ると、レコードの針を落とす際に若干パーツが上に移動しています。
やや傾いた角度から蓄音機を見ているため、針を落とすアニメーションも効果的に付けられたのではないかな、と感じます。
レコードの凹凸が分かる光の反射アニメーション
回転中のレコードのフチをよく見ると、レコードの表面の凹凸が伝わるような光の反射が表現されていました。
円盤を回転させてもシルエットは変わらないため、動いている様子が伝わりにくいところもあるのですが、細部を作り込み、情報量を増やすことでリアリティを増しているように感じました。
以上です。
ただ見た目が綺麗なだけではなく、何が起きているのか分かりやすい画面デザインだと感じました。
BGMを聴く画面をデザインする際の参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
Ⓒ 2021 荒川弘/SQUARE ENIX CO., LTD. All Rights Reserved.
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「鋼の錬金術師 MOBILE」のガイドラインを確認したところ、ゲーム中で撮影されたスクリーンショット、およびゲーム内で撮影された動画はWebサイトやSNSへ投稿しても良い旨の文章がありました。
生配信及び動画・画像投稿に関するガイドライン | 鋼の錬金術師 MOBILE | SQUARE ENIX
利用いただけるもの
本ガイドラインに従い利用いただけるもの（以下「利用対象」といいます）は、以下のとおりです。
- 本ソフトのファンキット
- 以下に記載の本ソフトの公式サイトおよび当社が運営する以下のサイト内に掲載されているテキスト・情報・画像・動画
- 本ソフト内に表示されるテキスト、ゲーム中で撮影されたスクリーンショット、およびゲーム内で撮影された動画
- 本ソフト内で使用されている楽曲、音楽データ
- コラボレーションイベント等のために、特別に本ソフトに含まれるコンテンツ
利用いただける範囲
- ゲームプレイの配信を行うことで法人から給与その他の報酬を得ている方：
・個人名義のソーシャル・ネットワーキング・サービスで利用すること。
・一般社団法人日本音楽著作権協会（JASRAC）と音楽に関する利用許諾契約締結済の動画共有サイト（「YouTube」「ニコニコ動画」等）にて「利用対象」を配信すること。- (1)に該当しない個人の方：
個人のホームページやブログ、動画共有サイト、ソーシャル・ネットワーキング・サービスなどで「利用対象」を利用すること。但し、動画配信や生配信をする場合は、一般社団法人日本音楽著作権協会（JASRAC）と音楽に関する利用許諾契約締結済の動画共有サイト（「YouTube」「ニコニコ動画」等）での配信に限ります。利用条件
掲載・配信に際して、以下の権利表記を表示してください。
Ⓒ 2021 荒川弘/SQUARE ENIX CO., LTD. All Rights Reserved.
これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
