Facebook 【Her Tech 架空案件】日焼け止めバナー
Logo

【Her Tech 架空案件】日焼け止めバナー

クレジット
Avatar
WEBデザイナー
【Her Tech 架空案件】日焼け止めバナー-1
シェア
制作ノート
制作について

【デザインについて】

・ビジュアルイメージ

クライアント様からの『「光のヴェール」と「瑞々しい透明感」を表現してください。』というキーワードから、背景に柔らかなグラデーションと光を表現できるあしらいを使用しました。また、「瑞々しい透明感」を表現するためにシャボン玉のようなツヤ感のある円形を使用し、商品情報をまとめ一目で複数の悩みを解決しながら日焼け対策ができるという情報のわかりやすさを両立しました。さらに、淡いトーンでまとめつつも、文字の可読性を損なわないよう、あしらいの透明度や重なりを数ピクセル単位で微調整しました。

・カラー

女性らしさと肌に優しいイメージを表現するため、メインカラーには淡いピンクを使用しました。背景には、外側に向かって白色が強くなるグラデーションを施し、使用した際の「肌のトーンアップ」を視覚的に表現しました。

・タイポグラフィ

フォントは、肌が守られているような安心感や信頼感を表現するため「Source Han Serif JP」をメインに使用しました。対照的に、コンバージョンボタンには、心理障壁を軽減し購入ページに進んでもらえるよう丸みのある「やさしさゴシック」を使用しました。また、フォントサイズに強弱をつけ、情報の優先順位を明確化し、ごちゃつかず必要な情報が伝わるレイアウトを意識しました。

・情報設計

20代~40代と幅広い年齢層のターゲットに向けて、どの世代の方も「安心感」や「信頼感」が持てるよう、余白を取り洗練されたデザインを意識しました。また、紫外線対策だけではなく「乾燥対策」や「時短」といった、ターゲットが抱える悩みをこの一本で解決できることが、一目で伝わるようレイアウトをしました。

【工夫した点】

光のあしらいに対して商品画像に影を入れることで、商品画像を目立たせつつ、紫外線から肌が守られるということを表現しました。また、新商品だが信頼感を出すためにロゴを左上に配置しました。さらに、バナーを見た人が「どんな商品なのかもっと知りたい」と興味が惹けるよう商品名とコンバージョンボタンを並べました。

シェア
岩﨑 せりなの他の作品