コラム / 活用ガイド

LP 作成を AI エージェントで回す

LP の成否を決めるのはデザインではありません。メッセージマッチ(広告と LP で同じことを言っているか)と、成果を正しく計測できているか、の 2 点です。設計書から単体の HTML、画像、計測タグ、ボタンを実際に押す検証までは、AI エージェントが同じ手順で何案でも作れます。人が受け持つのは、訴求軸とオファーの条件、法規とテストの計画シートの確認、本番の公開です。

  • 扱うもの
  • 広告の遷移先 LP
  • 既存 LP の改善
  • A/B テスト

ステップ 1オントロジー:出てくるモノと関係

業務に出てくるモノ(エンティティ)と関係を 1 枚にして、AI エージェントに渡します。

この図で答えたい問い

  • この案のファーストビューの一言は、遷移元の広告の一言と同じことを言っているか
  • この案の計測タグは、実際にデータを送っているか。ボタンを押して確かめたか、ファイルの中身を見ただけか
  • 計測が未設定のまま配信に回ろうとしている LP はどれか
  • この申し込みは、どの広告から来たか
  • 案 b は元の案から何を 1 か所変えたもので、成果は何件たまったか
  • ページを開いた人は、どの段でいちばん減っているか(流入元 × 端末ごと)
  • この LP の画像のうち、生成したものはどれで、提供された写真はどれか
LP 作成のオントロジー。点線は名寄せを表し、申し込みに残した utm やクリック ID から、どの広告から来たかをたどります。媒体が数える CV は数え方が違うため、LP の計測イベントとは突き合わせず、並べて見るだけにします。教科書 第 4 章 4.5 節をもとに描き、テストとの関係は第 3 章の実験の節で補いました。
LP 作成のオントロジー。点線は名寄せを表し、申し込みに残した utm やクリック ID から、どの広告から来たかをたどります。媒体が数える CV は数え方が違うため、LP の計測イベントとは突き合わせず、並べて見るだけにします。教科書 第 4 章 4.5 節をもとに描き、テストとの関係は第 3 章の実験の節で補いました。

図を原寸で開く

図の元になった mermaid を見る(AI エージェントにそのまま渡せます)
mermaid
flowchart TB
  CR["広告のクリエイティブ<br/>広告の一言 / 媒体 / 流入元の関心度"] -->|"遷移先にする"| LP["LP<br/>key: URL / CV の種類"]
  LP -->|"持つ"| DOC["設計書<br/>メッセージマッチ表 / 確認事項(推定)"]
  DOC -->|"広告の一言を引き継ぐ"| CR
  DOC -->|"使う"| OF["オファー<br/>条件・期限 / 法規の確認"]
  LP -->|"案を持つ"| VAR["LP の案<br/>key: 案の ID / 状態"]
  VAR -->|"持つ"| SLOT["差し替え箇所<br/>見出し / ボタン / メインの画像 / オファー"]
  VAR -->|"持つ"| SEC["セクション<br/>key: 区画の名前"]
  SEC -->|"使う"| IMG["画像<br/>由来: 提供写真 / 生成 / HTML で組む"]
  VAR -->|"埋め込む"| TAG["計測タグ<br/>測定 ID / ピクセル ID / 未設定"]
  TAG -->|"送る"| EV["計測イベント<br/>key: イベント名 / 案の ID"]
  EV -->|"区画を指す"| SEC
  EV -->|"記録する"| CV["CV<br/>最終 CV / マイクロ CV"]
  VAR -->|"受け付ける"| FORM["申し込み<br/>隠し項目: utm・クリック ID"]
  FORM -.->|"どの広告から来たか"| CR
  EV ---|"突き合わせない・足さない"| MED["媒体が数える CV<br/>数え方が違う"]:::out
  VAR -->|"持つ"| VER["検証の結果<br/>項目ごとに 4 区分"]
  EXP["テスト<br/>計画シート / 勝ち・負け・まだ分からない"] -->|"同じ条件で比べる"| VAR
  EXP -->|"判定に使う"| CV
エンティティの一意キーと、LP の案の状態を表で見る

