1on1レッスン

アパレルブランドのWINTER SALEバナー

アパレルブランドのWINTER SALEバナーのアイキャッチ

こんにちは、Yuriです。

先日で、ヒカルさんから教えていただくバナー作成のレッスンが、第46回目を迎えました✨

今回の授業もすでに、Webデザイン1on1レッスンチャンネルのバナーデザイン46にて公開されています✨

今回のバナーのお題の詳しい内容はこちらになります!

今回のバナーの目的 アパレルブランドのWINTER SALEバナー

配信場所 GDN・YDNなど

ターゲット 女性、20~30代

雰囲気 カジュアル

サイズ 300px x 250px

画像 女性の画像

配色 お任せ

文言

(必須)

  • しあわせな、冬をもっと
  • FUKUOKA OUTLET SHOP(店舗名)
  • WINTER SALE
  • 12/12 sat – 12/20 sun

(任意)なし

(フォント)なし

左の画像(スマホ画面では上)が、私が初めに作ったもので、右の画像(スマホ画面では下)がヒカルさんがブラッシュアップしてくださったものになります。

Yuriが作成したバナーヒカルさんがブラッシュアップされたバナー

 

 

 

 

 

バナー作成時に意識したことと、反省点
  • 冬をイメージし、淡い色合いで仕上げた
  • 背景を斜めに区切ることでリズムを出した
  • 「冬」の文字の下にの結晶を配置して、アイキャッチにした
  • 反省点は、背景の色と女性のコートが同じトーンの色で、被ってしまっているところ

ヒカルさんが、この回のレッスンを画像で分かりやすく解説するツイートをしてくださっています✨

ヒカルさんのツイートを参考にさせて頂きつつ、改善のポイントをまとめます。

“改善のポイント”

コントラスト(「WINTER SALE」と女性の画像のコントラスト

・背景色を濃くすると「WINTER SALE」という文字の視認性が上がり画像ともマッチする

女性の画像は、はっきりした印象の色合いである(マフラーの青色や、口紅のピンク色、髪の毛の茶色など)

そこで、私の作成したバナーのように背景の色が薄すぎると、「WINTER SALE」という文字の印象が、画像に負けてしまっていた。

 

画像と文字の配置(「WINTER SALE」と女性の画像の位置

・女性の背中の中央で上下位置を揃えるとしっくりくる

「WINTER」、「SALE」、「12/12 sat – 12/20 sun」を、女性の背中にぴったり沿うイメージで、右揃えにして一体感を出した。

私は、「SALE」の文字をイタリック体で使用し、それだとスポーティな印象があったため、ヒカルさんはイタリック体を使わなかった。

「WINTER」の前に、雪の結晶を配置し目立ちすぎないよう不透明度80%にした。

言葉の印象(「しあわせな、冬をもっと」の部分

・シンプルに配置すると言葉の印象と合いキャッチコピーとの差別化もできる

私は、「冬」という文字を袋文字にして目立たせたが、ヒカルさんは女性の印象と合わせて、シンプルに「しあわせな、冬をもっと」というテキストを配置した(私の表現だと、女性が笑みを浮かべていたら合ったかもしれない)。

また、私の作成したバナーの「しあわせな、冬をもっと」という文字の配置の仕方だと、「しあわせな」の前に「冬」が来てしまい、理解し辛くなっていた。

私の作成したバナーでは、レイアウトを区切る斜めの角度が急で、スポーティな印象を与えた。水平にすると、上下が分断されてしまうので、ヒカルさんは緩やかな傾斜をつけてリズムを出した。

今回のレッスンも沢山の学びを頂きました✨

前回、「余白を埋めなければ」となってしまう癖を反省したばかりなのですが、今回もその癖を発動してしまいました💦

バナーの目指す雰囲気を掴み、記載する項目や画像の優先順位を理解し、メリハリをつけ、伝わるバナーを作成できるよう頑張ります✨