こんにちは、Yuriです。
先日で、ヒカルさんから教えていただくバナー作成のレッスンが、第33回目を迎えました✨
今回の授業もすでに、Webデザイン1on1レッスンチャンネルのバナーデザイン33にて公開されています✨
今回のバナーのお題の内容はこちらになります！
今回のバナーの目的 ネットショップの敬老の日特集バナー
配信場所 GDN・YDNなど
ターゲット 男性・女性、20～50代
雰囲気 上品・和と秋の雰囲気
サイズ 300px x 250px
画像 日本酒・和菓子の画像
配色 お任せ
文言
（必須）
- 敬老の日特集
- 2020年9月21日（月）
- いつまでもずっと元気で
- 感謝を込めた美味しい贈り物
- 詳しくはこちら
（任意）なし
（フォント）なし
左の画像（スマホ画面では上）が、私が初めに作ったもので、右の画像（スマホ画面では下）がヒカルさんがブラッシュアップしてくださったものになります。
- 和の雰囲気を出すため、日付と、「敬老の日特集」を縦書きで配置した。
- 和紙のような質感を出すため、テクスチャーを使用した。
- 「いつまでもずっと元気で」というメッセージから、「感謝を込めた美味しい贈り物」へと、スムーズに視線を誘導するように配置した。
- 日付の書き方にメリハリがついていない。
- 空間があいてしまったので、あしらいを配置したが、悪目立ちしている気がする。
ヒカルさんが、この回のレッスンを紹介するツイートをしてくださっています✨
ヒカルさんのツイートを参考にさせて頂きつつ、改善のポイントをまとめます。
“改善のポイント”
①日付のサイズ
・年と月日を分けて、月日のサイズを大きく配置すると理解がスムーズ
ヒカルさんが以前のツイート、デザインのコツ［単位の扱い］でも、詳しく解説してくださっていました。
（ツイートより）③日付や割引など数字が入るものも年月日や単位は小さくします
私は、横書きのときは気をつけるようになったのですが、縦書きにするとき応用ができていませんでした💦
また、お祝いの日の年度よりも、日付が伝えたいポイントとなるので日付のフォントサイズを大きくして配置しました。年度と日付を横に並べて配置することで、テキストの下の白のひし形に、うまくおさまりました。
②キャッチコピーのメリハリ
・ひし形の枠を広げて、キャッチコピーにしっかりサイズを付ける
私が作成したものは、「敬老の日」と「特集」のフォントサイズが同じだった。
ヒカルは「敬老の日」をひし形の中央にくるよう配置して、かつフォントサイズを大きくした。
ひし形の上に、テキストの行間に余裕を持たせて配置し、上品なイメージになるようにした。
③あしらいの悪目立ち
・コントラストを落として馴染ませる
・「敬老の日」のテキストを配置したひし形の下部にあるあしらいを、背景と馴染む色に変更した。
私は、「敬老の日」のテキストと似た赤色にしたため、「敬老の日」に目が留まりにくくなっていた。
・「いつまでもずっと元気で」 の下のあしらいを、私は不透明度を100％にしていたがヒカルさんは、40％まで下げた。
・稲穂のあしらい
見せたいのは穂の部分である。下の部分は特に線が多いため視線誘導をスムーズにするためにトリミングする。
稲穂の内側の線一本を、マスクをかけ消しゴムで消す。
自由変形で若干縦長にして、アールがきつめだったのを調整した。
私は、稲穂のあしらいの塗りを90%にしていたが、ヒカルさんは不透明度を30%にした。
・和菓子の写真を大きくする
商品の訴求ができ、また余分な空間が埋まるので、あしらいで埋める必要がなくなった。
目立つ紅葉のイラストは、「敬老の日特集」のところでアイキャッチ的に使用した。和と秋の雰囲気を伝えるため、色的に背景に馴染むイチョウの葉のあしらいを使用した。
④助詞を小さくする
私は、「美味しい贈り物」の送り仮名を小さくしてしまいましたが、正しくは助詞を小さくする、でした。💦
ヒカルさんが以前のツイート、デザインのコツ［文字装飾の流れ］でも詳しく解説してくださっていました。
今回も、沢山の学びを頂きました✨
伝えたいことの優先順位を理解して、強弱をつけることを意識していきたいと思います。
そのためには、フォントサイズやウェイト、色を調節する。あしらいは、まず必要かどうかを考える、余分な部分があればトリミングする、色のトーンや濃さを調節する。
一つ一つ身につけて、次に繋げていきたいと思います！
