今回は「バナー作成のポイント」を、制作過程とともに学んでいきたいと思います。
架空のキャンペーンの告知バナーを作成していきます。
下記がキャンペーンの情報です。この情報をもとに、考えていきましょう！
「女子旅キャンペーン」告知バナー
・夏の女子旅応援企画を告知する
・抽選で5組10名に旅行券3万円分をプレゼント
・募集期間は2019年6月1日〜7月31日とする
1.ターゲットの想定
最初に「ターゲットの想定」をおこないます。
想定したユーザーに対して、ピンポイントにアプローチすることで、バナーのクリック数を上げることが期待できます。
箇条書きでターゲットのイメージを洗い出してみましょう。
ターゲット
・女性
・20代
・旅行や出かけるのが好き
・夏
・アクティブ
・写真映えする体験、風景
今回は『アクティブな20代女性』をターゲットに設定します。
2.イメージの洗い出し
ターゲットに与えたいイメージや、ストーリーなどのアイディアを出していきます。
ライフスタイルや、好まれそうなテイスト、アイテムを連想ゲームの要領で洗い出していきます。
「旅→歩く→歩きやすい靴→スニーカー」
「旅→思い出→共有→SNS→写真」
このようなイメージで、要素をどんどん書き出していきましょう。
今回は、「スニーカー」「アクティビティ」「旅」「爽やかさ」「写真」
という要素を抽出して作成を進めます。
また、併せて「キャッチコピー」も考えます。
今回は賞品が「旅行券3万円分」と、行き先は「ユーザーが自由に決められること」を訴求します。
「旅行の計画を立てる瞬間のワクワク感」と「旅行券が当たったらどこに行こう？何をしよう？」という気持ちをストレートに投げかける文章を考え、
「どこへ行こう？」をキャッチコピーにしました。
3.ラフの作成
洗い出したイメージ・コピーをもとにラフを作成します。
ノートにラフ画を描いていきましょう。
「どこへ行き、何を体験するか」の想像を膨らませるため、複数枚の写真を配置したいと思います。
今回は画面を「文章」+「イメージ」の２分割にしてレイアウトを組みます。
バナーのレイアウトは様々ですが、２分割レイアウトは写真が小さい時や、情報を分けたい時に効果的で使いやすい手法です。
キレイな写真がある場合は、画像を前面に使用し文字を配置するレイアウトが効果的です。
文字組みは各要素の中で、どれが「伝えたいこと」なのか優先度を決めることで、配置をおこなっていきます。
「女子旅」>「旅行券3万円分」>「5組10名」>「募集期間」の順に、優先度をつけて文字の配置をおこないました。
4.レイアウトの作成
ここからはパソコンでの作業になります。
先ほど描いたラフ画をもとにバナーのレイアウトを作成します。
ここでのポイントは「モノトーン」で作成をおこなうことです。
先に色を入れてしまうと、色のイメージに引っ張られてしまうため、白黒で作成しバランスを調整していきます。
5.調整
写真をはめ込み、書体の調整をおこないます。
フォントも変更し、強調したいポイントを考えながら整えていきます。
6.配色
全体を整えたら配色をおこなっていきます。
夏休みを想定したキャンペーンのため、爽やかな色を選んでみました。
色味に悩んだ時は、ビジュアルの中から同じ色を選んで配色するがポイント！
7.全体の調整
全体を見たとき、文章側にもう少し「遊び心」を入れたいと思い、点線で表現した「カモメ」を追加し、「女子旅」の「旅」の文字の一部を「靴跡」に変えてみました。
イメージに配置した「点線」と「靴跡」を取り入れることで全体にまとまりを出すことができました。
これでキャンペーンバナーの完成です！
まとめ
今回一番のポイントは「モノトーン」の状態で全体を調整していくことです。
色のイメージに引っ張られることなくレイアウトを整えられます！
配色はバナー先のサイトのイメージカラーや、ビジュアルの中から決めることで、統一感を出せます。
今回、バナー作成の工程をまとめて感じたのは「前準備が大切」だということです。
ターゲットの想定と、イメージする情報、ライフスタイルの洗い出しがおこなわれているほど、迷いなくバナーに落とし込んでいけます。
クライアントからの「ヒアリング」や、「ユーザー」を意識する想像力が大切です。