エンティティと一意キー

エンティティ一意キー(同じ 1 件の見分け方)説明
広告のクリエイティブ自社の IDLP への流入元。広告の一言・媒体・流入元の関心度(顕在層・準潜在層・潜在層)を持つ
LPURLCV の種類(フォーム送信・電話・LINE の友だち追加・予約・資料請求など)を持つ。流入元が違えば別の LP にすることがある
設計書LP ごとに 1 つメッセージマッチの表・セクションの構成・ボタンの位置・フォームの項目と削った理由・離脱しそうな場所。HTML より先に書く
オファー自社の ID条件と期限、法規の確認欄を持つ。「要確認」が残る間は割引率を大きく載せない
LP の案案の ID(URL のパラメータ)元の案を複製し、差し替え箇所だけを書き換えて作る。1 つの案で変えるのは 1 か所
差し替え箇所箇所の名前見出し・サブコピー・ボタン・メインの画像・オファー。HTML の中でコメントで囲む
セクション区画の名前ファーストビュー・裏付け・比較または併用・権威と実績・お客様の声・クロージング
画像ファイル名由来を持つ。実在の店舗・スタッフ・料理・客室は提供された写真だけ。生成した画像は来歴を隣に保存する
計測タグ測定 ID・ピクセル ID・コンテナ IDID が無いときはダミーを入れず、入れる場所を空けておく
計測イベントイベントの名前名前は LP をまたいで固定し、すべてに案の ID を付ける
CV種類最終 CV と、その手前で必ず起きる行動(マイクロ CV)
申し込みフォームの送信広告のパラメータ(utm・クリック ID)を隠し項目に持つ
検証の結果案 × 項目問題なし/改善の余地あり/欠けている/あえて未設定、の 4 区分で書く
テスト計画シート伸ばす数字・判定の条件を始める前に書く。判定は勝ち・負け・まだ分からないの 3 つ

LP の案の状態

状態意味この状態に入る条件
設計書HTML はまだ無い。メッセージマッチの表と構成だけがある与件を確認し、設計書を書いたとき
未検証HTML はあるが、検証をしていない単体の HTML で案を作ったとき。「書いた」と「動いている」は別
欠けあり検証で「欠けている」項目が 1 つ以上残っている検証の結果に欠けている項目が出たとき。「完成」と報告しない
実発火は未確認ファイルの中身の確認だけを通ったブラウザが使えず、ボタンを押して計測が送られるかを確かめられなかったとき
納品可すべての項目が問題なし/改善の余地あり/あえて未設定のどれか2 段階の検証を終えたとき。計測が未設定なら納品書類の冒頭にそう書く
公開中本番に公開されている人が本番に公開したとき
負け(記録)テストで負けた。消さずに記録に残す計画シートの条件で負けと判定したとき。季節や競合が変わると勝つことがある

AI にさせてよい操作

  • AI が行う前工程の成果物を読み、設計書を書く(HTML より先)
  • AI が行う単体の HTML で案を作る。元の案を複製し、差し替え箇所だけを書き換えて次の案を作る
  • AI が行う背景・装飾の画像を生成する。図解や料金表は HTML で組んで画像にする
  • AI が行う計測タグを埋め込む。ID が無ければ場所を空け、納品書類に未設定と書く
  • AI が行うファイルの中身を確認し、ブラウザでボタンを押して計測が送られるかを確かめる
  • AI が行う既存の LP を 8 観点で採点する(ページは書き換えない)
  • 人が行う訴求軸とオファーの条件を決める。景品表示法・薬機法をクライアント側でも確認する
  • 人が行うテストの計画シートを確定する(AI が書き、一度止まって人が確認する)
  • 人が行うLP を本番に公開する。参考サイトを複製したものは公開しない
  • 承認してから案を遷移先にした広告の配信を始める

ステップ 2業務フローの棚卸し

