■課題　英会話教室　SNS用バナー制作

【目次】

1.制作物

2.制作要件

3.情報設計

4.デザインのポイント

5.制作を通して学んだこと

1. 制作物

①Instagramバナー

②X（旧Twitter）バナー

2. 制作要件

• 概要
  英会話教室にて、来月２０日から期間限定でお友達紹介キャンペーンを実施予定。
  SNSで配信するバナーを制作してほしい。
• 目的
  キャンペーン利用での入会者を増やす（2週間の実施期間で50名獲得目標）
• ターゲット
  20代女性。英語初心者。趣味で英語を学びたいと考えている方。
• 入れたい要素

  • 文言

    ・一緒にお得！

    ・夏のお友達紹介キャンペーン
    ・あなたにもお友達にも5,000円プレゼント
    ・期間：2024年8月20日〜9月30日

  • 画像など
    ・”あなたとお友達”を表現するための人物の写真
    ・英会話スクールであることがわかる要素や写真
    ・English Girlsのロゴ（お渡しします）

3. 情報設計

• ユーザーストーリー
  「What（何がもらえるのか）」「How（どうしたらもらえるのか）」「When（いつもらえるのか）」から下記のように軸となる情報の優先度を設定し、ユーザーストーリーを考えました。
  ①5,000円プレゼント
  ②夏のお友達紹介キャンペーン
  ③期間
• ユーザーストーリーに則り、Zの法則を意識して情報を配置

4. デザインのポイント

• 写真選び
  • 「あなたとお友達」を表現する仲睦まじげな笑顔の女性のツーショット写真。夏らしいさわやかな写真を選択しました。
  • 外国人講師が授業をしている写真は、ひし形タイルに埋め込み副次的に扱うことで、メインの女性２人の写真を強調し画面のバランスを取りつつも英会話教室であることも伝える要素としました。
• 配色
  「ビジネスの場で活用するというよりも趣味で習う、ライトなスクール」なのでポップで楽しげ、さらに夏らしい雰囲気にするべく水色と黄色を選びました。
  
• 背景
  一番目を惹く要素となる「5,000円」の部分の背景に大きい図形をあてることでより情報が強調される。女性の服にもあるストライプ柄を部分的に入れてよりカジュアルにしました。

• あしらい
  「一緒にお得！」は吹き出しのあしらいにして、若い女性にささるように可愛らしくしました。

• X（旧Twitter）バナーリサイズでの工夫
  Instagramバナーを基軸にしながらも、まず背景を敷いて一番見せたい情報を置き画面の重心を決めてからほかの情報を配置しました。

「詳しくはこちら」はラベルのように右下に配置し、アクセントカラーで視線を誘導。

5. 制作を通して学んだこと

ユーザーストーリーを考え情報設計を行うことで自然とレイアウトが決まってくるように感じました。バナーの目的は「遷移してもらうこと」であり、流し見されるタイムラインの中で目を止めてもらうにはアピールポイントを整理し優先度をつけて配置することが重要だと学びました。