こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「勝利の女神：NIKKE」（以降、ニケ）からニーアコラボにおけるUIのデザイン変更をご紹介します。
非常に…！非常に！力の入った熱量の高いコラボでした。ちょっとIPを借りる、という程度を超え、圧倒的なクオリティだと感じました。ソシャゲでこのクオリティのコラボは一つの到達点じゃないかと思いました。
この記事ではグラフィックに絞って紹介しますが、実際のゲームでは音楽もコラボに合わせて実装されているので、没入感の高まりも想像していただければと思います。
以下、コラボに合わせてデザインが変わっていた画面を紹介します。
タイトル画面
タイトル画面はこんな感じです。
まずは普段のデザインを紹介します。
物憂げな表情をしたメインキャラが大きく表示されています。暗いシーンの中に光る柔らかな赤が印象的です。
続いてコラボ時のタイトル画面のデザインはこちらです。
コラボキャラとニケのメインキャラを含めた書き下ろしのイラストに差し替えられていました。コラボが開催中であることがはっきりと分かるデザインです。
色のトンマナもコラボ先の世界観に合わせたセピア調で統一されています。
普段と違うデザインにすることで非日常感があり、イベントに対する盛り上がりも感じられました。
イベントマップ
続いてゲームの中の画面を紹介します。
まずはイベントマップです。
普段の画面は廃墟になった市街地を俯瞰で見下ろすデザインですね。
大体どこもこんな感じの景色でした。
続いてイベントマップを見てみます。
「俯瞰でキャラを見下ろしている３Dマップ」という大枠は変わりませんが、各種UIがコラボイベント専用のUIになっています。
普段のデザインに対して、見た目も機能も大きく変更されており、使い勝手は気にならないのか？…と思ったのですが、普通にプレイしている限りでは全く気になりませんでした。
共通機能はキャラの移動程度であるからこそ、見た目を大きく変えても違和感や不便さを感じなかったのかもしれません。
以下はコラボイベント専用のUIパーツです。
「ログインスタンプ」「ショップ」といった、普段のマップ画面には無いものが多くありました。
バトル準備画面
次にバトル画面です。通常時はこちらです。
先ほどのマップ画面からカメラが動き、シームレスにシーンが切り替わります。
そしてイベント画面はこちらです。
またしてもがっつりデザインが違う…！イベントマップ上には敵キャラがいないため、任意のクエストを選択する形式になっています。
バトル画面
続いてバトル画面を紹介します。普段のバトル画面はこちらです。
ゲージなどの色が記号的に使われているのが分かります。
そしてニーアイベント中のバトル画面はこちらです。
パッと見て、コラボ先の世界観に寄せていることが分かります。
特に普段の画面では記号的に使われていたゲージの色など、使用している色数をかなり絞っていることが分かります。
ここまでUIを寄せられると、コラボキャラでプレイしたくなります…！
画面上部のUIパーツの変化
変更のあった主なUIパーツを見ていきます。
まずは画面上部のUIから…。
色、フォント、あしらいなど全体的にデザインが変わっており、少なくとも画像の置き換え以上の調整も行われているように見えます。
主に以下のような特徴があげられそうです。
- 色のトンマナを変更している
- フォントを変更している
- 直線的な要素を強調し、幾何学的なデザインになっている
- ボタンの配置、大きさなどの操作性に関わる部分は変更しない
画面中央付近のUIパーツの変化
続いて、画面中央付近のUIを見てみます。
- 色のトンマナを変更している
- フォントを変更している
- アイコンのデザインも変更の対象に含めている
画面下部のUIパーツの変化
最後に画面下部を見てみます。まずは銃のアイコンです。
アイコンの色、文字の色が変わっていますね。
次にキャラのサムネイルです。
個人的に驚いたのがこのパーツで、キャラのサムネの色味も変更しています。
シェーダーでやっているのか個別に調整しているのか、実装面については未確認ですが、凄い執念を感じます…。ここまでやるか…。
昨今、コラボイベントでここまで作り込むゲームは滅多に無い気がします。
…というか初めて見ました。
▲通常時のサムネイル
▲コラボ時のサムネイル
ロード画面
最後にロード画面を紹介します。
まずはいつものデザインです。白い背景に小さくLOADING...と表示されています。
大胆な余白を活かしたデザインになっています。
そしてこちらがコラボイベント時のロード画面です。
元々のデザインがシンプルで親和性が高いためか、背景や文字色のトンマナを合わせるだけでも十分にニーアっぽいデザインになっています。
また、ガワ替えとは別のロード画面もありました。
タイトル画面からインゲームに遷移する時、イベントページに遷移する時などに表示されていました。
各種文字が表示され、何かしらのシステムにアクセスする様子が描かれています。
恐らく元ネタがあると思いますが、詳しくは未確認です。
以上です。
X（旧Twitter）では全体的に好評でした。
特に、バトル中のUI変更はニーアを編成した時にこのUIになって欲しいなど常設を希望する声もあるほどでした。
コラボデザインをする際の参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「勝利の女神：NIKKE」のガイドラインを確認したところ、以下の記載がありました。
１．用語の定義
本ガイドラインにおいて、使用する用語の定義を以下に示します。
１）本件ゲームIP：本条２項に定める「当社オリジナルコンテンツ」に関してSHIFT UP CORP.が有する又は管理する一切の知的財産権を指します。
２）当社オリジナルコンテンツ：SHIFT UP CORP.が開発、制作、運営、配信等を行うゲームやその他創作物の世界観、ストーリー、キャラクター及びモンスターのイラスト、背景画像、バックグラウンド・ミュージック（BGM）、映像等を指します。
３）本件二次創作物：当社オリジナルコンテンツを元に、本件ゲームIPを利用し、又はクリエーターの創作要素を加えて表現及び制作した新しい制作物をいいます。例えば、イラストレーション、ゲーム関連グッズ、ビデオ、漫画、小説、ファンフィクション、ファンアート、コスプレ衣装、コスプレの写真及び動画などが含まれます。
４）本件二次創作活動：前項の本件二次創作物を製作、複製、公開、販売、頒布、配信する等の行為を指します。ただし、当社オリジナルコンテンツをそのまま再現、複製、コピー、トレースする行為、又はこれらと同様とみなされる行為は、二次創作活動と認められませんのでご注意願います。詳しくは、以下の例をご参照ください。
<二次創作活動と認められない行為の例>
スキャン等の方法で、SHIFT UP CORP.が独占的に著作権を有する公式イラストの画像データを取り込み、そのまま或いは加工したものを素材に転写し、アクリルスタンドやバッチ等のグッズを製作して販売及び公開する行為。２．本件二次創作活動の許諾範囲
１) 基本的には、本条に定める一部の例外を除き、非営利的活動のみ許諾します。
２）個人や法人格のない団体（サークル等）が、YouTubeやTwitchなどのコンテンツ共有プラットフォームに本件二次創作物を公開し、広告収益やその他収益を得ること。ただし、本ガイドラインに反する内容又は方法で公開した場合は、当社の判断にて当該公開に関連する収益化を中止するように要求する場合があります。
これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