左から、業務と頻度 → AI エージェントがやること → 人が決めること(黒) → 使う Skill(点線)。 AI に任せる作業が無いのは、公開の行だけです。参考サイトを複製したものは構成の研究と試作に使い、公開には回しません。
左から、業務と頻度 → AI エージェントがやること → 人が決めること(黒) → 使う Skill(点線)。 AI に任せる作業が無いのは、公開の行だけです。参考サイトを複製したものは構成の研究と試作に使い、公開には回しません。

図を原寸で開く

図の元になった mermaid を見る(AI エージェントにそのまま渡せます)
mermaid
flowchart TB
  subgraph R1[" "]
    direction LR
    J1["1. 与件の確認<br/>LP を作るたび"] --> A1["前工程の成果物を読み、足りない与件を 1 回で聞く。聞けなければ推定と明記"]
    A1 --> H1["CV の種類・使える素材・案の数"]:::human
    H1 --> S1["広告の遷移先 LP を作る"]:::out
  end
  subgraph R2[" "]
    direction LR
    J2["2. オファーの設計<br/>新しい訴求のとき"] --> A2["買わない理由から型を選び、条件・期限・法規の論点を書く"]
    A2 --> H2["オファーを選ぶ。法規の最終確認"]:::human
    H2 --> S2["オファー設計"]:::out
  end
  subgraph R3[" "]
    direction LR
    J3["3. 設計書<br/>LP を作るたび"] --> A3["メッセージマッチ表・構成・ボタンの位置・フォーム項目・離脱しそうな場所"]
    A3 --> H3["広告の一言(訴求軸)"]:::human
    H3 --> S3["広告の遷移先 LP を作る/広告コピー"]:::out
  end
  subgraph R4[" "]
    direction LR
    J4["4. 実装<br/>案を作るたび"] --> A4["単体 HTML。差し替え箇所をコメントで囲み、CV の発火を 1 関数に集める"]
    A4 --> H4["—"]:::human
    H4 --> S4["広告の遷移先 LP を作る"]:::out
  end
  subgraph R5[" "]
    direction LR
    J5["5. 画像<br/>実装と同時"] --> A5["背景・装飾は生成、文字が主役の図は HTML で組む。来歴を保存"]
    A5 --> H5["実在の写真を渡す"]:::human
    H5 --> S5["画像・動画の生成"]:::out
  end
  subgraph R6[" "]
    direction LR
    J6["6. 計測タグ<br/>実装と同時"] --> A6["ID を埋める。無ければ空けて未設定と書く。utm を隠し項目に入れる"]
    A6 --> H6["計測 ID を発行する"]:::human
    H6 --> S6["広告の遷移先 LP を作る"]:::out
  end
  subgraph R7[" "]
    direction LR
    J7["7. 検証<br/>納品の前"] --> A7["ファイルの中身とブラウザでの実発火を確かめ、4 区分で書く"]
    A7 --> H7["検証の結果を読む"]:::human
    H7 --> S7["広告の遷移先 LP を作る"]:::out
  end
  subgraph R8[" "]
    direction LR
    J8["8. 公開<br/>検証のあと"] --> A8["—(公開はしない)"]
    A8 --> H8["本番に公開する"]:::human
    H8 --> S8["—"]:::out
  end
  subgraph R9[" "]
    direction LR
    J9["9. A/B テスト<br/>案ができたら"] --> A9["計画シートを書き、件数が届いたら計算で判定する"]
    A9 --> H9["計画シートの確認、勝ち案の反映"]:::human
    H9 --> S9["実験で打ち手を確かめる"]:::out
  end
  subgraph R10[" "]
    direction LR
    J10["10. 既存 LP の監査<br/>見直しのとき"] --> A10["8 観点で採点し、効果 × 手間で並べる(書き換えない)"]
    A10 --> H10["どの改善から試すか"]:::human
    H10 --> S10["LP の改善監査"]:::out
  end
  subgraph R11[" "]
    direction LR
    J11["11. 離脱箇所を読む<br/>テストの合間"] --> A11["6 段階の通過率を流入元 × 端末で並べ、最も減る段を示す"]
    A11 --> H11["直す場所を選ぶ"]:::human
    H11 --> S11["LP の改善監査"]:::out
  end
  R1 --> R2 --> R3 --> R4 --> R5 --> R6 --> R7 --> R8 --> R9 --> R10 --> R11

