先日で、ヒカルさんから教えていただくバナー作成のレッスンが、第23回目を迎えました✨
今回の授業もすでに、Webデザイン1on1レッスンチャンネルのバナーデザイン23にて公開されています✨
今回のバナーのお題の内容はこちらになります。
今回のバナーの目的 プリンの夏ギフト販促バナー
ターゲット 男女 30〜50代
雰囲気 お任せ
サイズ 300px x 250px
画像 プリンの写真
配色 お任せ
文言
（必須）
・とれたてたまごぷりん
・完全受注生産
・夏ギフトに
・The Pudding
・ご注文はこちら
（任意）なし
左の画像（スマホ画面では上）が、私が初めに作ったもので、右の画像（スマホ画面では下）がヒカルさんがブラッシュアップしてくださったものになります。
-
「夏ギフト」と、「完全受注生産」が、訴求のポイントだと捉えた。夏ギフトは、文字にジャンプ率をつけ、夏に色をつけることで強調し、完全受注生産は、白い吹き出しの上にテキストを置くことでリズムを変えた。
-
今回、アイデアがなかなかまとまらず、作っているうちに指示書のターゲット層を失念し、気付いた時には作り直す時間がなくそのまま仕上げてしまった。
-
前回のレッスンの最後に、ヒカルさんは写真の使い方を説明してくださった。「プリンを一本切り抜いて、大きくして使う」「そして背景として写真を使う」 それにも関わらず、私は後ろの方を聞き逃し、バナーを作成してしまった💦
ヒカルさんが、この回のレッスンを紹介するツイートで、とてもわかりやすく説明してくださっています。このツイートを参考にさせて頂いて、今回教えていただいたポイントを後ほど、まとめました。
今回のバナーは、「とれたての卵を使って作ったプリン」が訴求のポイントだったにも関わらず、私は「夏ギフト」の方にだけ重きを置いてしまいました。
ヒカルさんは、私のミスを全く責められず、いつものように丁寧に指導してくださいました。しかし、お題を考えて下さる時間も、レッスンの時間も貴重なお時間をいただいています。
また、Webデザイン1on1レッスンチャンネルを見てくださっている皆さんにも、私のミスがなければ、よりよいブラッシュアップを見ていただけたかもしれません。
まず、頂いた指示の内容をきちんと理解するように注意します。
また、ヒカルさんから、作っていてもし「この方向性であっているかどうか」と疑問に感じたら質問すること、また参考になりそうなデザインをピックアップして、方向性に間違いがないか確認するようにしようとお話していただいたので、実践していきます！
それでは、今回のバナーで教えていただいた作成のポイントをまとめさせて頂きます✨
- 訴求のポイント：プリンは通年販売している商品なので、まずプリンを訴求してから、夏ギフトもというイメージで作る。「夏ギフト」の部分を、他の季節のイベントに変えてもよいようなレイアウトで組んでいく。
- 画像の使い方：メインとなるプリンの写真を大きく配置してしっかり見せる。プリンが美味しそうに見えるように画像を補正して、黄色味を出していく。
- コピー：「とれたてたまごぷりん」というコピーも大きく配置してしっかり見せる。白色で境界線を入れて、視認性を上げる。
- 背景の画像：「とれたての卵を使用して作ったプリン」ということを訴求するため、卵の部分を見せるように背景に画像を配置する。画像を補正して、前面に配置するテキストの視認性を上げる。補正では、明瞭度を下げ、露光を少し上げ、ハイライトを下げ、柔らかいイメージに仕上げた。
- 背景の画像の下の方を、グラデーションツールを使ってふわっと消す。（加工した後に、もう一度やり直すときのため、予備として画像をコピーしておく。）まず、画像をラスタライズして、マスクをかける。描画色を黒、背景色を白にする。グラデーションツールで、「描画色から透明に」を選択し、下からふわっと消していく。
- 配色：食べ物はできれば暖色系を使い、「おいしそう」と感じてもらえるとよい。今回は、ブルーを使用してみた。私の使ったブルーは、彩度が低めでベタ塗りなのでのっぺりした印象になっている。ヒカルさんは、フレッシュ感を感じさせるブルーを使用し、グラデーションをかけることでよりフレッシュなイメージにした。
- 「夏ギフトに」のテキストに、朝顔のあしらいを添えているので、ゴシック体よりも明朝体の方があう。（使用するフォントの数が多くても、レイアウトやフォントサイズが適切であれば、こんなに素敵にまとまるんだと感動しました✨）
今回、反省が多くありましたが、その分沢山のことを学ばせていただいたので、次に繋げていくよう精進します！
