【課題】キャンペーン告知バナー
SHElikes MULTI CREATOR COURSE の課題で、架空案件のバナー(instagram/X)を制作しました。 [ 使用ツール:Photoshop 制作期間:1週間]
目次
1. 制作物
2. 要件定義
3. 工夫した点
4. 制作で学んだこと
1. 制作物
◼︎ Instagram:1040px × 1040px
◼︎ X(旧Twitter):1280px × 720px
2. 要件定義
◼︎ クライアント情報(架空)
「English Girls」
全く英語が話せない苦手意識のある方でも通いやすい初心者歓迎のスクー ル。 ビジネスの場で活用するというより、 趣味で学んだり外国人の方との交流を図ってみたい人向けのライトなスクー ル。
◼︎ ターゲット
20代女性。英語初心者。趣味で英語を学びたいと考えている方。
◼︎ 目的
キャンペーン利用での入会者を増やす(2週間の実施期間で50名獲得目標)
◼︎ 掲載場所・サイズ
Instagram:1040px × 1040px / X(旧Twitter):1280px × 720px
◼︎ バナー遷移先
キャンペーン用のLP
◼︎ 必要な要素
文言
・一緒にお得!
・夏のお友達紹介キャンペーン
・あなたにもお友達にも5,000円プレゼント
・期間:2020年8月20日〜9月30日
画像など
・”あなたとお友達”を表現するための人物の写真
・英会話スクールであることがわかる要素や写真
・English Girlsのロゴ
3. 工夫した点
◼︎ ユーザーストーリーを考えてから情報設計を行ったこと
①「5000円」で引きつける
② その後ユーザーストーリーに沿って、縦方向に情報に目を通せる設計
◼︎ 情報の優先順位とデザインによる前後感
・「5000円」は一番に目立たせたいポイントのため、バナーを一目見た時に「5000円」が前に出てくるように、5000円だけでなく、その他の文字色のバランスも含めて調整しました。
・ウェイトが出過ぎないように上から濃い色の袋文字を重ね、抜け感が出るように工夫しました。
◼︎ 配色のバランス
・夏のキャンペーンということが分かりやすいようにブルー系のさわやかな色を取り入れつつ、「女性のための・友達・楽しさ」という印象を持ってもらうために明るい黄色やピンクも取り入れるなど、配色のバランスにこだわりました。
・ベースカラーは薄いグレーを使用することで、メインカラー・アクセントカラーのポップな色味を抑え、ターゲットである20代女性の落ち着き感も出るように工夫をしました。
・色味による前後感を優先したため、各カラーの濃淡は少しずつ調整を加えています。
◼︎ バナーイメージに合わせたフォントの選定
「JosefinSans・せのびゴシック」で楽しさなどのポップなイメージを作りつつ、大切な情報は「NotoSans・DIN(英数字)」を使用することで可読性を優先したフォントになるように意識をしました。
4. 制作で学んだこと
◼︎ ユーザーストーリーを踏まえた情報設計とデザインの重要性
ペルソナがこのバナーを見た時の心情をユーザーストーリーに沿って考えることで、その後の情報設計やデザインにおいて「クライアントの目的」を見失わずに制作ができるということを学びました。
◼︎ 情報の優先順位とデザインによる前後感
一番見せたい情報が「前」に出てくるようにするために、文字のジャンプ率や配色のバランスなどを適切に調節することを学びました。