ステップ 3AI エージェントで回す PDCA

黒い箱は人が決めるところ、オレンジの箱は承認を通るところ。ほかは AI エージェントが進めます。 検証で欠けている項目が残っている案は、公開へ進めません。公開するのは人です。その案を遷移先にした広告の配信も、確認画面で許可してから始めます。
黒い箱は人が決めるところ、オレンジの箱は承認を通るところ。ほかは AI エージェントが進めます。 検証で欠けている項目が残っている案は、公開へ進めません。公開するのは人です。その案を遷移先にした広告の配信も、確認画面で許可してから始めます。

図を原寸で開く

図の元になった mermaid を見る(AI エージェントにそのまま渡せます)
mermaid
flowchart TB
  P["Plan<br/>与件の確認・オファー・設計書"] --> HP["【人】訴求軸とオファーの条件を決める<br/>法規を確認する"]:::human
  HP --> D1["Do<br/>単体 HTML・画像・計測タグ"]
  D1 --> V["検証<br/>ファイルの中身とボタンを押す確認"]
  V -->|"欠けている項目が残る"| D1
  V -->|"欠けが無い"| PS["計画シート<br/>伸ばす数字・判定の条件"]
  PS --> HPS["【人】計画シートを確認する"]:::human
  HPS --> HPUB["【人】本番に公開する"]:::human
  HPUB --> G1("確認画面<br/>案を遷移先にした配信を始める"):::gate
  G1 --> C1["Check<br/>勝ち・負け・まだ分からない<br/>段ごとの通過率・8 観点の採点"]
  C1 --> HC["【人】どの改善から試すか決める"]:::human
  HC --> A1["Act<br/>勝ち案を反映・負け案を記録<br/>次の案は 1 か所だけ変える"]
  A1 -->|"次の案"| D1
  A1 -->|"次の課題"| P
段ごとの分担を表で見る
段AI がやること人が決めることSkill
Plan(計画)前工程の成果物を読み、与件を 1 回で確認する。オファーの型と法規の論点、メッセージマッチの表から始まる設計書を書く訴求軸、オファーの条件と期限、CV の種類。法規の最終確認広告の遷移先 LP を作る/オファー設計/広告コピー
Do(実行)単体の HTML で案を作り、画像を用途で作り分け、計測タグを埋めて 2 段階で検証する。テストの計画シートを書く実在の写真と計測 ID を渡す。計画シートを確認し、本番に公開する。配信の開始を確認画面で許可する広告の遷移先 LP を作る/画像・動画の生成/実験で打ち手を確かめる
Check(確認)案ごとの成果が決めた件数に届いたら計算で判定する。6 段階の通過率を流入元 × 端末で並べ、既存の LP は 8 観点で採点する結果を読み、どの改善から試すかを決める実験で打ち手を確かめる/LP の改善監査
Act(改善)勝った案を型として記録し、負けた案も消さずに残す。次の案は元の案を複製し、1 か所だけ書き換えて作る勝ち案を本番に反映する広告の遷移先 LP を作る/実験で打ち手を確かめる

ステップ 4Skill の構成

入口の Skill が依頼を受けて、工程ごとの Skill へ振り分けます。矢印の文字は振り分ける条件。 「LP を改善して」と頼んだのに作る Skill が動くと、今のページを調べないまま新しい LP を作り始めます。作る Skill と監査の Skill を分け、どちらを使う依頼なのかを説明文に書いておきます。
入口の Skill が依頼を受けて、工程ごとの Skill へ振り分けます。矢印の文字は振り分ける条件。 「LP を改善して」と頼んだのに作る Skill が動くと、今のページを調べないまま新しい LP を作り始めます。作る Skill と監査の Skill を分け、どちらを使う依頼なのかを説明文に書いておきます。

図を原寸で開く

