デザイン・制作

バナー制作講座（日向夏通販サイトの広告バナーを作る）

この記事の所要時間： 約 4分34秒

日向夏通販サイトのバナー制作

今回は、とある農園のクライアント様の広告バナーを作るというテーマで、バナー制作のコツなどをご紹介していきたいと思います。

ゼロカラー農園という架空の日向夏生産業者が、YDNでのプロモーションを考えているという設定で進めていきます。

①まずはヒアリング
クライアント先である農園に訪問。天気も良好で、みかんの爽やかな香りが風に運ばれてきます。ほのぼのとした雰囲気の中、農園の経営者さまに生産のこだわりなどを伺っていきます。（ここまで全て妄想の話）

②オフィスでヒアリング内容をまとめる
超高層ビルのワッゼカヒルズ最上階にあるオフィスに戻り、クライアントさまにヒアリングした内容を箇条書きにまとめていきます。※鹿児島に超高層ビルはありません。

【ヒアリング内容】

  • 顧客名：ゼロカラー農園
  • 目　的：宮崎県産 日向夏をPRしたい。
  • 強　み：農園から直送できるのが強み。送料無料で対応できる。
  • 特　徴：爽やかな酸味とほのかな甘みが自慢。
  • 価　格：2kg 2,000円。
  • その他：期間限定で販売する。直送できることは特にアピールしたい。

ざっくり、このような内容を伺い、いい感じの写真をもらった前提で進めます。いい感じの写真てなんだよという話ですが。。

③キャッチコピーに落とし込む。
②で箇条書きにした内容を、広告コピーで使えるフレーズに直していきます。このあたりは、リスティング広告の広告文を作成する時と感覚は同じですね。

文章としてまとめていたものを、コピーフレーズ化します。

  • 農園から産地直送でお届け！（リードコピー）
  • 宮崎県産 日向夏（商品名）
  • 爽やかな酸味とほのかな甘み（ボディーコピー）
  • 送料無料
  • 期間限定販売
  • お取寄せはこちら

※お取寄せはこちらは、購入を促すアクション訴求として追加しました。

④大まかなレイアウトを決める。
YDNには様々なピクセルサイズのバナーがありますが、スタンダードなレクタングル中サイズ（300×250）でのレイアウトを考えてみます。

【レイアウト案】

シンプルに、メイン部分とフッター部分でセパレートした2分割のレイアウトにしました。コピーや写真の配置も基本に忠実なものにしています。

⑤実際に配置をしてみる。
とりあえず背景に写真を置かないとテンションが上がらないので、いい感じの写真を背景に置きます。その上で、商品名・農園名・価格・アクション訴求を入れてみます。
※Photoshop CS6の環境を想定していますが、そこまで複雑なエフェクトなどはかけません。


写真を入れたことで少し、雰囲気は出てきました。が、まだまだ素人感がありますし、訴求力がなんか弱いですね。

⑥リードコピーとボディーコピーを入れてみる。


リードコピーとボディーコピーが入ったことで、少し締まってきました。ボディーコピーは少し色を変えて斜めにすることで動きを出すように意識しています。

⑦産地直送を目立たせる。
クライアント様から、産地直送で届けられるのが強みなので、特にアピールしたいという要望がありましたので、傍点を入れて少し注意を引くようにしてみます。


傍点を入れることで、推しすぎず弱すぎず、ほどよいバランスで訴求ができました。

⑧ちょっとだけ、遊んでみる。
バランスは整って来ましたが、やや真面目過ぎる気がするのでヤシの木のアイコンを入れて遊んでみます。


左下にヤシの木が入りました。宮崎県産ということもアピールできますし、雰囲気もやや柔らかくなったので、一石二鳥かと思います。

⑨文字組みを整える。
ここで、価格の所のkgと円の文字が大きすぎる（数字と同じ大きさ）であることに気が付きました。単位は数字よりも小さめにすると文字組みが締まり、素人感から脱却できてきます。


どこに注目してもらいたいかが、より明確になってきました。

⑩仕上げ
最後に、送料無料と期間限定販売という訴求を入れます。日向夏の写真の上に文字がかかり過ぎなような気もするので、位置をピクセル単位でずらして調整します。

その他、文字の配置など気になる所はピクセルをずらしながら調整します。（一度気になり出すとここからが長くなりがち）


スタンダードではありますが、バランスは整ったバナーとなりました。YDNの審査に落ちない為に、1ピクセルの枠も忘れずに入れましょう。

配色については、日向夏の鮮やかなイエローをできるだけ殺さないように、イエローの類似色のイエローグリーンとオレンジのみで構成しました。色数はかなり抑えています。

●まとめ

一見簡単そうに見えるバナーでもヒアリングからアイデア出し、プロモーションへの落とし込みなど、それなりの時間と労力がかかって出来ています。

また、今回は詳しくは言及しておりませんが、商品やターゲットに合わせたフォントの選び方や、配色もかなり重要です。

検索連動型広告ではないYDN広告をクリックするユーザーは、そもそも商品を今すぐ買おうとは思っていません。

夢中でYahoo!ニュースを見ている人に、「おっ！」と気づいてもらい、「なんか良さげだな？」とクリックしてもらえるようなバナーを作成しましょう。

RECOMMENDこちらの記事も人気です。