2022.11.19【バナートレス.04】

左：トレース元、右：トレース

かかった時間

約1時間

配色

・メインカラー：#1b3800
・サブカラー：#162d00
・アクセントカラー：#bde700

フォント

・英語：Essonnes（Text Italic/斜体）
・「新鮮を〜」：小塚明朝 Pro（L）
・「カラダにやさしい〜」：筑紫A丸ゴシック（ボールド）
・「ローソン　フレッシュ」：小塚ゴシック Pr6N（B）
・「生鮮食品、日用品から〜」：凸版文久ゴシック（レギュラー）

デザインのポイント

色

・最初は背景のメインカラー：#1b3800だけなのかと思ったが、周りにそれよりも明度の低いサブカラー：#162d00で周りを囲んでいることがわかった

・アクセントカラー：#bde700は、英字に使用されているカラーだが、周りに緑の縁（今回は境界線で処理）を使用することにより、文字の視認性がアップし、見やすくなっている。

文字

・真ん中の「新鮮を〜」の箇所。最初は全てのフォントサイズが同じだと錯覚していたが、よく見たら2ptほどひらがなが小さくなっていることに気づき修正。

・「生鮮食品、日用品から〜」の箇所。左の「カラダにやさしい〜」と位置が揃っていなかったが、「ローソン　フレッシュ」と下部の位置を合わせることにより、バランスをとっている。

・目立たせたい文字は大きく、その他の情報は小さくと、メリハリがついているので、重要な情報などが分かりやすく、見やすいバナーとなっている。

余白

・ただ、「新鮮を毎週お届け」だけだと、上下に余白が大きく残ってしまう。しかし線を引き、それをバランスよく見せているため、余白に違和感がない。

反省点/まとめ

反省点

・Italicが斜体を表すことは知っていたが、同じような英文のフォントを探すのに時間がかかってしまった。
⇨今回の書体は"y"に特徴があるので、英文フォントは隙間時間でどのような種類があるのか観察していこうと思う。

まとめ

伝える情報量としては少ないが、目立たせる場所、重要な情報などがわかりやすく配置されており、参考になりました。バナーを作る際は伝えたいことに優先順位をつけ、さらにその中でどの情報をより目立たせたいのかを意識して作成していきます。