MAKING OF WEBSITE
Yogurun Cafe
※本サイトはポートフォリオ用に制作した
架空のカフェ・架空の商品です
コンセプト
いちごスイーツ専門カフェをイメージした架空のブランド「Yogurun Cafe」を想定し、2026年春の新作いちごスムージー「ごろごろいちごとろーり」を紹介するキャンペーンLPとして制作しました。ごろっとした果肉感と、とろ〜り注がれるヨーグルトの心地よさをひとつのビジュアルストーリーとして伝え、そのまま新作フードの紹介と購入行動につなげることを目指しました。
ターゲット
SNSでかわいらしいスイーツを探している20〜30代女性です。新作情報をスマートフォンで手軽に確認して、そのまま来店・購入を検討する方を想定しています。
課題
「ごろっと」「とろ〜り」という食感の魅力を、写真と短い言葉だけでどれだけ食欲をそそる形で表現できるかがポイントです。情報量を絞りつつも、物足りない印象は与えないよう配慮しています。
目的
1ページで新作の世界観をしっかり体験してもらい、そのままドリンク・フードの購入検討へ自然につなげることを目指しています。
情報設計
スクロールだけで完結する1ページ構成にしました。ファーストビューの新作ビジュアルで惹きつけ、すぐに「こだわりのストーリー」で果実とヨーグルトの魅力を伝え、いちばん知りたい「ドリンク」「フード」の情報へ最短でたどり着ける流れにしています。
デザインプロセス
ピンクと水色を基調にしたポップな配色で、いちごのかわいらしさとヨーグルトの清潔感を両立させました。背景にはヨーグルトのしずくをさりげなく散らし、とろ〜りシリーズらしい世界観を演出。ストーリーの各ステップはスクロールに合わせてやわらかくフェードインさせ、読み進める楽しさを添えています。スマホでの閲覧が中心のため、PC幅でもSP版のレイアウトをそのまま採用。幅を持たせて中央に配置するだけの構成にすることで、デザイン・コーディングの手間を抑えつつ、どの画面幅でも同じ見た目の安心感を保っています。
制作期間・使用ツール
1週間
企画・情報設計
2週間
デザイン
3週間
コーディング
TOOLS