予約を取らない喫茶店で試したら、この方法の限界が見えた

美容室、整体院と作ってきて、どちらも予約フォームが中心にありました。

今回はわざと予約のない業種を選びました。喫茶店です。この方法が「予約が必要な商売にしか使えない」のかどうかを確かめたかったからです。

できあがったもの

架空の喫茶店「つばき」のサイトです。

完成したサイトを見る

席の予約は受け付けていません。代わりに貸切・ケータリング・取材の問い合わせフォームを置きました。用件を選ぶと、必要な入力欄が出てきます。

結論：崩れなかった。ただし理由が変わった

予約フォームは要りませんでした。でも問い合わせフォームは要りました。

喫茶店に来る問い合わせは、種類が決まっています。

• 貸切のご相談（撮影、読書会、同窓会）
• ケータリング
• 取材・撮影
• 豆の卸

どれも頻度は低いです。月に1件あるかどうか。でも1件あたりの金額が大きい。 貸切1日でふだんの売上の何倍にもなります。取材が載れば新規のお客さんが来ます。

つまり取りこぼしたときの損失が大きい問い合わせです。Instagramのメッセージだと埋もれます。だからフォームが要る。

そしてフォームがある以上、送信を受け取る場所が要ります。 結局サーバーに戻ってきました。

崩れかけた場所①：日替わりメニュー

ここは正直に書きます。うまくいきませんでした。

喫茶店には日替わりがあります。本日の豆、日替わりの一品。これをサイトに載せると、毎日ファイルを書き換えることになります。

AIで作った静的なHTMLは、これが苦手です。1週間は続くかもしれませんが、1ヶ月は続きません。忙しい日に更新を飛ばして、そのうち止まります。止まったサイトは、情報がないサイトより悪い。 古い情報が載っているからです。

なので設計を変えました。

• 日々変わるものはInstagramに任せる
• サイトには週に一度更新すれば足りるものだけ置く
• そして「日々の入荷や営業のお知らせはInstagramで更新しています。このページは週に一度の更新です」と明記する

この一文があるだけで、古い情報を見た人が誤解しません。デモにも入れてあります。

崩れかけた場所②：そもそもサイトが要るのか

喫茶店なら、Instagramだけで足りるのではないか。実際そうしている店はたくさんあります。

これは正面から考える必要がありました。結論としては、役割が違います。

Instagramは「今日」を伝えるのが得意で、ホームページは「いつも」を伝えるのが得意です。 両方あるのが一番いい。片方だけなら、店の性質によります。

新規のお客さんが検索やマップから来る店なら、ホームページの価値は大きい。常連だけで回っている店なら、Instagramで足りるかもしれません。これは正直な話です。

用意するもの

必要なものは、どこまで店のサイト内で完結させたいかによって変わります。

実際に使ったプロンプト

全文置きます。太字の部分が、今回あらたに必要になった指示です。

喫茶店のホームページを1ファイルのHTMLで作ってください。

【店の情報】
店名：喫茶 つばき
場所：東京都千代田区神田神保町　神保町駅 A7出口から徒歩3分
創業：1978年
営業時間：8:00-19:00（L.O. 18:30）
定休日：水曜日
席数：18席（カウンター6／テーブル12）／全席禁煙／Wi-Fiあり
特徴：本を読みに来る人が多い。時間制限なし。焙煎は週に二度、店の奥で。
　　　名物はない。コーヒーとナポリタンとプリンが、いつもと同じ味で出る店。

【おしながき】
ブレンド珈琲 550円 ／ 本日の珈琲 600円 ／ アイス珈琲 600円
紅茶（アッサム・アールグレイ）550円 ／ クリームソーダ 700円
ナポリタン 950円 ／ たまごサンド 800円 ／ トーストセット 650円（11時まで）
日替わりの一品 700円 ／ プリン 500円 ／ あんバタートースト 600円
※すべて税込

