こんにちは、Yuriです。
先日で、ヒカルさんから教えていただくバナー作成のレッスンが、61回目を迎えました✨
今回の授業もすでに、Webデザイン1on1レッスンチャンネルのバナーデザイン61にて公開されています✨
今回のお題の詳しい内容はこちらになります！
今回のバナーの目的 父の日ギフトの販促バナー
配信場所 GDN・YDNなど
ターゲット 男性・女性、20～30代
雰囲気 ポップ
サイズ 300px x 250px
画像 ビールのイラスト
配色 お任せ
文言
（必須）
- FATHER’S DAY
- 6.20 SUNDAY
- 美味しいビールギフト
- BEER TOWN（店舗名）
（任意）なし
（フォント）なし
左の画像（スマホ画面では上）が、私が初めに作ったもので、右の画像（スマホ画面では下）がヒカルさんがブラッシュアップしてくださったものです。
- 「父の日のお祝い」という雰囲気を出すため、リボンに文字を配置したり、黄色のバラのイラストや、フラッグを配置した。
- ポップな雰囲気を出すため、欧文フォントにAdorn Condensed Sans、和文フォントに貂明朝を使用した。
- 「美味しいビールギフト」をイメージを喚起するため、ギフトボックスのイラストを使用した。
- 反省点は、ビールのイメージと相性がよいと思い、背景を空に、文言を配置する帯を白い雲にしたら、運動会のような雰囲気になってしまったところ。
ヒカルさんが、この回のレッスンを画像で分かりやすく解説するツイートをしてくださっています✨
ヒカルさんのツイートを参考にさせて頂きつつ、改善のポイントをまとめます。
“改善のポイント”
①見出しは大きく（「FATHER’S DAY」と「6.20 SUNDAY」）
・文字を大きくコントラストも高くすると、目に留まる
「6.20」のフォントサイズを大きく、「SUNDAY」を小さくした。
リボンの色を少し濃くして、「FATHER’S DAY」の視認性を上げた。
②文字のメリハリ（「美味しいビールギフト」の部分）
・文字を分割して読ませたい文字を大きくすると、目が留まる
「美味しい」のフォントサイズを小さく、縦組みにして、「ビールギフト」のサイズを大きくした。
③文字の配置（「美味しいビールギフト」という文言を配置する場所）
・背景にビールのイラストを敷くと配色が馴染む
私のバナーでは、父の日の青・黃の配色から、ビールの色が少し浮いしまっていた。
背景に敷いたビールのイラストの不透明度を70にして（その下にイラストを複製して、レイヤースタイルをカラーオーバーレイで白にして、水色が透けないようにする）、上に置く文字やイラストの視認性を保った。また、「美味しいビールギフト」のフォントの色を少し濃くした。
ビールのイラストを、私は三種類全て同じ大きさで使用したが、ヒカルさんは中央のビールを左右より少し大きくした。また、ビールの後ろにバラやギフトのイラストを少し重なるように配置した。立体感が出て、目が留まりやすくなったと感じました。
今回のレッスンも、沢山の学びを頂きました✨
見出しの文言の中で、優先順位が高いものは何かを考えて、ジャンプ率をつけると視線誘導がスムーズにできる。
配色が違和感のある仕上がりにならないように調整する、イラストのサイズの大きさを調整して立体感を出す方法などです。
私は文字組みが苦手なので意識して、挑戦するようにします✨
