LP カフェ新店舗架空案件

●制作の流れ

コンセプト設計・ターゲット設定

• 「Ruby Coffee 青山一丁目店」のオープンおよび新作「ベリー×ベリー ルビーフラッペ」のプロモーションという目的から、20〜30代のトレンドに敏感な女性をメインターゲットに設定しています。

情報設計（ワイヤーフレーム作成）

• ファーストビューでの認知から、商品の魅力付け、キャンペーン参加への誘導、店舗メニューへの興味喚起、アクセスへと繋がる、スマホでのスクロールを意識した縦のストーリーラインを構築。

ビジュアルデザイン

• 商品のキーカラーである「ルビー色（赤・ピンク）」を基調としたカラーパレットを選定。スマートフォンでの視認性と、ブランドの持つ「上品な大人っぽさ」を両立するトンマナを落とし込みました。

ブラッシュアップ

• セクションごとの背景色の切り替えによるメリハリの強化、可読性を担保するための文字組みやコントラストの微調整を行いました。

●カラー

主役である「ルビーフラッペ」の鮮やかなベリー色を引き立てつつ、甘くなりすぎず高級感のある「大人可愛い」世界観を表現するための配色です。

1. メインカラー≪くすみピンク / ライトピンク≫女性らしさと親しみやすさを演出し、全体のベースとして優しく華やかな印象を出しています。 
2. アクセントカラー≪深みのあるルビーレッド≫新作フラッペの色層とリンクさせ、画面を引き締めるとともに、キャンペーンエリアなどの重要セクションで高い視認性を確保します。  
3.   ベース・文字色≪ダークブラウン ・ ホワイト≫黒の代わりにダークブラウンを使用することで、カフェらしい温かみと上品な柔らかさをプラスしています。  

●タイポグラフィー

上品で洗練されたカフェの雰囲気を伝えるため、全体として明朝体（セリフ体）をベースに構成しています。

• 欧文・見出し：ブランドロゴや「access」などの英字、主要な見出しには、エレガントでクラシカルな印象を与えるセリフ体（ローマン体・スクリプト体風）を採用し、高級感を演出。
•  日本語本文・メニュー：スマートフォンの画面上でも潰れずに読みやすいよう、ディテールが美しい明朝体を中心に採用。メニューの細かな文字や価格には、視認性の高いゴシック体（サンセリフ体）を一部組み合わせることで、情報がすっきりと頭に入りやすいよう配慮しました。

●情報設計

ユーザーが上から下へスクロールする流れに沿って、認知からアクション（店舗認知・来店）へ自然に繋がる構成にしています。

1.  ファーストビュー（認知）： ロゴ、店舗オープン、新作フラッペのビジュアルと価格を端的に提示。Instagramでのキャンペーンだったため、ヘッダーにも各種SNSを掲載しています。
2. 商品特徴（興味・関心）： 「ベリー×ベリー ルビーフラッペって？」という問いかけから、素材やこだわりをビジュアルとともに解説し、食欲と興味をそそります。
3. キャンペーン情報（行動喚起）： 「Instagramフォローで1杯無料」という強力なオファーを赤背景で目立たせ、参加方法をステップ順に分かりやすく解説。Instagram公式アカウントへのCTAボタンへ誘導します。
4. グランドメニュー（体験の広がり）： 限定商品だけでなく、定番メニューを掲載することで、カフェ全体のファンになってもらうためのフックを作っています。
5. モバイルオーダー＆アクセス（来店促進）： 来店時の利便性を高めるモバイルオーダーの導線と、地図・店舗情報を最下部に配置し、スムーズな来店を促します。

●工夫した点

• スクロールを飽きさせない「交互の配色」スマートフォン特有の縦長画面でユーザーが飽きずに離脱を防げるよう、セクションごとに背景色を「ピンク ⇄ 白 ⇄ 濃赤 ⇄ ベージュ」とリズミカルに切り替え、視覚的な区切り（メリハリ）を明確にしました。
• シズル感と文字の可読性の両立
• 商品詳細セクションでは、手書き風の円形フレームやイラストを散りばめることで、雑誌の1ページをめくっているようなワクワク感を演出。背景に薄いテクスチャや白透過の座布団を敷くことで、写真と文字が被っても可読性が落ちないよう工夫しました。
• 複雑な「参加方法」の構造化
• インスタグラムキャンペーンのステップ（1〜5）は、テキストが長くなりがちな部分ですが、番号付きリストで整理し、重要なキーワード（ハッシュタグなど）にはアンダーライン風の装飾を施すことで、パッと見での理解しやすさにこだわりました。