図の元になった mermaid を見る(AI エージェントにそのまま渡せます)
mermaid
flowchart TB
  REQ["依頼"]:::out -->|"LP を作って・案を作って"| LPB["広告の遷移先 LP を作る<br/>入口"]
  REQ -->|"LP を改善して"| CRO["LP の改善監査<br/>ページは書き換えない"]
  LPB -->|"前工程の成果物を読む"| OF["オファー設計"]
  LPB -->|"前工程の成果物を読む"| CP["広告コピー"]
  LPB -->|"背景・装飾・図解"| IMG["画像・動画の生成"]
  LPB -->|"構成の研究だけ"| CLONE["参考サイトの複製<br/>試作まで・公開しない"]:::out
  LPB -->|"納品可の案"| PUB["【人】本番に公開する"]:::human
  PUB --> G("確認画面<br/>配信を始める"):::gate
  G --> EXP["実験で打ち手を確かめる"]
  CRO -->|"試す案の順番"| EXP
  EXP -->|"勝ち案から次の案"| LPB
  • 入口広告の遷移先 LP を作る

    設計書 → 単体 HTML → 画像 → 計測タグ → 検証の順で作る(公開と既存ページの改善はしない)

    中身を見る

    入力

    • 前工程の成果物(競合分析・台本・ブランドの整理)
    • CV の種類・流入元の広告・オファー
    • 使える素材・計測 ID・案の数

    手順

    1. 前工程の成果物を先に読み、与件は 1 回だけ確認する。答えが得られなければ推定で埋め、「確認事項(推定)」に並べる
    2. HTML より先に設計書を書く(メッセージマッチ表・構成・ボタンの位置・フォーム項目と削った理由・離脱しそうな場所)
    3. 単体の HTML で作る。差し替え箇所をコメントで囲み、CV の発火を 1 つの関数に集める
    4. 画像は用途で作り分ける。実在の店舗・スタッフ・料理は提供された素材だけを使う
    5. 計測タグは ID があれば埋める。無ければダミーを入れず、納品書類の冒頭に「計測未設定」と書く
    6. ファイルの中身の確認と、ブラウザでボタンを押して計測が送られるかの確認を行う

    返すもの

    • 設計書
    • 案ごとの HTML
    • 納品書類(計測の状態・生成画像の有無・確認事項)

    守ること

    • 検証の各項目を 4 区分で書き、欠けている項目が残るものを「完成」と書かない
    • ブラウザが使えなければ「実発火は未確認」と書く
    • 素材が無い区画は、待たずに構成を変えて吸収し、足りない素材を一覧にして返す
  • LP の改善監査

    既存の LP を 8 観点で採点し、直す順番を出す(ページは書き換えない)

    中身を見る

    入力

    • LP の URL
    • 流入元と、広告の最初の一言
    • 直近の訪問数と申し込み数

    手順

    1. 流入元と関心度を確かめる(適切な長さが変わる)
    2. 8 観点で採点する(ファーストビュー・メッセージの一致・証拠・オファー・フォーム・導線・表示速度・スマホ表示)
    3. 直す順番を効果 × 手間で並べ、上位 3 つに絞る
    4. CV が少ないページは、手前の行動(スクロール・フォームへの着手)で判定する

    返すもの

    • 観点ごとの点数と根拠の表
    • 効果 × 手間で並べた改善案

    守ること

    • 点数の根拠は実数に紐づける(「ボタンが 3 画面目に 1 つ」)
    • ページを開けなかった観点は「不明」と書く
    • 計測が入っていないページは、評価の前に計測を入れる提案を出す
    • 例文の口コミを作らない
  • 実験で打ち手を確かめる

    判定の基準を先に書き、案を同じ条件で比べて勝ち・負け・まだ分からないを決める

    中身を見る

    入力

    • 伸ばす数字
    • 段ごとの通過率
    • 過去に勝った案と負けた案の一覧

    手順

    1. 伸ばす数字を 1 つ決める
    2. 人が離れている段階を 1 つ選ぶ
    3. 案に順番を付ける(効果の大きさ・効きそうな確かさ・やりやすさ)
    4. 計画シートを書き、一度止まって人の確認を取る。1 つの案で変えるのは 1 か所
    5. 公開後の実際の数字で、計算で判定する
    6. 勝った案も負けた案も記録に残す

    返すもの

    • 計画シート
    • 判定と記録

    守ること

    • 判定の基準は始めたあとに変えない
    • 測れていない数字は「未取得」と書き、0 で埋めない
    • LP は同じ期間・同じ金額・同じクリエイティブで比べ、どちらかの成果が 50 件に満たないうちは決めない
  • 画像・動画の生成

    画像の作り方を 1 か所にまとめ、来歴を画像と一緒に保存する

    中身を見る

    入力

    • 用途(写真らしさ・図解・文字が主役)
    • 設計仕様(JSON)

    手順

    1. 用途を見て経路を選ぶ
    2. 散文ではなく設計仕様を渡す
    3. 何をどのモデルに投げたかを同じ場所に保存する
    4. 直すときは作り直さず、元の画像を渡して編集させる

    返すもの

    • 画像
    • 来歴のファイル(サイドカー)

    守ること

    • 実写が要る場面を生成画像で埋めない
    • 失敗したらファイルを書かない
    • 生成の鍵が無ければ HTML で組んで画像にする
  • オファー設計

    特典・体験・保証・限定・価格の見せ方を、コピーより先に決める

    中身を見る

    入力

    • 買わない理由
    • 粗利と LTV(分からなければ仮の値)

    手順

    1. 買わない理由を 1 つに特定する
    2. 障壁に合う型を選ぶ
    3. 提供コストと条件を数字で書く(誰が・いくらで・いつまで)
    4. 法規を確かめる(二重価格・打消し表示・景品の上限・業種の規制)
    5. 何を見て良し悪しを決めるかを先に書く

    返すもの

    • オファーの設計書(法規チェックとクライアントへの確認事項の欄つき)

    守ること

    • 実施しない割引を表示しない
    • 販売実績の無い「通常価格」を作らない
    • 「適法です」と断定しない。最終の確認は人が行う
  • 広告コピー

    訴求軸 × 型でコピーを量産し、バナーと LP の 1 行目をつなぐ

    中身を見る

    入力

    • ペルソナ
    • オファー
    • 与件の訴求軸

    手順

    1. ペルソナを 1 人に確定する
    2. うれしさを 10 個書き出す
    3. 訴求軸の候補を 3〜5 本にする。与件に無ければ候補を出したところで止まって聞く
    4. 型ごとに 2〜3 案。意外性のある案を 1 つ入れる
    5. バナーと LP の 1 行目がつながっているかを確かめる

    返すもの

    • 訴求軸 × 型の表

    守ること

    • 効果の保証と最上級の表現を使わない
    • 数字は与件にある実数だけ
    • LP の本文は書かない

