Facebook 制作について
Logo

【HerTech架空案件】スキンケアバナー

クレジット
Avatar
WEBデザイナー
【HerTech架空案件】スキンケアバナー-1
シェア
制作ノート
制作について

【デザインについて】

●ビジュアルイメージ

「透明感・上品さ・清潔感」をキーワードに、スキンケア商品のもつ高級感を表現。

白を基調にした背景に商品を大きく配置し、光やツヤ感のある素材を使用することで、紫外線ケアと美容効果をイメージできるビジュアルにしました。

●カラー

白をベースに紫~ピンク系をベース・アクセントとして使用。

紫で上品さや美容感を、ピンクで女性らしさや華やかさを表現しました。

●タイポグラフィ

商品の高級感に合わせて、明朝体を中心に使用。

見出しはサイズや太さにメリハリをつけ、伝わりやすいようにしました。

●情報設計

最初にキャッチコピーで目を引き、中央の商品画像と特徴をみせることで商品の内容を理解できる構成にしました。

ターゲットは働く女性ということで、背景にはクリームの質感をイメージできるものを使用し、スキンケア商品だと一目で分かるようにしました。

【工夫したポイント】

①情報に優先順位をつけ、視線の流れを意識

キャッチコピー→商品情報→機能→商品の訴求→CTAの順に配置し、自然に内容を理解できるように構成しました。

②商品の世界観に合わせたタイポグラフィ

紫の色味と上品な明朝体を組み合わせ、美容・高級感・透明感を表現しました。

キャッチコピーは文字サイズや太さにメリハリをつけ、特に「光」の文字を大きくすることで、視線を集めるようにしました。

③アイコンで機能を直感的に伝える

文章だけで説明するのではなく、3つの特徴をアイコン+短い言葉でまとめ、内容を把握しやすいようにしました。

④CTAを目立たせて行動につなげる

「詳しくみる」ボタンには黄色~紫のグラデーションを使用し、背景から浮き上がるようにすることで、クリックしてほしい場所を明確にしました。

⑤商品を主役にした余白設計

白を基調とした背景と余白を広めにとり、商品画像が埋もれないようにしました。

全体をすっきりまとめることで、清潔感のあるスキンケアブランドらしい印象を意識しています。

シェア
制作について

【デザインについて】

●ビジュアルイメージ

「透明感・上品さ・清潔感」をキーワードに、スキンケア商品のもつ高級感を表現。

白を基調にした背景に商品を大きく配置し、光やツヤ感のある素材を使用することで、紫外線ケアと美容効果をイメージできるビジュアルにしました。

●カラー

白をベースに紫~ピンク系をベース・アクセントとして使用。

紫で上品さや美容感を、ピンクで女性らしさや華やかさを表現しました。

●タイポグラフィ

商品の高級感に合わせて、明朝体を中心に使用。

見出しはサイズや太さにメリハリをつけ、伝わりやすいようにしました。

●情報設計

最初にキャッチコピーで目を引き、中央の商品画像と特徴をみせることで商品の内容を理解できる構成にしました。

ターゲットは働く女性ということで、背景にはクリームの質感をイメージできるものを使用し、スキンケア商品だと一目で分かるようにしました。

【工夫したポイント】

①情報に優先順位をつけ、視線の流れを意識

キャッチコピー→商品情報→機能→商品の訴求→CTAの順に配置し、自然に内容を理解できるように構成しました。

②商品の世界観に合わせたタイポグラフィ

紫の色味と上品な明朝体を組み合わせ、美容・高級感・透明感を表現しました。

キャッチコピーは文字サイズや太さにメリハリをつけ、特に「光」の文字を大きくすることで、視線を集めるようにしました。

③アイコンで機能を直感的に伝える

文章だけで説明するのではなく、3つの特徴をアイコン+短い言葉でまとめ、内容を把握しやすいようにしました。

④CTAを目立たせて行動につなげる

「詳しくみる」ボタンには黄色~紫のグラデーションを使用し、背景から浮き上がるようにすることで、クリックしてほしい場所を明確にしました。

⑤商品を主役にした余白設計

白を基調とした背景と余白を広めにとり、商品画像が埋もれないようにしました。

全体をすっきりまとめることで、清潔感のあるスキンケアブランドらしい印象を意識しています。

シェア
foriio

あなたのforiioを無料で作成

fori.io/
【HerTech架空案件】スキンケアバナー-1
制作について

【デザインについて】

●ビジュアルイメージ

「透明感・上品さ・清潔感」をキーワードに、スキンケア商品のもつ高級感を表現。

白を基調にした背景に商品を大きく配置し、光やツヤ感のある素材を使用することで、紫外線ケアと美容効果をイメージできるビジュアルにしました。

●カラー

白をベースに紫~ピンク系をベース・アクセントとして使用。

紫で上品さや美容感を、ピンクで女性らしさや華やかさを表現しました。

●タイポグラフィ

商品の高級感に合わせて、明朝体を中心に使用。

見出しはサイズや太さにメリハリをつけ、伝わりやすいようにしました。

●情報設計

最初にキャッチコピーで目を引き、中央の商品画像と特徴をみせることで商品の内容を理解できる構成にしました。

ターゲットは働く女性ということで、背景にはクリームの質感をイメージできるものを使用し、スキンケア商品だと一目で分かるようにしました。

【工夫したポイント】

①情報に優先順位をつけ、視線の流れを意識

キャッチコピー→商品情報→機能→商品の訴求→CTAの順に配置し、自然に内容を理解できるように構成しました。

②商品の世界観に合わせたタイポグラフィ

紫の色味と上品な明朝体を組み合わせ、美容・高級感・透明感を表現しました。

キャッチコピーは文字サイズや太さにメリハリをつけ、特に「光」の文字を大きくすることで、視線を集めるようにしました。

③アイコンで機能を直感的に伝える

文章だけで説明するのではなく、3つの特徴をアイコン+短い言葉でまとめ、内容を把握しやすいようにしました。

④CTAを目立たせて行動につなげる

「詳しくみる」ボタンには黄色~紫のグラデーションを使用し、背景から浮き上がるようにすることで、クリックしてほしい場所を明確にしました。

⑤商品を主役にした余白設計

白を基調とした背景と余白を広めにとり、商品画像が埋もれないようにしました。

全体をすっきりまとめることで、清潔感のあるスキンケアブランドらしい印象を意識しています。

シェア
foriio

あなたのforiioを無料で作成

fori.io/