【自主制作】SNS用広告バナー
OVERVIEW
SHElikesの課題で、「Webデザイナー交流会」という架空イベントで、X(旧Twitter)に掲載するバナーを制作しました。
- 制作期間:4h
- 担当領域:情報設計〜クリエイティブ制作
- 使用ソフト:Photoshop
目次
課題要件
制作物
工夫した点
制作を通して学んだこと
課題要件
目的
- Webデザイナー交流会を開催する旨を周知したい
- バナーを見た人にイベントに申し込んでもらいたい
ターゲット
- Webデザイナーの女性
- 同業のつながりを作って交流を深めたい人
- オフラインイベントなので、集合場所に集合できる方
掲載場所:X(旧Twitter)で告知文言とともに掲載
バナーの遷移先:交流会への申し込みページ
納品形式:横1280px × 縦670px / PNG
入れたい要素
- 文言
- Let's Meet up!
- 一緒に頑張る仲間を見つけよう Webデザイナー交流会
- 開催日:4月10日(火) 19:30-21:30
- 場所:中目黒 Bistro&Bar SHE
- 参加費無料
画像
1枚以上、人が写っている写真を使用してください
配布素材やフリー素材サイトから写真を選んで使用してください(生成AIの使用も可)
- 文言
デザインのイメージ
可愛すぎず、大人スタイリッシュなイメージ
「ここなら仲間が見つかるかも」と思ってもらえるような温かい雰囲気が伝わる
制作物

工夫した点
①ユーザーストーリーを考え、ユーザーに刺さるように優先度を考え情報設計を行いました。
====
<ユーザーストーリー>
①女性たちが仲良くしている画像で (女性たちがワイワイしている!何だろう?)と惹きつける
②「一緒に頑張る仲間を見つけようwebデザイナー交流会」というメインコピーで (Webデザイナーの交流会だ!気になる!)と内容を気になってもらう
③参加費無料というワードで (しかも参加費無料!?いいじゃん)と一押しする
④開催日と場所を見て (この日付でこの場所なら行ける!詳細を見てみよう)とクリックしてもらう
====
②情報設計では、以下の点を意識しました。
- ターゲットが女性であることと、交流を深めたい人だったため、「女性が複数人いる様子」や「仲間」というところを目立たせることで、目に留まってもらうように意識しました。
- webデザイナー交流会はメインコピーのため、目立つように中央に配置し文字のサイズも最も大きくしました。
- 場所と日時は近くに配置し、その近くに「参加費無料」を配置することで最後の一押しになるようにしました。
③ビジュアルデザインでは、以下の点を意識しました。
- 可愛すぎない・大人スタイリッシュというところで、ピンクなど可愛らしい色ではなく緑や黄色っぽい色を使うことで、可愛すぎない大人っぽさが出るように意識しました。
- 「仲間」をオレンジっぽい色に、全体的に緑っぽい色を使うことで、可愛すぎないところを意識しつつも温かみのある雰囲気が出るように工夫しました。
- フォントは明朝体を使うことで、スタイリッシュさを出しました。
- 女性向けのため、女性が複数人いる(仲間がいる)ような画像をメインにし、食事の画像を載せることで交流会の雰囲気がわかるようにしました。さらに、3人の女性がいるのでワイングラスも3つに合わせました。
- 事前に用意されていた画像は外国人の方が多かったのですが、日本人向けだと思ったので日本人の女性の無料画像を探して使用しました。
制作を通して学んだこと
- ユーザーストーリーを最初に考えることで、優先順位をつけられてユーザーがグッと惹き込まれるバナーを制作できると学びました。
- グルーピングで要素のかたまりをまとめることで、ユーザーがストレスなく読めるようにすることが大事だと学びました。
