なぜ「一文でページ全体を生成」はしばしば期待外れに終わるのか、何が問題なのか。
一文のプロンプト（「かっこいいランディングページを作って」）はAIに与える情報量が少なすぎるため、AIは指定されていないすべての詳細を自分で補完しなければならない——いくつセクションを置くか、各セクションに何を入れるか、どんな配色を使うか。こうして補完された内容は通常、統計的に最も一般的なテンプレートの組み合わせであり、「一般的なランディングページはこうあるべき」という見た目にはなるが、「あなたの製品はこうあるべき」というものにはならない。
問題はAIの生成能力が不足していることではなく、プロンプト自体が決定権を自分の手元に残していないことにある——レイアウト構造やコンテンツの詳細といった、ページが製品に本当に合っているかを左右する重要な決定が、AIに統計的に最も無難な方法で埋めさせる形で受動的に委ねられてしまっている。
セクションごとの生成は時間がかかりそうに聞こえるが、なぜ実務上はむしろ時間の節約になるのか。
表面上、ページ全体を一度で完成させるよう求める方が対話のラウンド数を節約できるように見える。しかし、ページの半分のセクションに手直しが必要になると、多くの場合、一箇所を修正すると他の箇所も引きずられて変わってしまう（ヒーローセクションの高さを調整すると、下のセクションのレイアウトが崩れる）ことに気づく。結局、「意図しない副作用の修正」に費やす時間は、セクションごとの生成で増える対話ラウンド数を上回ることが多い。
セクションごとの生成は各ラウンドの調整範囲が小さいため、AIが同時に考慮すべき変数が減り、「ここを直したらあそこが壊れる」という確率も下がる。対話ラウンドを数回多く使う代わりに、各ステップがより制御可能になる——この時間の収支は、ほとんどの場合において割に合う。
「まず構造を、次に細部を見る」とは具体的にどうすればいいのか、実際のチェック方法はあるのか。
最初の草案を受け取ったら、細部への注意をいったん脇に置き、ページ全体を上から下までスクロールして見ながら、いくつかの問いに答える——ユーザーが最初に見る内容は「これが何をするものか」を明確に伝えているか、下にスクロールしたとき情報が出てくる順序は論理的か（このターゲット層には痛みのポイントを先に語るべきか、機能を先に語るべきか）、最後までスクロールしたとき次に何をすべきか明確に分かるか（ボタンのテキストは明確な行動を示しているか、曖昧な「詳しくはこちら」ではないか）。
この3つの問いすべてに滞りなく答えられれば、構造の層に問題はないということなので、色、フォント、画像といった細部の調整に進める。構造の層がまだクリアできていなければ、細部を何度も調整するより、まずここに時間をかけて修正する方が通常効率的だ——構造の問題は色を変えるだけでは自動的に解決しないからだ。
この記事の流れはどんな状況に適しているのか、適用できない場合はあるのか。
このワークフローは「誰に見せるか、相手に何をしてほしいかが既に分かっている」状況で特に効果的だ——例えば明確な製品とターゲット層を持つ中小企業のオーナーや、クライアント向けの提案書の下書きを素早く作りたいフリーランスデザイナーなど。純粋なビジュアル探索が目的で、まだ製品のポジショニングやターゲット層を決めていない場合、早すぎる段階でレイアウト構造を固定してしまうと発散的思考にかえって不利になる。この段階では、低忠実度で複数の方向性を並行して探索する方が適しており、最初からこのワークフローに沿ってセクションごとに収束させるべきではない。
言い換えれば、このワークフローは「方向性は既に決まっており、必要なのはそれを素早く確実に形にすること」を前提としている。方向性自体がまだ定まっていないなら、まずその問題を解決してから、このワークフローを実行に適用すべきだ。
多くの人が初めてAIでランディングページを生成する際、「かっこいいランディングページを作って」とだけ入力し、結果として見た目は悪くないが編集の仕方が全く分からないページを手に入れる——レイアウト構造が曖昧で、内容は実際の製品と関係がなく、特定のセクションを調整しようにもどこから手をつければいいか分からない。この記事では、最初のプロンプトから実際に使えるレイアウトまでの、より実践的なワークフローを紹介する。
プロンプトを入力する前に、3つの問いに答えておく——このページは誰に見せるのか、見た後に相手にどんな行動をしてほしいのか、ページに必ず入れなければならない具体的な内容（製品名、実際の売り、実際の価格）はあるか。答えは美しく書く必要はないが、具体的でなければならない——「テック感のあるページ」は答えではなく、「まだ我々のシフト管理ソフトを使ったことがない飲食店オーナーに見せ、読んだ後に『14日間無料トライアルを開始』をクリックしてほしい」が答えだ。このステップが後続のプロンプトの品質の上限を決める。曖昧な出発点からは曖昧なページしか生まれない。
先ほど考えた3つの答えを直接プロンプトに書き込み、ページに必要なセクション（ヒーロー、機能紹介、価格プラン、顧客の声、締めくくりのコールトゥアクション）と、各セクションに何を入れるかを明示する——「機能紹介セクションを追加」ではなく、「機能紹介セクションには4枚のカードが必要で、それぞれシフト衝突の自動検知、休暇承認のワンクリック処理、店舗間の人員配置、給与試算」と書く。レイアウトの具体性は最も見落とされがちだが最も効果的なレバーだ——AIに何枚のカードを置くか、カードに何を入れるかを決めさせるより、その決定権を自分の手元に残しておく方が、AIが想定と違うものを自由に作り出す余地をなくせる。
ページ全体のすべてのセクション、すべての文言、すべてのビジュアルスタイルを一つのプロンプトに詰め込むと、通常どこもかしこも平凡で、特に優れた部分がない結果になりがちだ。より安定した方法は、まず全体構造（セクションの順序、大まかなレイアウト）を確定させ、その後セクションごとにAIに調整を求めることだ——まずヒーローセクションの見出しとレイアウトに満足がいくまで詰め、それから次のセクションへ進む。この方法は対話のラウンド数は増えるが、各ラウンドの調整範囲が小さいため、ある部分を調整する際に既に決めた他の部分まで一緒に崩れてしまう可能性が低くなる。
AI生成の最初の草案が出てくると、色やフォントに先に目を奪われがちだが、より根本的な問いを見落としてしまう——情報の順序は理にかなっているか、上から下までスクロールし終えたユーザーは次に何をすべきか分かるか。画面全体を一度通して見て、「もし自分がこの製品を全く知らない人だったら、このページを読んで何をする製品か、どこをクリックすべきか分かるか」と自問することをお勧めする。この問いに答えられなければ、配色がどれだけ美しくても意味がない。まずこの層を処理してから、ビジュアルの細部の調整に戻る価値がある。
AIでランディングページを生成する際に最もよく陥る落とし穴は、「AIの出来が美しくない」ことではなく、プロンプトが曖昧すぎるのに一度で完成した結果を期待してしまうことだ。この2つの問題が重なると、最初からレイアウト構造を考え抜いてセクションごとに生成するよりも、後から修正する時間の方がはるかに長くなる。「誰に見せるか、どんな行動を求めるか、どんな具体的な内容を必ず入れるか」を真剣に考え抜き、セクションごとの生成と組み合わせることが、実務上より確実に安定した方法であり、AIツールを本当に効率よく使えるか、それとも大量の手戻りを生み出してしまうかを分ける本質的な違いだ。