AIと一緒にLPを作るキット
使い方ガイド
このキットは、AI（Claude Code または Codex）があなたに1問ずつ質問しながら、 LP（ランディングページ）の文章・デザイン・公開までを一緒に進めてくれる道具箱です。 難しい操作はAIが担当します。あなたは質問に答えて、出てきた案から選ぶだけ。
まずキットをダウンロード
全体像 — 何がどうなるの？
あなたがAIと会話すると、AIがLPのファイルを作り、それをCloudflare（クラウドフレア）という 無料のサービスに載せて、世界中から見られるURLになります。
必要なもの（3つだけ）
| 必要なもの | 費用 | メモ |
|---|---|---|
| Claude Code または Codex | ツールによる | どちらか片方でOK。すでに使っているものがあればそのままで大丈夫です |
| Node.js 18以上 | 無料 | 文章の改行をきれいにする道具が使います。無ければAIが案内してくれます（nodejs.org） |
| Cloudflareアカウント | 無料 | 公開するときだけ必要。メールアドレスがあれば作れます（登録ページ） |
💡 CloudflareのLP公開は無料の範囲で十分収まります。 クレジットカードの登録も不要です。
はじめかた（4ステップ）
-
1
ZIPを解凍して、好きな場所に置く
デスクトップでも書類フォルダでもOK。「chige-lp-kit」というフォルダができます。
-
2
そのフォルダをAIツールで開く
ターミナル（Mac：「ターミナル」アプリ／Windows：「PowerShell」）を開いて、
cdと打った後にフォルダをドラッグ＆ドロップしてEnter。 つづけてclaudeまたはcodexと打ってEnter。 -
3
セットアップして と送る
道具の準備と、あなたのブランド（色・雰囲気）のインタビューをAIが順番に進めます。 エラーが出ても、その文をそのままAIに貼れば直してくれます。
-
4
LPを作りたい と送る
ここからが本番。AIが1問ずつ質問してくれるので、答えるだけです。
作る流れ — AIは勝手に作りません
このキットのAIは、あなたのOKが出るまで次の工程に進まないよう設計されています。 質問はまとめてではなく1問ずつ。「デザインはどうしますか？」「ブランドカラーは？」 「参考にしたいサイトはありますか？」と聞かれるので、思いつくまま答えてください。 参考サイトが思いつかなければ、日本の有名サイト318件の中からAIが候補を出してくれます。
💡 途中でやめても大丈夫。翌日「続きから」と送れば、AIが状況を見て再開します。
AIは「いいですね」で終わらせません
このキットのAIは、言われたとおりに作るだけの係ではありません。 商品の弱いところを正直に伝え、法律に触れそうな表現を止め、公開前に危ないものが 混ざっていないか点検します。
① 商品へのフィードバック（文章を書く前）
ヒアリングのあと、AIはすぐ書き始めずに、次の5つが答えられるか確かめます。 埋まらないところがあれば、質問の形で返してきます。
| AIが確かめること | 埋まらないと、こうなります |
|---|---|
| 誰の問題か（1人に絞れているか） | 「みんな向け」＝誰にも刺さらない |
| 申込の前と後で、何がどう変わるか | 機能の説明だけのLPになる |
| なぜ「あなた」から買うのか | 値段だけで比べられる |
| それが本当だとどう分かるか（証拠） | 「できます」の羅列で信用されない |
| 申込む人がいちばん不安なのは何か | FAQが的外れになり、迷った人が去る |
💡 遠慮なく指摘しますが、言うのは多くても2〜3点まで。 「今はこれでいい」と答えれば、それ以上は押さずに先へ進みます。
② 法律のチェック（特定商取引法・景品表示法など）
LPで有料の申込・購入をしてもらうなら、法律で決められた表記のページが必要です。 AIが「お金の申込がありますか？」と最初に聞いて判断し、必要なら項目を1つずつ聞いて作ります。
| 判定 | 意味 |
|---|---|
| ✅ 通過 | 明らかな問題は見当たらない |
| ⚠️ 要確認 | あなたの判断・専門家の確認が必要 |
| 🛑 ブロック | 直すまで公開しない（「大丈夫だから」では通しません） |
🛑になりやすいのは、「必ず〜できます」の断定、根拠のない「No.1」、 実際には売っていない「通常価格」との比較、実態のない「残りわずか」など。
⚠️ AIのチェックは、法律に適合していることの保証ではありません。 金額の大きい商品、健康・美容・投資に関わるものは、専門家に一度見てもらってください。
③ 公開前の安全点検
最後に、公開して困るものが混ざっていないかを点検します。とくに大事なのが
「公開されるのは public フォルダの中だけ」という決まりです。
ほかに点検するのは、こんなところです。
- 申込フォームの送信先が自分のものか（他人のフォームIDが残っていると、お客さんの情報が他人に届きます）
- HTMLにパスワードやAPIキーを書いていないか（HTMLは誰でも中身を読めます）
- 写真の位置情報（スマホの写真には撮影場所が埋まっていることがあります）
- 【仮】の価格や日程が残っていないか、リンク切れがないか
🚦 危ないものが見つかったら、AIは公開を止めて先に直そうと言ってきます。
公開（デプロイ）のしくみ
「デプロイ」とは、パソコンの中にあるLPのファイルを、インターネット上に置いて 誰でも見られるようにすることです。このキットではCloudflare Pagesという 無料サービスを使います。しくみは下の図のとおりです。
初回だけ：Cloudflareとつなぐ準備（2つ）
最初の公開のときだけ、次の2つの準備があります。2回目からは何も要りません。
あなた Cloudflareのアカウントを作る（メールアドレスで登録、無料）
あなた AIがログイン用コマンドを打つとブラウザが自動で開くので、「Allow（許可）」ボタンを押す
公開のコマンド（参考）
実際の公開はAIがやります。あなたが覚える必要はありませんが、 AIが打つのはこういうコマンドです（実行前に必ず「このURLで公開していいですか？」と確認されます）。
AIが実行 実行すると https://〇〇.pages.dev というURLが発行されます。
公開したあと
- 修正したいとき：AIに直してもらって、もう一度「公開して」と言うだけ。同じURLのまま中身が新しくなります（図4の点線）。
- 自分のドメイン（例：example.com）を使いたいとき：あとからCloudflareの画面で設定できます。必要になったらAIに「独自ドメインをつなぎたい」と相談してください。
あなたがやること／AIがやること
| あなた | AI |
|---|---|
| 質問に答える（1問ずつ来ます） | 質問を考えて、答えを形にする |
| 構成・文章・デザイン案にOKを出す／選ぶ | 構成案・文章・デザイン2案を用意する |
| Cloudflareのアカウント作成と「Allow」ボタン | コマンド実行・ファイル作成・公開・チェック |
| パスワードなどの秘密情報はチャットに貼らない | 秘密情報を聞かない・要求しない |
こまったとき Q&A
- Q. スキルが効いていない気がする
- A. ツール（Claude CodeまたはCodex）をいったん終了して、同じフォルダで開き直してください。
- Q. 「Cannot find module 'budoux'」というエラーが出た
- A. AIに「lp-lineのnpm installをして」と頼んでください。
- Q. Node.jsが無いと言われた
- A. nodejs.org から推奨版（LTS）をインストールしてください。ここだけは人間の作業です。
- Q. デザインの参考が思いつかない
- A. AIに「候補を出して」と言えば、日本の有名サイト318件の中から提案してくれます。
- Q. UI部品の名前が分からない（「あの丸いアイコンが重なってるやつ」みたいな）
- A. そのままの言葉で伝えてOK。AIがUI用語辞典（namethatui.com）で正式名称を確認してくれます。
- Q. ファイルを壊してしまった
- A. ZIPをもう一度解凍すれば、最初の状態に戻ります。
🍵 だいじなこと：パソコンは壊れません。出てくるのはエラーの文字だけで、 そのままAIに貼れば直してくれます。1回で終わらせようとせず、疲れたら翌日「続きから」でOKです。