知識ゼロからAIで作る！システムエンジニア流・売れるLP爆速作成術②

1. はじめに：いよいよAIを「プロのエンジニア」として動かす！

前回、素人がAIでLPを作る際に失敗する理由と、それを防ぐための「システム開発工程（要件定義 → 設計 → 実装 → テスト）」の重要性について解説しました。

今回の【実践編】では、いよいよ実際にAIを動かしていきます！ やることはとてもシンプル。「ヒアリングシートを埋めて、AIに丸投げするだけ」です。

Googleの「Gemini」に完璧な仕様書（設計図）を書かせ、次世代AI開発環境「Google Antigravity」に全自動でコーディング（実装）させるという、魔法のような開発プロセスを一緒に体験しましょう！

2. フェーズ1：ヒアリングシートで「要件定義」をする

システム開発の第一歩は「要件定義」。つまり、どんなLPを作りたいのかを明確にすることです。 しかし、真っ白な画面に向かってゼロから要望を書き出すのは大変ですよね。

そこで今回は、AIに的確な指示を出すために特化した**「AI専用LP要件定義シート（Excel）」**をご用意しました！

🔽 読者限定特典：ヒアリングシートのダウンロードはこちら [ヒアリングシート_テンプレ.xlsx のダウンロードリンク]

まずはこのエクセルファイルをダウンロードしてください。

💡 記入例とプロのハック（NG条件の書き方）

シートにはあらかじめ「オンライン英会話」を想定した記入例が書いてあります。これを参考に、あなたのビジネスに書き換えていくだけでOKです。

• LPの最終ゴール：無料体験レッスンに申し込む
• ターゲットと悩み：30代〜40代のビジネスパーソン。TOEICの点数はあるが、実際の会議で英語が話せず悔しい思いをしている。
• 強みとベネフィット：ビジネス経験豊富なネイティブ講師によるマンツーマン指導。実践的なロールプレイ中心。
• 【超重要】NG条件・例外処理：「初心者歓迎」「日常英会話」といった表現は含めないこと。画像生成のプレースホルダー（仮枠）に文字は入れないこと。

AIを思い通りに動かす最大のコツは、この「絶対にやってほしくないこと（NG条件）」を明記することです。これを書いておくだけで、ターゲットからブレたキャッチコピーが出てくるのを防ぎ、後からの修正（手戻り）が劇的に減ります。

3. フェーズ2：Geminiにシートを読ませて「仕様書」を作る（設計）

ヒアリングシートが完成したら、最初のAI「Gemini」の出番です。 ここからはGeminiを「超優秀なWebディレクター」として扱います。

Geminiのチャット画面を開き、先ほど記入したエクセル（ヒアリングシート_テンプレ.xlsx）をそのままアップロードして、以下のプロンプト（指示文）をコピペして送信してください。

【コピペOK！Gemini用 仕様書作成プロンプト】
あなたはプロのWebディレクター兼優秀なシステムエンジニアです。 添付した「ヒアリングシート」の内容を読み込み、この商品・サービスを売るためのランディングページ（LP）の構成案と、各セクションに入る魅力的なキャッチコピー・セールスライティングを作成してください。
最終的に、実装担当者（コーディングAI）へそのまま渡すための「仕様書」として、ヘッダー、ヒーローセクション（FV）、ベネフィット、商品詳細、アクションへの誘導（CTA）の順に、論理的な構造で出力してください。

たったこれだけです！ あなたがエクセルに書いたターゲットの悩みや強みをGeminiが完璧に読み取り、プログラミング用の整理された仕様書（設計図）を一瞬で作成してくれます。

4. フェーズ3：Google Antigravityにコードを丸投げする（実装）

Geminiから完璧な仕様書が出力されたら、次はいよいよ「実装（コーディング）」です。 ここで、Googleが提供する次世代のAI統合開発環境「Google Antigravity」が登場します。

💡 Antigravityの準備について

Antigravityは、チャットで指示するだけでAIが自律的にコードを書き、プレビューまで行ってくれる最強のツールです。 インストールや初期設定については、[こちらの解説動画]などを参考にサクッと済ませておきましょう！

https://youtu.be/AT7muM2RpBs?si=JIhPP0Klq6w8vraE

準備ができたら、Antigravityのチャット欄に、先ほどGeminiが作ってくれた「仕様書」をテキストごと全コピーして貼り付けます。

そして、最後に一言こう添えてください。

「この仕様書に基づいて、モダンで美しいLPのコード（HTMLとTailwind CSS）を作成してください。なお、画像生成のプレースホルダーには文字を入れないでください。」

あとはエンターキーを押して、画面を眺めるだけ。 AIエージェントが自律的に計画を立て、凄まじいスピードでコードを組み上げ、プレビュー画面に美しいLPが出現する感動を味わってください！

5. フェーズ4＆5：チャットで微調整して、いざ公開！（テスト・リリース）

Antigravityが生成したプレビュー画面を見て、「想定通りか」をチェックします（テスト工程）。

もし「ボタンの色をもう少し濃くしたい」「ここの文字をもっと大きくしたい」と思ったら、Antigravityのチャット欄にそのまま「申し込みボタンを少し大きくして」と日本語で指示するだけでOK。AIが瞬時に該当箇所のコードを見つけて修正してくれます。

コードを一行も触ることなく、納得のいくデザインに仕上がったら完成です！

あとは、出来上がったHTMLファイルなどの一式を、ご自身が使い慣れているホスティングサービス（おすすめはNetlify、Cloudflare Pagesなど）にアップロード（デプロイ）すれば、あなたのLPが全世界に公開されます。（デプロイの仕方については要望があれば記事を出します）

6. まとめ：さあ、あなたのアイデアを形にしよう！

2回に分けて、システムエンジニアの思考法を取り入れたAIによるLP作成術を解説してきました。

1. 要件定義：ヒアリングシート（エクセル）を埋める
2. 基本設計：Geminiにシートを読ませて仕様書化
3. 実装：Antigravityに仕様書を渡してコード生成
4. テスト：チャットで微調整する
5. リリース：サーバーにアップして公開！

この「ヒアリングシート起点」の開発プロセスなら、もう真っ白な画面を前にフリーズすることも、高額な外注費に悩むこともありません。

まずは今すぐヒアリングシートをダウンロードして、売りたい商品について書き出すところから始めてみましょう。あなたの副業やビジネスが、今日ここから大きく加速するはずです！