設計・アプローチ
初めて訪れたユーザーでも安心して商品を検討できるよう、 「共感 → 理解 → 信頼 → 購入」の流れで情報を整理した。
- ファーストビュー：世界観と安心感を伝え、ブランドへの共感を促す
- 中盤：栽培方法やこだわりを伝え、品質への理解を深める
- 後半：銘柄紹介やレシピを通して具体的な利用イメージを持たせ、購入へつなげる
また、回遊性を高めるための設計も行っている。
- レシピや保存方法などのコンテンツを用意し、どのページからでも価値に触れられる構成
- 銘柄紹介・レシピ詳細はレイアウトを統一し、比較・検討しやすく設計
- キーワードやテキストに強弱をつけ、情報を一目で把握しつつ、必要に応じて深く理解できるように設計
デザイン
安心感と親しみやすさを両立させるため、トーンと情報設計の両面から設計を行った。
- やさしく丸みのあるフォントと温かみのある黄色を基調とし、家庭的で明るい印象を表現
- コンテンツごとに余白やレイアウトに変化をつけ、情報量が多くても読み進めやすい構成に調整
- 写真とイラストを組み合わせ、農場の雰囲気や栽培の様子を直感的に伝達。
- 安全性やこだわりは文章でも補足し、感覚的な魅力と論理的な信頼の両立を図った
レスポンシブ設計
装飾要素が多いデザインの中でも可読性とブランド表現を両立させるため、視認性を損なわない範囲で配置・サイズを設計した。。
- SP：テキストの可読性を優先しつつ、イラストや背景要素でブランドの雰囲気が伝わるよう構成
- PC：各ページでレイアウトに変化をつけ、視覚的な楽しさと滞在時間の向上を意識した設計
