【課題】バナー制作1

制作時間：約6時間
制作期間：約1週間
制作範囲：情報設計・ワイヤーフレーム・デザイン 

成果物

【Twitterバナー】

課題内容

架空のクライアントからの依頼内容

▼目的

• Webデザイナー交流会を開催する旨を周知したい（掲載場所：Twitter）

• バナーを見た人にイベントに申し込んでもらいたい

▼ターゲット

• Webデザイナーの女性

• 同業のつながりを作って交流を深めたい人

• オフラインイベントなので、集合場所に集合できる方

▼バナーの遷移先（告知文言にURLを記載）

• 交流会への申し込みページ

▼納品形式（サイズ／ファイルの種類）

• 横1280px × 縦670px ／ PNG

▼入れたい要素

• 文言

  • 一緒に頑張る仲間を見つけよう 

  • Webデザイナー交流会

  • Let's Meet up!

  • 開催日：4月10日(火) 19:30-21:30

  • 場所：中目黒 Bistro&Bar SHE

  • 参加費無料

• 画像など

  • 1枚以上、人が写っている写真を使用してください

  • 配布素材やフリー素材サイトから写真を選んで使用してください

• デザインのイメージ

  • 可愛すぎず、大人スタイリッシュなイメージ

  • 「ここなら仲間が見つかるかも」と思ってもらえるような温かい雰囲気が伝わる

情報設計

ユーザーストーリーの作成

楽しげな女性達の写真でユーザーの興味を引き、左上から右下へ視点が動いていくストーリーを作成しました。

ビジュアルデザイン

• 「春らしさ」と「女性らしさ」を感じる配色

バナー全体の統一感を出すために、ピンクやグリーンの服を着た女性の写真を選んでいます。

• 女性らしさと視認性を考慮したフォント選び

基本のフォントは「りょうゴシック PlusN 」で綺麗めな印象 に仕上げています。キャンペーン名は「VDL-V7 ゴシック」を使用し、より読みやすく、親しみやすさを感じられるようにしました。 

• 桜のモチーフを使い、季節感をアピール

背景に桜のモチーフを散りばめることで、いつもやっているイベントではなく、「春だからこそやる旬のイベント」だと分かるようにしています。

頑張ったポイント

視線誘導を意識し、ターゲットがこのバナーをクリックしたくなるように設計しました。配色やフォントを全体的に統一することにもこだわっています。講師の方からフィードバックをもらい、文字間の余白調整など細かなブラッシュアップに力を入れました。

課題を通して学んだこと

• ターゲットについてしっかり分析し、ターゲットの心情を考えながら情報を配置していくことが大事であること。

• 情報に優先順位を付け、文字の大きさや配色にメリハリをつけること。

• 全体的に参考にするバナーを探すだけでなく、日付やタイトルなど項目それぞれピンポイントに参考バナーを探してもいいということ。

• 目的に合わせて配色やフォントを考えること。