• Canva・Photoshop・Illustrator・Figmaの内、1つ以上のスキルを習得しておりバナー制作を学習する意欲がある方

• Canva・Photoshop・Illustrator・Figma などを用いて、バナーを制作する際の工程や注意すべき点を理解する。
• 学んだ内容を活かして、オリジナルバナーを作成することができる。

• 『バナーはどうやって制作すれば良いのですか？』
• 『何から制作していけば良いのですか？』
• 『どんなバナーを制作すれば良いのですか？』

• ターゲット層や、キャッチコピー・マイクロコピーの優先順位の確認をしましょう。
  コピーや開発素材で必須項目があれば、その内容で先に制作する必要があります。
• 訴求ポイントに合わせて、掲載媒体で目立つように意識したいバナーであるのか、それとも掲載場所に合わせてトーン＆マナー（トンマナ）で制作すべきなのかを考えておきましょう。

• バナーは「どのサイズでも良いので自由に制作してください」という依頼は稀です。
  指定のサイズを確認し、訴求ポイントや必須項目をどのように配置すれば効果的になるかを考える必要があります。

• バナーの与えたい印象やどのようなものであるのか、をクライアントと認識のすり合わせを行いましょう。
• 掲載場所を確認し、色味と与えたい印象によって、目立つような配色で制作をするのか、絶対に使用して欲しくない色味があるのかなどを確認し、どのような配色がベストかを考えましょう。

1.さまざまな検索キーワードで検索をかける

様々なキーワードで検索を行うと、参考になるデザインやトレンドのリサーチがしやすくなります。

• 商品名による検索
  例: 「〇〇（提供素材の商品・商材名） バナー」
• 訴求ポイントによる検索
  例: 「かっこいい クール 可愛い バナー」

様々な検索ワードを掛け合わせて考えてリサーチをしていきましょう。

2.参考バナーを複数集めて比較しながら制作を進める

• ピンとくる参考バナーを1つ見つけて終わりではございません。
• 最低でも5個以上バナーをリサーチし作業画面上に並べてラフ制作に取り掛かりましょう。
  • バナー制作を始めたばかりの方は、上記のように複数の見本を参考にしながら制作に着手すると、非常にやりやすくなります。
• 参考バナーを1案にすると、そのバナーとそっくりのバナーを制作することになってしまいます。
• 様々な種類のバナーから文字組みや配色を参考にしていきましょう。

1. 要件定義書を確認
   • 要件定義書のコピーや提供素材は必ずそのバナーに入れなくてはいけない必須の項目となるため、必ず確認をする必要があります。
   • 必須項目をメインにラフ制作での配置を考えたうえで、装飾なども考えていきましょう。
2. 参考バナーの確認
   • 5個以上リサーチしたバナーを作業画面上に並べ、要件定義書の必須項目や提供素材とどのように組み合わせれば訴求ポイントに合うバナーになるかを考え、ラフを仕上げていきましょう。
3. 素材の確認
   • 要件定義書に提供素材が用意されていない場合は、この段階で写真素材やイラストデータを準備・収集・制作しておくと良いでしょう。
   • 手書きでラフを描く際にも、その素材の大まかな雰囲気を描きましょう。写真素材やイラストで良い素材が無い場合は、写真撮影やイラストを描き用意することも考えましょう。
4. テキストの確認
   • 要件定義書でコピーが用意されていない場合は、ラフ段階で考えられる場合はここで考えて書いておくと後が楽になりますので、考えておくと良いでしょう。

1. 縦書きと横書きのどちらが効果的かを確認
   • コピーがすべて要件定義書で用意されている場合、横書きと縦書きのどちらがバナー内でより効果のあるデザインになるかを考えましょう。
2. キャッチコピー・マイクロコピー・Call to Actionテキストを確認
   • コピーが用意されていない場合、以下の例を参考にテキスト内容を考えライティングしましょう。
   • キャッチコピー例
     • 使いやすさ、わかりやすさ ⇒ ＜短時間で・誰でも・簡単に＞
     • 充実感、大容量感 ⇒ ＜たくさん！・大容量！・5大機能＞
     • お役立ち感 ⇒ ＜便利な・どこでも・最適な＞
     • お得打ち感 ⇒ ＜〇〇％OFF・今だけ割＞
     • クリック誘導 ⇒ ＜詳しくはコチラ・詳細はこちらから＞

1. レイアウトの確認
   • ラフ案で描いた内容をレイアウトしていきます。
   • あくまでラフ案であるため、バナーを作成する中で、実際のバナーサイズで良いレイアウトになっているかを確認しましょう。
2. レイアウトを元にした際に違いがある場合は複数案つくる事も可能
   • このレイアウト段階でどちらにするか決定をせず、レイアウトに違いが生じた場合は同じバナーを複数制作しましょう。
   • 差分を確認し、どちらが良いバナーであるかも考えましょう。

1. 配色が要件定義書の訴求ポイントに合っているか確認
   • 要件定義書に使用を避ける色味が書かれている場合、その内容に沿った配色で制作しましょう。
   • 書かれていない場合は訴求ポイントに合っているかを考えましょう。
2. ターゲット層・訴求ポイントに合う装飾が出来ているか確認
   • 装飾が必要な場合もあれば、装飾を極力少なくする場合もあります。
   • どちらにも対応できるよう、ターゲット層と訴求ポイントに合っているかを考えましょう。
3. 与えたい印象が制作者目線になっていないか確認
   • この段階で、訴求ポイントや与えたい印象が、消費者目線で適切に受け取られているかも必ず確認しましょう。
   • ありがちなのが「新たに覚えた技法をバナーに活かすための装飾を施し、訴求ポイントに合っていないバナーになってしまった」というものです。
   • 制作者目線が与えたい印象と大きく異なるものになっていないか必ずチェックを行い、クライアントの意図をくみとるようにしましょう。

1. 誤字・脱字がないか確認
   • 最終調整では、漢字・記号・数字も丁寧に確認してください。
   • 特に、英文などはミスが起こりやすいので、正しいと思っているスペルでもしっかりとダブルチェックを行いましょう。
2. 視認性が高く訴求したい箇所は目立つか確認
   • 指示された素材や色を見本どおりに使っても、デザインが見づらくなることがあります。
   • バナーの視認性が悪く、効果を発揮することができないと感じた際は、下記の例を参考に調整してみましょう。
   • 調整方法：
     • 吹き出しをつける
     • テキストに下線を引く
     • テキストの後ろにオブジェクトを敷き、色を入れる（座布団ともいわれます）
     • テキストをアーチにする
     • 中抜きのテキストを使用する
     • テキストの周りを色や境界にし、ふちどり色をつける
     など
   ※これらの表現方法は日頃からPinterestなどでデザインを観察することで自分の中にストックしていきましょう！
3. クリックされやすいバナーになっているか確認
   • 効果測定が終了したら、ユーザー目線でバナーを改善してみましょう。
   • 皆さんは多数のWebサイトを見てきたであろうプロのユーザーです。
   • ユーザー視点でご自身が制作したバナーをチェックし、【響く・刺さるバナー】になっているか考えましょう。