【課題】バナートレース・分析

使用ツール：Photoshop

制作時間：120分

［ 目次 ］

1. トレースしたバナー

2. ターゲットと目的

3. 配色、分析と観察

4. 工夫したこと

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

1. トレースしたバナー

台湾茶の専門チェーン店「貢茶」のバナーをトレースしました。

引用元：https://twitter.com/gongcha_japan/status/1232206097684951040

2. バナーのターゲットと目的

■ ターゲット

「貢茶」についての記載がなく、商品名と画像をメインにした構成になっているため、ターゲットは「貢茶」の新商品や黒糖ミルクのフレーバーに興味がある人と考えました。

先行販売日と販売店舗の一覧が記載されているため、当日に店舗に向かいやすい情報設計だと感じました。また、店舗周辺に住んでいる人に「せっかくだから行ってみよう」と思ってもらうきっかけになるのではないかと分析しました。

■ 目的

右側に大きく画像を配置することで、ターゲットに「美味しそう」と感じてもらい、購買意欲を掻き立てる設計になっていると思いました。

商品名と同じサイズで先行販売日を記載したり、販売店舗を詳しく記載することで、発売日当日から確実に集客率を上げる狙いがあると考えました。

3. 配色、分析と観察

■ 配色

商品の色合いに寄せることで、バナー全体に統一感が生まれていると考えました。ベースカラーを白、メインカラーを黒にすることで視認性が高まり、目を惹きやすい配色となっていると感じました。

■ 観察と分析

商品名・先行販売日と販売店舗のテキストのジャンプ率を高くすることで、テキストがきっちり左揃えで整列されていても、躍動的な印象を受けました。視線が販売店舗に移った後もう一度商品名に戻ってくるような設計になっていると感じました。

画像を傾け、ストローをバナーからはみ出させるように配置することで、動きが生まれ、より魅力的に商品イメージが伝わりました。

4. 工夫したこと

⑴ トレース

速さよりも質を重視し、見本を完璧にトレースするよう意識しました。ガイド線に合わせて要素を配置すること、下に置いた見本の不透明度を上げたり下げたりして都度同じように作成できているかを確認しました。

⑵ まとめの作成

ガイド線を引き、余白を揃えることで見やすくするように心掛けました。また、デザインの基本原則を意識し、関連する項目を近接させてグループ化したり、バナーと同じ配色にて統一感を持たせました。

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

テキストや画像の配置、フォントのサイズまでデザインの基本原則が適用されていることが分かりました。全ての要素がバナーの目的に沿うように作成されていて、無駄な設定が一つもないことに気付きました。自身でバナーを作る際も、全ての要素に明確な理由付けをして作成していきたいです。

今後もトレースを続けていくことで、バナー制作のスキルを上げていきたいです。