段ごとに読む数字

直す場所は、人がいちばん減っている段の 1 つ手前です。それを見つけるために、ページを開いてから申し込むまでを 6 段に分け、通過率を流入元ごと・スマホと PC ごとに並べます。イベント名は LP をまたいで固定し、どのイベントにも案の ID(variant)を付けます。

段計測イベント目安(教科書の著者が使っているもの)
ページを開いたページ表示—
ファーストビューの下まで進んだsection_view(section = fv_below)検索広告 80〜90%/サイト訪問者への再表示広告 60〜80%/年齢・性別などで絞った配信 30〜50%/絞り込まない配信 20〜30%
ボタンまで届いたsection_view(section = cta_bottom)—
ボタンを押したcta_click(position)ボタンまで届いた人の 5〜15%
フォームに入力し始めたform_start—
申し込んだ最終 CV(キーイベントに登録)—

媒体が数える CV と LP で数えた CV は、突き合わせも足し算もしません。 数え方が違うので、横に並べて出すだけです。直近 2 日の数字はまだ確定していないため、判断には使いません。人数が少なくて伏せられた行は、0 ではなく「未取得」と書きます。

このページは、コラム『マーケティングエンジニアの教科書』の 第 2 章「AI Agent の使いこなし方」・第 3 章「戦略設計を自動化する」・第 4 章「クリエイティブ作成を自動化する」 をもとにまとめたものです。