LP WordPress

KOKE COFFEE LPサイト

KOKE COFFEE →

サイト種別1ページ完結型 LP(WordPress)
目的①新規オープン前の認知獲得
②来店促進(アクセス・営業時間の明示)
③Instagramアカウントへの誘導・フォロワー獲得
ターゲットユーザー20〜30代の女性(おしゃれカフェ好き・SNS活用層)
リモートワーカー・コーヒーこだわり層(30〜40代男女)
制作環境WordPress / 自作カスタムテーマ / Local(ローカル開発環境)
対応デバイススマートフォン優先(SP/PC レスポンシブ対応)
製作期間約2週間

コンセプト

大阪・中崎町の路地裏にひっそりと佇む、苔と植物をテーマにしたスペシャルティコーヒー店「KOKE COFFEE」。喧騒から一歩離れ、緑に囲まれた静かな時間のなかで一杯と向き合う——そんな体験を提供するお店です。架空の店舗ながら、「この街にこの店があったら」という前提を細部まで設計し、ブランドの世界観からサイトの隅々までを一貫させることを目指しました。

ターゲット

日常の速度から少し降りて、ものごとを丁寧に味わいたい人。コーヒーの背景にあるストーリーや、空間そのものの心地よさを大切にする層を想定しています。「映え」ではなく「静けさ」に価値を感じる人に届くことを意図しました。

デザイン

軸にしたのは「目的→表現」という考え方です。苔や植物がもつ、しっとりとした落ち着きと生命感をどう画面で再現するか。深いグリーンを基調に、余白を大きくとり、文字組みもゆとりをもたせることで、スクロールするごとに呼吸が深くなるようなリズムを設計しました。賑やかさで惹きつけるのではなく、静けさで居心地をつくる——お店の価値とサイトの印象が地続きになるよう、一つひとつの要素を選んでいます。

担当箇所

要件定義からサイト設計、ワイヤーフレーム(PC/SP)、WordPressによる実装までを一貫して担当しました。クライアントドキュメントやペルソナシートといった上流の設計資料から積み上げることで、見た目だけでなく「なぜそうしたか」を説明できる制作を心がけています。

使用技術・ツール

WordPress(オリジナルテーマ自作)/Local by Flywheel(ローカル開発環境)/Smash Balloon(Instagramフィード連携)/Contact Form 7(お問い合わせフォーム)/HTML・CSS・PHP/Excel・HTML(設計ドキュメント・ワイヤーフレーム作成)

制作物一覧

  • クライアントヒアリングシート
  • ペルソナドキュメント
  • サイト仕様書
  • コンテンツマップ
  • ディレクトリマップ
  • ワイヤーフレーム(PC/SP)
  • オリジナルWordPressテーマ
  • ローディングアニメーション
  • スマートヘッダー
  • 管理画面マニュアル