Le Premier Cafe 様 コーポレートサイト・オンラインショップ制作

大阪・心斎橋本店、なんばロースタリー、淡路島の 3 店舗を展開するスペシャルティコーヒー専門店、Le Premier Cafe（ル プルミエ カフェ）様のコーポレートサイトとオンラインショップを制作させていただきました。

1997 年の創業以来「人生になくてはならない一杯を届けたい」という想いで続けてこられたお店です。店舗に来てくださるお客様、珈琲豆を通販で買ってくださるお客様、卸や OEM を検討される法人のお客様、そして働きたい方。訪れる人の目的が幅広いため、会社の紹介とオンラインショップを別々のサイトにせず、1 つのサイトの中で自然に行き来できる構成にしました。

デザインの考え方

• 店の空気をそのまま … メインビジュアルは心斎橋本店の店内写真に「Cheers Your Life／あなたを応援する一杯を」というメッセージを重ね、焙煎やドリップの写真を各所に使って、コーヒーの香りが伝わるような構成にしています
• 濃紺と珈琲色 … 文字やボタンは落ち着いた濃紺、オンラインショップへの誘導や会員登録の帯はキャラメル色と、役割で色を分けました。白地を広く取り、商品写真と店内写真が映えるようにしています
• 2 つの入口を常に … ヘッダー右上に「お問い合わせ」と「オンラインショップ」を並べ、スマートフォンでは画面下に会員登録への帯を固定。どのページからでも買い物と相談に進めます

ページ構成

オンラインショップ

オンラインショップは WordPress に WooCommerce を組み合わせて構築し、会社の紹介ページと同じデザインの中で買い物ができます。

• 珈琲豆・コーヒーバッグなどの商品カテゴリーと、焙煎度（深煎り・中深煎り など）や風味の説明つきの商品ページ
• 会員登録・マイページ・お気に入りリスト。送料無料の条件は画面上部の帯で常に案内
• ギフトサービス（手提げ袋・のし・包装）と大口注文の案内。結婚式の引き出物などの相談につなげます
• 最近見た商品の表示など、再訪したお客様が商品を探しやすい工夫

運用面の工夫

• お知らせ・メディア掲載・採用情報はすべて WordPress の投稿として作り、スタッフがご自身で更新できます
• 法人のお客様向けには、卸売・出店依頼・店舗開発・取材など問い合わせの種類を選べる専用フォームを用意し、一般のお問い合わせと分けました
• 社長ブログやお客様インタビューなど、読み物への入口をトップに置いて、SNS からの流入を受け止められるようにしています

制作内容

• サイト構成の設計と原稿整理
• デザイン（PC・スマートフォン）
• WordPress + WooCommerce でのサイト構築（オンラインショップ、会員機能、店舗・会社紹介、お知らせ・採用の投稿機能、一般・法人のお問い合わせフォーム）
• 公開作業と更新方法のレクチャー

Le Premier Cafe 公式サイト →