加工食品会社_商品レシピ紹介ページ_デザイン〜コーディング

OVERVIEW

2021.11-2021.11

YEAR 2021 - 2021

■概要

人気商品「ハイライフポーク」を使ったアレンジレシピの紹介ページ。


■デザイン補足

・質の良いお肉でありながら家庭で気軽に使える印象を与えたい

└温かみがあり食べ物がおいしく見える赤色を基調に使用

└ランチョンマットを想起させる布やクラフト紙のようなビジュアル、あしらいにマスキングテープを使うことで手作りのぬくもり感を表現

└監修シェフの笑顔の写真が目立つように配置し安心感を表現

└丸みのあるフォントであたたかさとカジュアルさを表現


■コーディング補足

・命名規則:BEM

・今後もパーツ流用してコンテンツ追加できることを考えて設計

・デザインの中にあしらいが幅の変化で変にズレないようcalcメインでCSS調整


▼PC


▼SP


WEBSITE