こんにちは、Yuriです。
先日で、ヒカルさんから教えていただくバナー作成のレッスンが、第49回目を迎えました✨
今回の授業もすでに、Webデザイン1on1レッスンチャンネルのバナーデザイン49にて公開されています✨
今回のバナーのお題は、スタッドレスタイヤの販促です。
私は子供の頃、一時雪国に住んでいたため、このタイヤにお世話になりました。
しかし詳しい性能はわからなかったので、Webサイトで少し調べました。
引用：かつての冬用タイヤといえば、鋲（びょう）＝スタッドが埋め込まれている「スパイクタイヤ」だったが、路面の損傷やそれによる粉じんの発生が問題となり、スタッド“レス”タイヤにシフトしてゆく
スタッドレスの性能は、私にはちょっと難しかったですが、「日本の雪質に合わせて進化している」ことがわかりました。
お題の詳しい内容はこちらになります！
今回のバナーの目的 スタッドレスタイヤの販促バナー
配信場所 GDN・YDNなど
ターゲット 男性、20～50代
雰囲気 信頼・安心
サイズ 300px x 250px
画像 スタッドレスタイヤの画像
配色 お任せ
文言
（必須）
- 凍結路面に効く！スタッドレス
- ブレーキ性能18%UP ※当社比
- コーナリング性能8%UP ※当社比
- WINTER STUDLESS 3（商品名）
- 詳しくはこちら
（任意）なし
（フォント）なし
左の画像（スマホ画面では上）が、私が初めに作ったもので、右の画像（スマホ画面では下）がヒカルさんがブラッシュアップしてくださったものです。
- 画像の冷気の部分をスクリーンで背景に足した。そのままだと、写真の切れ目がくっきり出るため、マスクをかけ、ブラシでふわっとさせた。
- 「凍結路面」という文字に、氷や雪をイメージした加工を加えた。
- スタッドレスという文字に、太さをもたせるため、境界線を白で足した。
- 反省点は、ジャンプ率が低く、キャッチコピーに目が留まるように作れなかったところ。
ヒカルさんが、この回のレッスンを画像で分かりやすく解説するツイートをしてくださっています✨
ヒカルさんのツイートを参考にさせて頂きつつ、改善のポイントをまとめます。
“改善のポイント”
①文字加工(「凍結路面」の部分)
・サイズを大きくして、ノイズを調整すると印象がより伝わる
まず、私は背景にグラデーション効果をかけるのに、新規グラデーションレイヤーを使用したが、ヒカルさんは、300pxX250pxの四角形に直接、レイヤー効果でグラデーションの効果をつけた。
「凍結路面」というテキストを大きくして、長体をかけた（115%）。
「凍結路面」というテキストにかけた効果、光彩（内側）を41%にして、印象を伝えつつ、視認性を保つようにした。
②ジャンプ率(「凍結路面に効く!!」の部分)
・文字のジャンプ率を高くすると、アイキャッチとして機能する
タイヤの上部にある余白に、「に効く！」を配置した。
③リズム（ブレーキ性能とコーナリング性能の部分）
・円の中に配置して、レイアウトも斜めに配置するとリズムがでる
私の作成したバナーは、水平（横並び）、四角形など、同じ要素を使用していてリズムが単調である。
また、上下に組むと分断されてしまい、性能と％の組み合わせを、一瞬で把握するのが難しい（性能と％の組み合わせを一つの図形の上に置くとよいかも）。
ブレーキ性能とコーナリング性能を、また四角の中においてしまうとリズムが単調になるため、今回は円を使用した（三角形や、五角形でもよいかも）
かつ、斜め目に配置すると、性能と％の組み合わせも把握しやすく、視線の流れがスムーズになる。
「１８％UP」と「８％UP」の文字色を黄色にして、目立たせた（白抜きで映える色なら他の色でもOK）。
最後に、円の下部分から僅かにのぞく青い背景が目立ちすぎていたので、円の色と合わせて背景の色のトーンを濃くし、目立たないようにした。
今回のレッスンも、沢山の学びを頂きました✨
ジャンプ率をつけてメリハリを出すこと、余白をいかした文字組みの仕方、リズムの変え方、視線誘導を考えることなどです。
教えていただいたことを復習し、引き出しにいれ、意識してバナーを作成できるようにしていきます！
