見出し画像

デザイン制作の流れ：ゲームのイベント素材（ロゴ・バナー）

サイトウナツミ｜フリーランスデザイナー

「Game Graphic Design Advent Calendar 2019」の21日目の記事です。

私が今回お題に選んだのは「ゲームのイベント素材（ロゴ・バナー）」です。…地味ですみません。一応理由があるのです。

イベント素材作成にはゲーム特有の専門知識（実装を意識したグラフィック制作など）はほとんど不要です。PhotoshopやIllustratorなどのソフトの扱いに慣れていれば誰でも作成できますし、毎月お仕事を貰えるようになるので狙い目だと個人的に思っています。（ゲームのタイトルロゴ作成の方が派手な実績にはなるのですが一回作ったらおしまいなので…）

ゲームグラフィックデザイナーになりたての方、これからゲームのお仕事に挑戦してみたい方に向けてできるだけやさしい言葉で書きます。（…というか難しい言葉は自分が分かりません）


ゲームのイベント素材って？


言葉で説明するよりも実際に見た方が早いので人気ゲームの公式ツイートを引用させていただきます。

ほとんどのゲームではいつも何かしらのイベントが開催されています。上記の『にゃんこ大戦争』のようにゲームから飛び出してリアルイベントを開催するのも最近では当たり前の光景になってきました。

気合が入ったイベントだと静止画バナーだけでなくアニメーションバナーや動画も作成します。上記の『ポケットモンスターマスターズ』なんてもはや映画の予告編です。

🎉 ゲームのイベントに必要な素材例
・イベントロゴ
・イベントPRバナー各サイズ
・イベントPR動画
・遊び方説明
・イベント専用アイコン類
・イベント専用背景etc…


いつ、誰が作成しているの？


ゲームが開発フェーズから運営フェーズに移行する際に手が空いたUIデザイナーがそのままスライドしてイベント素材作成担当になることもありますが、仕様書を熟読したり実装について周囲と相談したりする必要がないため新人デザイナーが担当したり外注している会社も多いのではないでしょうか。

かくいう私もイベント素材作成を請け負っている外注デザイナーの1人です。イベント素材作成はサービスが終了するまでずっと発生し続ける定期案件なので、収入が不安定になりがちなフリーランスデザイナーにとってありがたい存在です！
現在私は制作会社経由の案件が大半なのですが、今後は開発会社に直接営業もしてみようと考えています。ただし個人とは契約しないルールのある開発会社も多いので、フリーランスの方はまずゲーム系に強い制作会社を調べて営業をしてみるのも良いと思います。

イベント素材と一口に言ってもロゴやバナーの他にも遊び方説明やアイコン等色々とあるのですが、今回はどんなイベントでも大体必要になる「ロゴ」と「バナー」の作成手順に絞ってお話していきたいと思います。


STEP1
🎮まずはゲームで遊んでみよう


…いきなり当たり前すぎて申し訳ないのですが、大事なことなのであえて書きます。実際に開発中or運営中のゲームで遊びましょう！

デザイナー視点ももちろん大事なのですが、ユーザー視点で純粋にゲームを楽しむことによって得られる気づきは多いです。ゲームに愛着が湧くと「もっとこのゲームの魅力を世に伝えねば…！（使命感）」とモチベーションもアップします。

💡 最低限把握しておきたいこと
① ゲームの世界観
② ゲームの目的
③ 主要キャラクター
④ 人気キャラクター
⑤ ターゲットユーザー
⑥ユーザーの行動サイクル
⑦ユーザーの熱狂ポイント
⑧売れ筋アイテム


STEP2
🔍必要な情報を集めよう


イベント素材作成の依頼書や素材などを受け取り「よし、作るぞー！」と手を動かす前に以下の情報が全て自分の中にあるかチェックしてみてください。

💡 手を動かす前にチェック！
・イベント名は決定か？
・煽り文句や注意文などテキストはそろっているか？
・イベント内容をきちんと理解しているか？
・ユーザーに一番伝えたいことは何か？
・関係者とイメージのすり合わせはできているか？
・使用必須の素材と使用不可の素材を把握しているか？
・制作物が使用される箇所を実機で把握しているか？
・使用フォントに制限はあるか？