【入れてほしいもの】
・トップ、本日のご案内、おしながき、豆と店のこと、アクセス、お問い合わせ
・席の予約は受け付けていないことを明記
・お問い合わせフォームの用件は4つ：
　貸切のご相談／ケータリング／取材・撮影／豆の卸・その他
・用件によって必要な入力欄を出し分けてください
　　貸切・ケータリング → 希望日と人数を必須にする
　　取材・撮影 → 掲載先・放送予定を必須にする
・希望日は1週間先から半年先まで。水曜（定休日）は選べないように
・電話番号は任意。ただし入力されていたら形式をチェックする
・入力 → 確認画面 → 完了、の3ステップにする
・スマホで見たときに崩れないようにする

【アレルギー表示について】
・小麦・卵・乳を使う品が多いことを書いてください
・ただし「完全に混入を防げる」とは書かないでください
・気になる場合は注文前に声をかけてほしい、という書き方にしてください

【日替わり情報の扱い】
・日々変わる情報はInstagramで更新する前提にしてください
・サイトには週に一度の更新で足りる情報だけを置いてください
・「このページは週に一度の更新です」と明記してください

【デザインの方向】
昔ながらの喫茶店の雰囲気。深い臙脂色と生成りの白。
見出しはレトロな明朝体。落ち着いた、少し古びた感じ。
派手さは要りません。

3業種やって分かったこと

入力欄を用件で出し分ける、という指示が通りました。 「貸切なら日付と人数、取材なら掲載先を必須に」と書くだけで、そのとおりのものが出てきます。前2回より複雑な要求ですが、具体的に書けば通ります。

アレルギーの書き方も、指示すれば配慮します。 何も言わないと「安心・安全」みたいな言葉を出してきますが、「完全に混入を防げるとは書かないで」と指定すれば守ります。整体院のときと同じで、AIは指示しない限り配慮しません。

そして判断するポイントが見えました。 問い合わせ窓口が必要かだけでなく、どこで受け取り、誰と共有し、どの程度自分向けに作り込みたいかで選ぶ方法が変わります。

予約、問い合わせ、資料請求は、外部フォームや既存サービスでも受け取れます。自分のサイト内で完結させたい、独自の入力や保存ルールを使いたい、複数人で状態を共有したい場合には、サーバー側の処理を持てる環境が便利です。

フォームを本当に動かすには

3回とも同じ壁です。

フォームの見た目も入力チェックも完成しますが、送信を押しても内容がどこにも届きません。 届け先がないからです。

受け取り方には、外部フォームや既存の問い合わせ管理サービスを使う方法と、自分の公開環境へ送信処理を置く方法があります。件数が少なければ外部サービスで十分な場合もあります。独自の項目や共有方法まで作りたい場合は、サーバー側の処理を持てる環境が候補になります。

つまずいたところ

日替わりを毎日更新する前提で作ってしまった 最初の試作では、本日の豆と日替わりをトップの一番上に大きく置きました。作った直後は格好いいのですが、これを毎日直すのは無理だと気づいて設計を変えました。作る前に「続けられるか」を考えるべきでした。

「こだわりの一杯」という言葉が出てきた 指示しないと、AIはこういう言葉を使います。悪くはないのですが、この店の性格に合いません。「名物はありません」という書き出しにしたら、店の雰囲気が出ました。AIが出した文章をそのまま使わないのが大事です。

電話番号を必須にしていた 問い合わせフォームで電話を必須にすると、離脱します。メールで足りる用件も多い。任意に変えました。必須項目は少ないほどいいという基本を忘れていました。

まとめ

3業種やって、手順はほとんど変わりませんでした。 変わるのは、その店のお客さんが何を知りたいかと、書いてはいけないことがあるかどうかだけです。

そしてこの方法には限界もあります。 毎日更新が必要な情報は向いていません。そこはSNSに任せて、サイトは「いつも変わらないこと」を担当するのが現実的です。

3業種で見えた境界線と、次に何を試すかはこちらにまとめています。

現在の比較基準は、無料公開とレンタルサーバーの違いにまとめています。