💡 この資料は 「受注前」 のフェーズを解説する。1業種に絞ってからリサーチで営業先候補を5件見つけ、その会社の デモHP を AI で作って 営業で見せる流れ。営業の詳細は 資料② で。
🎯 営業文に 「貴社のデモHPを試作しました：URL」 と書くだけで反応率が数倍に。AI で1日で作れるからこそ成立する戦略。
最初の1業種に絞ることで、リサーチもデモHP制作も営業文も精度が上がる。地元・知人に多い業種なら強い。
🎯 推奨4業種：客単価が高く比較検討される業種を厳選。HP需要も高い。慣れてきたら別業種にも展開できる。
1業種に絞ったら、その業種で「古いHPを持っている／HPがない」会社を Google Map で探す。最初は5件あれば十分始められる。
口コミ評価が高い＝顧客満足度が高い＝HPに投資する余裕がある可能性大
HPなし＝新規ニーズ。古いHP＝リニューアル提案の余地大
地域密着＝Google検索流入を意識する業種ほどHP価値を理解している
📘 リサーチの詳細手順は 資料②「営業の進め方と管理」 で解説。
Claude Design でテンプレ生成 → Claude で顧客情報に書き換え。
スピード重視。1案件1日で叩き台。
リサーチ → ChatGPT で画像生成 → Claude Code でコーディング。
独自性重視。1案件2-3日で完成度高い。
💡 どちらも「AIでゼロから作る」点は同じ。違いは テンプレを起点にするか／画像を起点にするか。
💡 Claude Design の生成テンプレは構造が整ってる。変えるのは顧客情報と配色・写真だけでOK。1案件 1日でデモHP公開URL まで完成。
📹 実機の操作画面は 解説動画ページ で公開予定。
💡 「この会社らしいHP」を画像で表現してから Claude Code に渡す。デザイナー無しで独自感あるデモHPが作れる。1案件 2-3日。
📹 実機の操作画面は 解説動画ページ で公開予定。
🎯 案件を取る前に判断軸で悩むより、とにかく両方完成させるのが何より大事。慣れたら案件によって使い分けOK。迷ったらまず Claude Design方式 から始めるのが安全策。
AIが生成した 骨格は信用してそのまま使う（80%）。表面（配色・コピー・写真等）を案件ごとに差し替え （20%）。
骨格80% + 表面カスタム20% = テンプレ感ゼロ
| 症状 | 原因 | 対処法 |
|---|---|---|
| Claude Design でエラー | プロンプトが長すぎ／添付画像が多すぎ | プロンプトを300字以内に。画像は1-2枚まで |
| ChatGPT 画像が毎回違う | 同じプロンプトでも生成は確率的 | 気に入ったら即「同じ雰囲気で別パターンを3つ」と指示。シード保存 |
| Tailwind クラスが効かない | Claude Code が存在しないクラス名を出力 | 「Tailwind v3.4 の標準クラスのみ使用」と明記 |
| 日本語が崩れる | Cloudflare デプロイ後、Web フォント未読み込み | Google Fonts（Noto Sans JP）を head に必ず追加 |
| 顧客情報の置換漏れ | テンプレの「サンプル工務店」等が残ったまま納品 | 納品前に grep -r "サンプル" でチェック |
| Cloudflare ビルドエラー | Node バージョン不一致 / package-lock.json 不整合 | Cloudflare 設定で Node 20 指定。.nvmrc も追加 |
| 営業メールが迷惑判定 | 件名に「無料」「絶対」、URL が短縮されすぎ | 件名は具体的に。URL は pages.dev 正規ドメインで送信 |
💡 詰まったらリベシティ専用チャットルームへ。仲間が同じ症状で先に詰まってる可能性大。
💡 Cloudflare Pages は無料・高速・独自ドメイン対応。「貴社のデモHPはこちら：URL」と営業文で送れば、相手はクリック1つで自社用HPを体験できる。これが反応率の鍵。
📗 営業の詳細手順（営業文の5パート構成・NG表現リスト・反応後の動き方）は 資料②「営業の進め方と管理」 で。10件送って1反応が標準値。
案件規模に応じて3プラン提示。「迷ったらスタンダード」が決まりやすい。
誇大表現は使わない
都度画面を共有
納品後1ヶ月OK
更新動画＋PDF