修正回数を減らすためにもムードボード作成や参考画像共有のひと手間は惜しまないようにしたいものです。
ムードボードの作成方法について書かれた記事（皆大好きGoodpatchさん！）を見つけましたのでご紹介しておきます。


STEP3
🆎イベントロゴを作成しよう


ここからようやくロゴ作成です。今回はせっかくなので「Game Graphic Design Advent Calendar 2019」をソーシャルゲームのイベントと仮定し、イベントロゴを制作してみます。

架空のイベントなので設定は自分で考えました。

😮 ターゲットユーザー
・ゲーム業界で働いている人orゲーム業界に興味がある人
・定期案件が欲しいフリーランスデザイナー
・10代後半～30代男女（やや男性寄り）

🎄 イベント内容
12/1（日）～12/25（水）までログイン時にゲームグラフィックデザインに関する最新の記事が1つずつ届く。全部読んだユーザーに「デザインスキルが飛躍的にアップするアイテム」をプレゼント。

🔑 ゲームのキーワード
・王道ファンタジーゲーム
・ポップで可愛らしいキャラがたくさん

🔑 イベントのキーワード
・クリスマス
・アドベントカレンダー
・デザイナー＝最新の記事を届けるサンタクロース
・プレゼント
・スキルアップ
・来年以降もやるかも？

というわけでドン！

イベントロゴ

架空のイベントロゴを作成してみました。
STEP1でゲームの空気を肌で感じ、STEP2でイベントの情報をきちんと集めておくことでSTEP3の工程はグンとスムーズになります。（今回は全て架空なので情報が足りず大変でした…）

🧠 ロゴ作成時の頭の中：
（英語の綴りを間違えると恥ずかしいからコピペして…王道ファンタジーで絵柄は可愛めだから文字は太くポップな感じがいいかな…ゲームらしくドットもいいけど「最新の」記事っぽくならないな…ゲームらしさよりイベントの雰囲気優先しよ…あれ、イベントなのに大人しくなりすぎた…イラストいれよ…ゴールドだとパーティーすぎるな…スキルアップ目的だしクールな色合いで…冬らしさも追加…ってやりすぎた、寒々しすぎ…キラッとさせよ…クリスマスらしさはバナーのデザインで補えばいいか…2020年に使い回すかもだから2019は既存フォントのままで…悶々）

私の場合はまず紙にラフを描き、レイアウトが決まったらフォントを選定しIllustratorで作成、最終的な調整はPhotoshop…という流れが多いです。
フラットデザインの場合はIllustratorまでで完結することもあります。実際その方が使い勝手もよく便利なのですが、シンプルデザインがウリのゲームでもイベントロゴは装飾モリモリ…というパターンは結構あるのでそういう時は素直にPhotoshopのお世話になってモリモリ盛っています。

※作成過程まで入れると流石に長すぎになってしまうため割愛させていただきます

今後のバナーサイズ展開のことを考えて縦長すぎるロゴや横長すぎるロゴは指定がない限り避けた方が無難です。バナーの縦横比によってロゴの文字の組み方を変更しなければならなくなる可能性があり手間が増えます…！
イベントロゴは横長バナーに使用されることが多いので、小さくなりがちな正方形デザインもできれば避けておきたいところです。（逆にスマホアプリのタイトルロゴの場合はアプリアイコンへの収まり重視で正方形のものも多いです）

ここで少し寂しいお話になりますが、イベントロゴはタイトルロゴとは違い制作日程がタイトで予算も低めです。ぱぱっと制作できるように日頃から引き出しを増やしておくと良いと思います。

一般的なゲームのイベントロゴとタイトルロゴの比較
タイトルロゴとイベントロゴの比較

イベントロゴは使用期間が1日～数か月と短く、また印刷されることもほとんどないため特別な指示がない限りガイドライン（余白のルール、禁止事項など）・モノクロ版・CMYK版は不要となります。

※実は「ロゴ」というよりは「イベントタイトルを装飾したもの」というイメージの方が近いのですが、現場では便宜上「イベントロゴ」という単語を使用しています。


STEP4
🎨バナーを作成しよう


イベントロゴができたら次に大小様々なサイズのバナーを作成します。まず最初に一番大きいサイズのバナーを作成し、方向性を確認します。

