「らしさ」をデザインする　ゲームUIデザイナーが考える２つのポイント

初めましてこんにちは。サムザップでUIデザイナーをしている山口と申します。
わたしは現在「戦国炎舞 -KIZNA-」と「この素晴らしい世界に祝福を！ファンタスティックデイズ」の2タイトルの
UI制作に携わっています。

（以下、それぞれ「戦国炎舞」「このファン」と記載させていただきます）

ご覧いただいたとおり、こちらの2タイトルはテイストが全然違います。ですが、やっていることとしてはどちらも変わりません。【施策のイメージやポイントを、そのタイトルのテイストに合わせて表現】をしています。

これを行うためには、そのタイトルの世界観やたいせつにしているもの、デザインテイストをしっかりと理解できている必要があります。

今回はテイストに合わせたデザインを制作するためにわたしがどのようなポイントを抑えているか、をこちらの記事でお伝えできればと思います。それではどうぞよろしくおねがいいたします。

■タイトルからイメージされるものを言語化してみる

例えば、「戦国炎舞」からは【熱い合戦（バトル）】【戦国武将】【重厚】【豪華絢爛】など……

「このファン」からは【ギャグ】【ファンタジー】【かわいい】【ドタバタ】などなど……

それぞれのタイトルからは、連想されるあるいはユーザーさんから期待されているイメージがあると思います。それらを自分の中できちんと言語化することで、軸がブレないデザイン制作ができます。

■既存のデザインから情報を得る

デザインを制作するタイトルの画面デザインや既に制作されているバナーやロゴ、訴求画像などをよく調べてみます。
それらから、前述したタイトルのイメージを表現するために
・どんな色（配色だけでなく、明度や彩度も）をつかっているのか
・どんな種類のフォントをつかっているのか
・どんな効果や加工、レイヤースタイルをつかっているのか
などなど……、技法や共通点を見つけることができます。

先人たちのPSDないしはレギュレーション資料があるなら、それを調べていくのが一番確実です。レイヤースタイルの細かいパラメータなどは直接データを見ないとわからないものもあったりするので。

既存のデザインと統一感のあるものを作成したいときは、上記したポイントを抑え、揃えていくことが手っ取り早いです。

「イメージの理解」＋「既存のデザインの知識」があると、
同じ「虹色のデザイン」を依頼されても以下のようにタイトルごとにアウトプットが自然と変わっていきます。

■制作事例

上記の手順を踏まえ、実際にデザインしたものを紹介いたします。

祈願の社→神様にお祈りする→神聖・神秘的なイメージかな？お社だから厳かさも感じられるとよさそう！それなら使用フォントは可愛いものではなく、かちっとした印象があるものにしたほうがいいかな……
というイメージをベースに、
勇士をお社から神の力で呼びおこす→魂的なあしらいも加えてみよう！
と言ったかたちで膨らませていきます。

そして、これらを形にする際は戦国炎舞でよく使用している和紙風のテクスチャやパターンの加工を加えるなどして、統一感が出るように整えていきます。

お屋敷パニック！というタイトルとこのイベントで使用するカードイラストから、ドタバタ感や散らかっている感じを出してみよう！→カップひっくり返したりしてみようかな……
あとは遊び要素として、メイドのモチーフであるヘッドドレスを文字に忍ばせてみたり……などなど、こちらもイメージを膨らましていきます。

また、「このファン」では文字に模様を薄くかけて加工しているものが多いです。こちらではメイドらしさを生かしつつ統一感が出るよう、西洋のお屋敷とも相性の良いトラディショナルなダイヤ模様を用いて仕上げています。

■おわりに

いかがでしたでしょうか。

テイストの違う複数タイトルの制作に携われるのは、考えることもそのぶん増えたり頭の切り替えをしないといけなかったりで大変ではありますが、デザイナーとして引き出しを増やすことができるのでとてもよい経験になると思います。

この記事がどなたかのお役に少しでも立つことができれば幸いでございます。読んでいただきありがとうございました。

©2019 暁なつめ・三嶋くろね／KADOKAWA／映画このすば製作委員会　©Sumzap, Inc.

○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●
　　　　 サムザップでは一緒にはたらく仲間を募集しています
　　 　オフィス紹介や技術ブログなど、のぞいていきませんか？
　　　　　　　　 https://www.sumzap.co.jp/recruit/
○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●○○●