💡 バナーに含める情報例
・イベントロゴ
・イベント期間
・イベントの報酬（アイテムやキャラクターなど）
・著作権表示
・イベントの説明文や注意文
・イベントに関わるグラフィック

イベントロゴや報酬など優先度の高い要素から順番に配置していくとよいでしょう。
注意文や著作権表記は優先度が低いのでバナーの端に小さく載せます。
背景は使用しても良い素材があればありがたく使わせてもらい、なければ自分で作成します。

というわけでドン！（2回目）

画像6

※キャラクター素材は全て「ゆるドラシル」様からお借りしました。

イベントバナー作成はレイアウトの自由度が高く楽しい部分なのですが、キャラクターの扱いには注意が必要です。

🦸‍♂️ キャラクター注意点
❌ 顔（特に目）はなるべく隠さない
❌ むやみに反転しない
❌ キャラ同士のサイズ感を無視しない
❌ 勝手にセリフを喋らせない（飛影はそんなこと言わない）

納期に余裕がある場合は一番大きいサイズのバナーが完成したと思った時点で2～3日寝かせると細かな違和感やズレなどに気がつきやすくなるのでおすすめです。
次のバナーサイズ展開に移行してからちょいちょい修正するとデザイナー側だけでなく確認する側の作業も増えてしまいます…。


STEP5
👨‍👨‍👧‍👦バナーを他のサイズに展開していこう


一番大きいサイズを作成したら、今度は別のサイズにどんどん展開していきます。

バナーのサイズ展開例バナーサイズ例

全て縦横比が異なったりします…。作成済みの一番サイズが大きいバナーから要素を引き算していきましょう。一番小さいバナーはイベントロゴのみ配置！という割り切りも時には必要です。

今回はサンプルということで大きいサイズをtwitter用サイズにのみ展開してみました。

画像6

余談になりますが、Photoshopのアートボードを使用するとデータをひとまとめにできるのでいいですね。スマートオブジェクトや外部リンクを併用しアセットで書き出すなど便利な機能はどんどん活用しましょう。

アートボード

pngの場合はデータが大きくなりがちなので減色します。私はフリーソフトPngyu（Windows/Mac両対応）のお世話になっています。


STEP6
🎁納品しよう


イベントロゴ、バナーのデザインにOKが出たらあとは納品するだけです。でもその前に最後のチェック。

💡 納品前にチェック！
・ファイル名は指示書の通りか
・ファイル形式は指示書の通りか
・ファイルサイズは大きすぎないか
・psdやaiも納品する場合はレイヤーを整理したか
・減色によって色が変になっている箇所がないか

納品データにもOKがでたらおしまいです。


ざっくりまとめ

😍 イベント素材作成のメリット
⭕ 毎月の安定収入に繋がる
⭕ 作業が比較的簡単
⭕ 自由度が高く作っていて楽しい
😭 イベント素材作成のデメリット
❌ 実績として公開できない場合が大半
（これはイベントに限らずゲーム全般そうですね…）
❌ 金額が安め
❌ 毎月作り続けるので飽きちゃう人もいるかも

デメリットもありますがそれでも私はゲームのイベント素材作成が好きですー！（これが言いたかった）


＼ フリーランスの方へ ／
イベント用素材は1セットの金額は少ないかもしれませんが、毎月数セットこなすことで収入の安定に繋がるのでおすすめです！
ゲーム業界に興味があって実績がまだない方は、ポートフォリオの中にキャラクターやUIだけでなく架空のイベントロゴやバナーも入れるのも良いかもしれません。

＼ ゲーム会社の方へ ／
「イベント素材外注してやってもいいぜー」という方がいらしたらお気軽にご相談ください（笑）納期絶対守るマンです。


━━━━━━━━━━━━━━━━━
サイトウナツミ
━━━━━━━━━━━━━━━━━
■Web
https://natsumisaito.com/
■Twitter
https://twitter.com/Natsumi_design
━━━━━━━━━━━━━━━━━

＼ サポートありがとうございます ／ 発信継続のための資金として全額使用させていただきます。 スキ・シェア・コメント、泣いて喜びます😭 （お礼にネコのアニメーションが飛び出します！）