【2026年】AIでLP制作するおすすめツール10選と手順

｜広告運用ノウハウ公開中！

より詳しく知りたい方は資料をダウンロード！

AIでLPを作ってみたいけれど、ツールが多すぎてどれを使えばいいか分からない。ChatGPTで文章は作れたものの、デザインや公開、広告の配信までどう進めればいいのか迷っていませんか。

Web広告の成果を上げるには、LPの検証と改善を速く回すことが大切です。そこで広がっているのが、AIツールを使ったLPの内製化です。文章の生成や、指示文からのデザイン・コードの生成を使えば、外部の制作会社に頼らず、自社でLPのたたき台を作れます。

この記事では、AIを使ったLP制作に使えるツール10選を、2026年10月時点の各公式サイトの情報で比べ、無料で使える範囲、ABテストへの対応、自社に合うツールの選び方、制作の5ステップ、失敗しないためのポイントまで解説します。

1. AIでLP制作を行う3つのメリット

AIを使ってLP（ランディングページ）を作るメリットは、広告の成果を出すために大切な「スピード」と「費用」を両立しやすいことです。

制作のハードルが下がれば、浮いた予算を広告費に回したり、新しい訴求をすぐに試したりできるようになります。具体的なメリットを見ていきましょう。

1-1. 制作時間とコストを抑えられる

外注でLPを作る場合、企画・デザイン・コーディング・修正のやり取りが発生し、そのぶん費用と時間がかかります。LP制作の費用と期間の目安は、LP制作の期間は？費用と工程別のスケジュールを解説で詳しく解説しています。

AIツールを使えば、構成案・キャッチコピー・デザインのたたき台を、指示文（プロンプト）から短時間で作れます。たとえば、AIにターゲットと訴求したいポイントを伝えるだけで、キャッチコピーや本文、CTA（申し込みボタン）の配置まで提案してくれるツールもあります。修正もツール上で指示するだけで反映できるため、外注先とのやり取りにかかっていた時間も減らせます。

1-2. デザインやコーディングの専門知識がなくても作れる

従来のLP制作では、次のような知識が必要でした。そのため、マーケティング担当者がひとりで対応するのは難しく、外注や社内エンジニアへの依頼が欠かせませんでした。

• ワイヤーフレームの設計：デザインの基礎知識
• レスポンシブ対応やフォームの実装：HTML・CSS・JavaScriptの知識

AIを搭載したツールなら、テンプレートの選択や文章での指示だけで、見栄えの整ったLPのたたき台ができます。指示文からHTMLやCSSのコードを生成できるツールもあるため、コーディングの知識がなくても、自分でLPを形にして直していけます。

ただし、AIが作ったものをそのまま公開してよいわけではありません。仕上げの確認は人が行う必要があります（第2章・第7章）。

1-3. 複数パターンのLPを短時間で用意できる

AIツールを使えば、訴求軸やデザインが違う複数のLPを短時間で作れます。

広告の成果を高めるには、ページを訪れる人の悩みやニーズに内容が合っているかを確かめる「ABテスト」が欠かせません。しかし、制作会社に依頼する方法では、1パターン増やすごとに作業時間と費用がかかるため、多くのバリエーションを用意するのは難しいものでした。

AIツールなら、基本となるページを1つ作れば、キャッチコピーや写真、ボタンの文言だけを変えた別パターンをすぐに用意できます。たとえば「安さ」を強調するページと「機能性」を強調するページを用意し、どちらがより申し込まれるかを確かめられます。

検証のサイクルが速くなれば、集まったデータをもとにページを改良していけます。ABテストで成果を出した進め方は、ABテストの成功事例6選｜検証スピードを高める進め方・注意点も解説で紹介しています。

2. AIでLP制作を行う3つのデメリット

AIによるLP制作はメリットが多い一方で、導入前に知っておくべきデメリットもあります。

AIツールに任せきりにすると、デザインの独自性やブランドイメージの再現、生成された内容の正確さに課題が出ることがあります。デメリットを先に理解しておけば、AIに任せる場面と人の手を加える場面を分けられ、LP制作の失敗を防げます。

2-1. ありきたりなデザインになりやすい

AIで作るLPは、他社と似たデザインになりやすいという特徴があります。

多くのAIツールは、用意された型を組み合わせてページを作るため、似た雰囲気になりがちです。同じ業界の競合が同じAIツールを使っていると、訪れた人に「どこかで見たことがある」という印象を与えてしまいます。印象に残らないページは、購入や申し込みをためらわせる原因にもなります。

対策として、AIが作った土台に自社で撮影した写真を使ったり、色味を調整したりして、独自性を取り入れましょう。AIの効率の良さを活かしつつ、仕上げにひと手間を加えることが、選ばれるページにするためのポイントです。

2-2. ブランドの世界観を再現しにくい

自社ブランドが持つ独特な雰囲気やこだわりを、AIだけで再現するのは難しい場合があります。

ブランドの世界観は、色の選び方だけでなく、言葉のニュアンスや余白の取り方といった細かい部分の積み重ねでできています。AIは一般的なルールに沿ってページを作るのは得意ですが、ブランドごとの細かなこだわりまでは理解しきれません。

そのまま公開すると、過去の広告や自社サイトと雰囲気が変わってしまい、ブランドの印象を損ねる恐れがあります。制作の手間はAIで減らし、ブランドの品質は人の目で守る、という役割分担が大切です。なお、Claude Designのように、自社のデザインシステム（色・フォント・部品）を読み込ませて作れるツールもあります（第3章）。

2-3. 生成された情報・コードの正確性チェックが必要

AIが作った文章やプログラムのコードには、間違いが含まれていることがあるため、公開前の確認が欠かせません。

AIは、事実と異なる情報をもっともらしく出力することがあります（ハルシネーションと呼ばれます）。LPに載せる商品のスペックや料金、導入実績の数字に誤りがあれば、ユーザーの信頼を失うだけでなく、景品表示法に触れる恐れもあります。景品表示法は、商品の品質などを実際より著しく良く見せる表示（優良誤認表示）や、価格などの取引条件を実際より著しく有利に見せる表示（有利誤認表示）を禁止しています（出典：優良誤認とは｜消費者庁／有利誤認とは｜消費者庁）。

また、AIが生成したHTML・CSSのコードにも注意が必要です。特定のブラウザやスマートフォンで表示が崩れる、フォームの送信が正しく動かない、といった不具合が出ることがあります。

AIを信じすぎず、最後は必ず人の目で、内容と動作に問題がないかを確かめましょう。

3. LP制作に使えるAIツールおすすめ10選

ここでは、施策を素早く実行したいマーケティング担当者に向けて、LP制作に使えるAIツールを10個選びました。料金・機能は2026年10月時点の情報で、10月21日に各公式サイトで確認しています。最新の情報は各公式サイトでご確認ください。

まずは早見表で、得意なこと・無料で使える範囲・作ったページを公開できるか・ABテストに対応しているかを比べます。

ツール	得意なこと	無料で使える範囲	作ったページの公開	ABテスト
Squad beyond	LPの制作・ABテスト・効果測定	有料	○ 配信URLで公開	○ Versionの配信割合で出し分け
ChatGPT	構成・コピー、Sitesでのサイト作成	無料版あり（Sitesは対象外）	○ Sites（Plus・Pro・Business・Enterprise）	—
Claude	コード生成、Claude Designでのデザイン	Freeプランあり（Claude Designも対象）	HTMLの書き出し・他ツールへの送信	—
Gemini	Canvasでのウェブページ作成	無料プランあり（Canvasも対象）	共有リンク（gemini.google.com上）	—
v0	指示からUIとコードを生成	Freeプランあり（1日7メッセージまで）	○ Vercelにデプロイ	—
Figma Make	Figmaのデザインからサイト・アプリを生成	有料プランのフルシートが対象（他のシートでも試用可）	○ 専用URL・独自ドメイン	—
Canva（Canvaコード）	ランディングページなどの作成	無料版あり（AIの利用枠はプランで異なる）	○ Webサイトとして公開	—
Jimdo AIビルダー	ホームページの作成	無料プランあり	○	—
HubSpot	LP作成とマーケティング機能	無料ツールで公開できる（AIでの生成はContent Hub Professional以上）	○	○ Content Hub Professional以上
Unicorn Platform	英語のAIサイトビルダー	無料プランは公開できるサイト数が0	有料プランで公開	—

「—」は、公式サイト・公式ヘルプでABテスト機能の記載を確認できなかったものです。各ツールの出典は、このあとの各項目に記載しています。

文章を作るAI、デザインとコードを作るAI、AIを搭載したサイト作成サービスは、どれも「LPを作る」ところまでを助けてくれます。一方、公開したあとにどのLPが成果を出しているかを比べる機能は、ツールによって差があります。広告のLPとして使うなら、公開後の検証まで見据えて選ぶことが大切です。

3-1. 【LP制作から検証まで】Squad beyond

Squad beyondは、LPの制作からABテスト、広告の効果測定までを1つで行える、マーケター向けのツールです。文章や画像を一から生成するAIではありませんが、ChatGPTやClaudeなどのAIと組み合わせて使えます。

LPは、Version編集画面の［Widget管理］から、カテゴリーや検索で部品（Widget）を選んで追加して組み立てます（出典：Widgetの使い方｜Squad beyond FAQ）。業種別のサンプルLP（Widgetレシピ）も公開されています（出典：BtoB商材(リード獲得)｜Squad beyond FAQ）。AIで書いたHTMLを使う場合は、HTMLエディターのHTML欄に貼り付けて実装できます（出典：今あるLPをSquad beyondに実装する（HTMLエディター編）｜Squad beyond FAQ）。

AIとの連携には、ChatGPTやClaudeなどのAIツールとSquad beyondを接続する「Squad beyond MCP」があります。AIへの指示で、レポートの取得や分析、HTMLのアップロード、配信割合の変更などができます。料金は利用しているプランによって異なります（出典：Squad beyond MCPについて｜Squad beyond FAQ）。2026年5月には「Squad beyond AI」がリリースされ、記事の作成・HTMLのアップロード・配信割合の変更・配信までを指示で実行できるようになりました（出典：2026/05_リリース情報｜Squad beyond FAQ）。

作ったLPは、複数のVersionとして用意し、同じ配信URLのまま配信割合を決めて出し分けられます。レポートの結果に合わせて、割合を増減できます（出典：Versionの配信割合について｜Squad beyond FAQ）。Versionと広告クリエイティブの組み合わせごとの成果も比べられます（出典：Branch Operation機能について｜Squad beyond FAQ）。

AIでLPをたくさん作れるようになったあと、どれが成果を出しているかを確かめて改善したい方に向いています。具体的な進め方は第6章で解説します。

3-2. 【無料から使える】ChatGPT

画像参照元：ChatGPT

ChatGPTは、OpenAIが提供する対話型AIです。無料版があり、有料プランは個人向けのGo・Plus・Pro、法人向けのBusiness・Enterpriseがあります（出典：プランと料金｜ChatGPT）。

LP制作では、キャッチコピーや本文のライティング、構成案の作成など、文章まわりの作業を効率化できます。「このサービスのターゲットは〇〇で、訴求したいのは△△です」と具体的に指示すれば、見出しやコピーの案を出してくれます。ペルソナの設定やベネフィットの整理など、LP設計の上流工程にも使えます。

2026年10月時点では、ChatGPTに「ウェブサイトを作って」と依頼し、作りたいものを説明すると、ウェブサイトを作成・プレビューして公開できる「ChatGPT Sites」も使えます。対象はChatGPT Plus・Proのアカウントと、対応するBusiness・Enterpriseのワークスペースで、サイトの作成・編集はCodexの使用量にカウントされます（出典：ChatGPT Sites の作成と利用｜OpenAI Help Center）。無料版やGoでは、Sitesは使えません。

3-3. 【コード生成・デザイン】Claude

画像参照元：Claude

Claudeは、Anthropicが開発した対話型AIです。Free・Pro・Max・Team・Enterpriseのプランがあり、生成したコードやページをチャットの横で確認できる「Artifacts」は、全プランで使えます（出典：Plans & Pricing｜Claude）。

LP制作では、HTMLやCSSのコードを文章で指示して生成できるため、コーディングの知識がなくても、LPを形にして修正していけます。「ボタンの色を変えたい」「セクションを追加したい」といった修正も、画面を見ながら依頼できます。既存のLPの文章を貼り付けて、構成やコピーの改善案を出してもらう使い方もできます。

2026年4月には、チャットでデザインやインタラクティブなプロトタイプを作れる「Claude Design」が発表され、マーケターがランディングページやSNS用の素材を作れると紹介されています（出典：Introducing Claude Design by Anthropic Labs｜Anthropic）。2026年10月時点では、Claude DesignはFree・Pro・Max・Team・Enterpriseの各プランで使えます。自社のデザインシステム（色・フォント・部品）を読み込ませて作れるほか、スタンドアロンのHTMLやPDFでの書き出し、CanvaやHubSpot、Wix、Vercelなどへの送信にも対応しています。なお、単独版（claude.ai/design）は2026年12月14日に終了し、チャットの中で使う形に移ります（出典：Get started with Claude Design｜Claude Help Center）。

3-4. 【Googleのツールと連携】Gemini

Geminiは、Googleが提供するAIアシスタントです。Geminiアプリの「Canvas」では、ドキュメント・アプリ・スライド・コードを作成・編集でき、作成したドキュメントからウェブページを作ることもできます。ファイルや画像をアップロードして指示することもできます（出典：Canvas でドキュメントやアプリなどを作成する｜Gemini アプリ ヘルプ）。Canvasは、無料プラン（Googleアカウントをお持ちの方は月額0円）でも使えます（出典：Gemini のプラン｜Google）。

商品資料や企画書をもとに、LPのたたき台を作る使い方に向いています。ただし、Canvasの共有リンクはgemini.google.com上で開く形です。広告の遷移先として使うには、コードをコピーして、自社のサーバーやLP制作ツールに移す必要があります。

3-5. 【UI自動生成】v0

画像参照元：v0

v0は、Vercelが提供するAIエージェントで、指示文からコードとアプリを作れます。公式ドキュメントでは、作れるものの例にランディングページが挙げられ、ワイヤーフレームやモックアップからUIを作ったり、スクリーンショットやFigmaのファイルからページを再現したりできると説明されています。使われる技術はNext.js・Tailwind・shadcn/uiなどで、作ったものはワンクリックでVercelにデプロイ（公開）できます（出典：v0 Docs｜v0）。

生成されたデザインは、追加の指示で修正できます。たとえば「ヘッダーをシンプルにして」「CTAボタンを目立たせて」と伝えるだけで、デザインを調整できます。

料金は、Freeプラン（月額0ドル・1日7メッセージまで）と、有料のPlus・Business・Enterpriseがあります（出典：Plans and Pricing｜v0）。

3-6. 【デザイン特化】Figma Make

画像参照元：Figma Make

Figma Makeは、デザインツールのFigmaが提供する、AIを使って指示文からアプリやサイトを作る機能です。既存のFigmaのデザインや画像を添付して指示でき、Figma Designと同じ感覚のプロパティパネルや描画ツールで修正できます。生成されたコードはFilesタブで確認・編集できます。できあがったものは、Figmaが用意する専用URLのWebサイトとして、組織内または一般に公開でき、自社のドメインを割り当てることもできます（出典：Explore Figma Make｜Figma Learn）。

利用できるのは有料プランのフルシートで、それ以外のシートやプランでも試すことはできます（出典：同上）。すでにFigmaでデザインを作っているチームが、デザインを動くLPにするときに向いています。

3-7. 【デザインツールから公開まで】Canva（Canvaコード）

Canvaでは、「Canvaコード」を使って、ランディングページやダッシュボードなどのインタラクティブなデザインを作り、Canvaエディターで編集して、レスポンシブなWebサイトとして公開できます。Canvaのホームページで［コード］を選び、Canva AIのタブで作りたいデザインを説明して作成します。生成されたコードは表示してコピーできますが、ファイルとして書き出すことはできません（出典：Canva Codeでインタラクティブなデザインを作成する｜Canvaヘルプセンター）。

Canvaには無料版があり、AI機能の利用枠はプランによって異なります（出典：Canvaの料金プラン｜Canva）。バナーやSNS画像をCanvaで作っているチームなら、同じ素材を使ってLPまで作れます。広告運用で使うときの注意点は、CanvaでLPは作れる？作り方と広告運用での限界で解説しています。

3-8. 【初心者向け】Jimdo AIビルダー

画像参照元：Jimdo AIビルダー

ジンドゥー AIビルダーは、プログラミングやデザインの専門知識がなくても、AIでホームページを作れるサービスです。作成したページは、閲覧する端末の画面サイズに合わせて表示が自動で変わります。無料プランに加えて有料プランが2つあり、独自ドメインも使えます。KDDIグループが運用するサポート窓口があるのも特徴です（出典：ジンドゥー AIビルダー｜Jimdo）。

デザインや開発の知識がなく、まずは費用をかけずにページ作りを試したい方にとって、始めやすい選択肢の一つです。

3-9. 【マーケティング機能充実】HubSpot

画像参照元：HubSpot

HubSpotは、LP作成とCRM（顧客管理）、MA（マーケティングオートメーション）などをまとめて扱える、マーケティング担当者向けのプラットフォームです。

LP作成では、ページの目的・ターゲット・主要なコンテンツ・トーンなどを入力すると、AI（Breeze）がコピー、画像、フォーム、ミーティングリンクなどのコンテンツ案を生成します。AIでのページ生成には、Content Hub ProfessionalまたはEnterpriseの契約が必要です。HubSpotの無料ツールでも、HubSpotのドメインでページを公開できます（出典：ページを作成し、カスタマイズする｜HubSpotナレッジベース）。

公開したページは、同じURLのまま2つの版を訪問者に半分ずつ表示するABテストができます。ABテストもContent Hub ProfessionalまたはEnterpriseが対象です（出典：Run an A/B test on a page｜HubSpot Knowledge Base）。

3-10. 【英語のAIサイトビルダー】Unicorn Platform

画像参照元：Unicorn Platform

Unicorn Platformは、デザインや開発のスキルがなくても、SaaSやアプリなどのWebサイトを作れるAIのWebサイトビルダーです。指示文でサイトを作ったり変更したりでき、Stripeでの決済にも対応しています（出典：Unicorn Platform）。

無料プラン（Lurker）がありますが、公開できるWebサイト数は0です。サイトを公開するには有料プランが必要です（出典：Pricing｜Unicorn Platform）。画面とサポートは英語なので、英語に慣れている方向けです。

4. 自社に合ったAIツールを選ぶための3つのポイント

自社に合うAIツールを見つけるには、ツールの特徴が自社の状況に合っているかを確かめることが大切です。

ツールによって得意なことや操作のしやすさが違うため、なんとなく選ぶと「使いこなせない」「余計な手間がかかる」といった失敗につながります。目的やスキルに合ったものを選べば、LP制作の効率が上がり、本来やりたかった施策に集中できます。

4-1. 目的で選ぶ

まず決めるべきなのは、「AIツールを使って、LP制作のどの工程を効率化したいのか」という目的です。

LP制作には、コピーライティング、デザイン、コーディング、公開、ABテストの運用など複数の工程があり、AIツールによって得意な工程が違います。文章を作るのが苦手なら、ChatGPTやClaude、Geminiのような文章生成が得意なツールが合います。デザインやコードまでAIに作らせたいなら、v0やFigma Make、Claude Design、Canvaコードのような、指示文からページを生成するツールが向いています。

すでにLPがあり、改善が目的なら、ヒートマップやABテストの機能を備えたツールが必要です。第3章の早見表のとおり、AIでページを作れるツールでも、ABテストに対応しているものは限られます。

目的があいまいなまま導入すると、使わない機能に費用を払い続けることになりかねません。「どの工程を、どこまでAIに任せたいのか」を社内で整理してから選びましょう。

4-2. スキルレベルで選ぶ

実際に操作するメンバーのスキルに合わせることが、無理なく運用を続けるコツです。

AIツールの操作性は、文章での指示だけで完結するものから、HTMLやCSSの知識があるとカスタマイズの幅が広がるものまでさまざまです。デザインやコーディングの経験がない担当者が使うなら、テンプレートの選択と文章の入力でページができるツールを選ぶとよいでしょう。画面やサポートが日本語に対応しているかも、使いやすさを左右します。

反対に、社内にデザイナーやエンジニアがいて、AIをアシスタントとして使いたいなら、コードを確認・編集できるツールやデザインを細かく調整できるツールのほうが満足度は高くなります。

導入後に「操作が難しくて使われなくなった」というミスマッチを避けるためにも、無料プランや試用を使って、実際に運用するメンバーが使いこなせるかを事前に確かめておきましょう。

4-3. 予算で選ぶ

AIツールの料金体系はツールごとに大きく違うため、自社の予算と照らし合わせて見極めることが大切です。

無料で使えるツールもありますが、無料プランでは公開できない、独自ドメインが使えない、AIを使える回数に上限がある、といった制限があるのが一般的です。たとえばUnicorn Platformの無料プランは公開できるサイト数が0で、v0のFreeプランは1日7メッセージまでです。比べるときは、月額料金だけでなく、「公開できるか」「独自ドメインが使えるか」「AIを使える回数」「ABテストが使えるプラン」も確かめましょう。

外注と比べるときは、外注費と、ツールの料金に社内で作業する時間を足したものを比べます。ツール代だけで比べると、社内の作業時間が抜けて、実際より安く見えてしまいます。

5. AIツールでLP制作を行う具体的な手順を5ステップで解説

AIツールは、正しい手順で使うことで本来の力を発揮し、広告の成果を高めることにつながります。

ツールを契約するだけでは、売れるページは完成しません。準備から制作、公開後の改善までをAIと分担して進めることで、効率を上げながら質の高いページを運用できるようになります。ここでは、AIツールを初めて使う方でも迷わずLPを作れるように、ステップごとの作業とAIの使い方を解説します。

5-1. ステップ1：ターゲット・ペルソナを詳しく設定する

成果の出るLPを作るために、まずはターゲットとなる顧客像（ペルソナ）を具体的に言葉にすることから始めましょう。

ペルソナがあいまいなまま制作を進めると、誰に向けたメッセージなのかがぼやけ、訪問者に刺さらないLPになってしまいます。年齢・職種・抱えている課題・情報収集の手段・意思決定のプロセスなど、できる限り詳しく描き出すことが大切です。

AIツールは、ペルソナ設定の段階から使えます。文章生成AIに「BtoB向けSaaSの導入を検討している中小企業のマーケティング担当者のペルソナを作成してください」のように具体的に指示すれば、課題や購買行動を含むペルソナ案を出してくれます。

AIが出したペルソナ案をたたき台にし、自社の顧客データやヒアリングの結果と照らし合わせて修正すれば、精度の高いペルソナを短時間でまとめられます。

5-2. ステップ2：LPの構成・コピーをAIで生成する

ペルソナが固まったら、LP全体の構成と各セクションのコピーをAIで作りましょう。

成果が出るLPには、「ファーストビュー→課題提起→解決策の提示→導入メリット→事例・実績→FAQ→CTA」といった定番の構成があります。AIツールにペルソナ情報と商品・サービスの特徴を入力すれば、構成案とセクションごとのキャッチコピー・本文をまとめて作れます。

コピー作成のコツは、AIへの指示（プロンプト）を具体的に書くことです。「LPのコピーを作って」という漠然とした指示では、当たり障りのないコピーしか得られません。誰の・どんな悩みを・どう解決するのか（バリュープロポジション）を先に書き、ターゲット・商品の特徴・表現のスタイルまで明示しましょう。次のような型で指示すると、意図が伝わりやすくなります。

• 目的：【例：無料トライアルの申し込みを増やしたい】
• ターゲット：【例：初めてツールを導入する中小企業のマーケティング担当者】
• ターゲットの悩み：【例：LPの修正を外注していて、改善に時間がかかる】
• 商品が提供する解決：【商品の特徴と、悩みがどう解決するか】
• 使ってよい事実：【料金・実績・機能など、自社の資料にあるものだけ】
• トーン：【例：親しみやすい／専門的】
• ほしいもの：【例：ファーストビューのキャッチコピーを3案、構成案、各セクションの本文】

「使ってよい事実」を渡し、「資料に無い数字は書かない」と指示しておくと、AIがもっともらしい数字を作ってしまうのを防げます。

構成要素や訴求の型を使いこなせるようになったら、記事の形で商品を紹介する「記事LP」も選択肢になります。作り方は、【2026年】記事LPの作成方法とは？売れる記事LPの構成を画像で解説で解説しています。

5-3. ステップ3：デザイン・ワイヤーフレームを作成する

構成とコピーがそろったら、見た目の設計に進みます。

AIツールを使えば、デザインスキルがなくても、見栄えのよいLPのデザインを短時間で作れます。テンプレートをもとにステップ2で用意したコピーを流し込み、自社のロゴやブランドカラー、商品画像に差し替えれば、LPのデザインができあがります。

手描きのラフやワイヤーフレームがある場合は、その画像をAIに渡してデザインに起こす方法もあります。v0はワイヤーフレームやモックアップからUIを作れ（出典：v0 Docs｜v0）、Claude Designは既存デザインのスクリーンショットやワイヤーフレームを参考資料として添付できます（出典：Get started with Claude Design｜Claude Help Center）。Figma Makeも、デザインや画像を添付して指示できます（出典：Explore Figma Make｜Figma Learn）。

デザインで特に意識したいのは、ファーストビューの訴求力とCTAボタンの見つけやすさです。ファーストビューは訪問者が最初に目にする場所なので、ペルソナの課題に刺さるキャッチコピーとメインビジュアルを置きましょう。CTAボタンは背景と対比のある目立つ色を選び、ページ内の複数の場所に置くのが効果的です。

5-4. ステップ4：コードを生成・実装する

デザインが決まったら、LPを実際にWeb上で動くページとして実装します。

実装の方法は、大きく次の2つに分かれます。

	ノーコード型ツールで完結させる	AIでコードを生成して実装する
概要	ノーコード型のLP制作ツール上で、デザインから公開までを完結させる	AIでHTML・CSSのコードを生成し、自社のサーバーやWordPress、LP制作ツールに実装する
代表的なツール	ペライチ、STUDIO、Wix、Jimdoなど	ChatGPT、Claude、Gemini、v0など
特徴	ドラッグ＆ドロップで作ったデザインがそのまま公開できるページになるため、コードを書く作業が要らない	デザインカンプやワイヤーフレームの情報をAIに渡して指示すれば、実装用のコードを出力できる
向いている人	コーディングの知識がなく、手軽にLPを公開したい方	コードを自社の環境に組み込みたい、カスタマイズの自由度を重視したい方

フォームや計測タグ（Googleタグマネージャーなど）の設置コードも、AIに依頼して作れます。ただし、AIが生成したコードはブラウザや端末によって表示が崩れることがあるため、公開前に必ずスマートフォンを含む複数の環境で表示を確かめましょう。

5-5. ステップ5：公開後にABテストと改善を繰り返す

LPを公開したら、まずアクセス解析ツールとヒートマップを設置します。

コンバージョン率・直帰率・スクロールの到達率・クリックされた場所といったデータを集め、LPのどのセクションに課題があるかを客観的に把握しましょう。LPを分析するときに見るべき指標は、LP分析で押さえておくべき5つの指標｜陥りがちな失敗や具体的な分析方法も解説で解説しています。

課題が分かったら、改善の仮説を立ててABテストを行います。たとえば「キャッチコピーを変えるとコンバージョン率が上がるのでは」という仮説があれば、AIでコピーの別パターンを作り、ABテストで成果を比べます。

AIを使えば、テスト用のコピーやデザインのバリエーションを短時間で用意できるため、ABテストを回す回数を増やせます。ただし、ABテストで一度に変える要素は1つにしておくと、何が効いたのかが分かります。

6. AIで作ったLPをSquad beyondで公開・検証する方法

AIでLPを作れるようになると、次に必要になるのが「どのLPが成果を出しているか」を確かめる仕組みです。ここでは、ChatGPTやClaudeなどで作ったLPを、Squad beyondで公開して比べる流れを紹介します。

6-1. AIで作ったHTMLを取り込む

AIで作ったHTMLは、Squad beyondのHTMLエディターのHTML欄に貼り付けて実装できます（出典：今あるLPをSquad beyondに実装する（HTMLエディター編）｜Squad beyond FAQ）。

Squad beyond MCPを設定していれば、AIとの会話の中から取り込むこともできます。公式FAQでは、次のようなプロンプト例が紹介されています（出典：MCPの活用方法について｜Squad beyond FAQ）。

beyondページ{プレビューURLを入れる}にこのHTMLをアップロードして、外部画像も一緒にアップロードして

Squad beyond MCPは、ChatGPT（Plus・Pro・Business・Enterpriseのプラン）やClaude Codeなどで動作が確認されています。料金は利用しているプランによって異なります（出典：Squad beyond MCPについて｜Squad beyond FAQ）。接続の手順は、ClaudeでMCPを設定・接続する方法｜手順と活用例を解説とChatGPTでMCPを設定・接続する方法｜手順と活用例を解説で解説しています。

6-2. 確認用URLでスマートフォンの表示を確かめる

Squad beyondでは、Version編集画面の［プレビュー］から「作成中の確認用URL」を開くと、編集中のページを確認できます。Squad beyondのアカウントを持っていない人もこのURLから確認でき、表示されるQRコードを読み取れば、スマートフォンでも確認できます（出典：プレビューについて｜Squad beyond FAQ）。AIが作ったコードの表示崩れやフォームの動きは、ここで実機を使って確かめます。

6-3. 別案をVersionとして作り、配信割合で出し分ける

訴求を変えた別案は、Versionを複製して作ります（出典：Versionを複製する｜Squad beyond FAQ）。複数のVersionは、同じ配信URLのまま配信割合を決めて出し分けられ、レポートの結果に合わせて割合を増減できます（出典：Versionの配信割合について｜Squad beyond FAQ）。

配信割合の変更も、MCPから指示できます。公式FAQのプロンプト例は「beyondページ{プレビューURLを入れる}の配信割合を50に変更して」です（出典：MCPの活用方法について｜Squad beyond FAQ）。

6-4. レポートで比べて、勝った案を残す

Squad beyondのレポートでは、日ごとの数値や、Versionと広告クリエイティブの組み合わせごとの成果を確認できます（出典：レポートの種類｜Squad beyond FAQ）。MCPを使えば、AIへの指示で日別のレポートを取得したり、ページごとのCVRや離脱の状況を分析して改善が必要な箇所を探したりもできます（出典：Squad beyond MCPについて｜Squad beyond FAQ）。

AIで案を作り、Squad beyondで出し分けて比べ、勝った案をもとに次の案をAIで作る。この流れを回すことで、AIで作ったLPを成果につなげていけます。

7. AIでのLP制作で失敗しないためのポイント

AIツールを使ったLP制作で成果を出すには、ツール任せにせず、運用面でいくつかの注意点を押さえておく必要があります。

事前準備の不足やAIへの指示のあいまいさ、セキュリティへの配慮不足は、LPの品質の低下や情報漏洩といったトラブルにつながりかねません。ここでは、AIでのLP制作を安全かつ効果的に進めるための4つのポイントを解説します。

7-1. ブランドガイドラインを事前に整理する

AIツールにLP制作を任せる前に、自社のブランドガイドラインを整理し、言葉にしておくことが大切です。

ブランドの基準がはっきりしていないと、AIが意図しないものを出しても直す判断がつかず、手戻りが増えます。ガイドラインが明文化されていないままLPを作ると、既存のWebサイトや広告クリエイティブと統一感が取れず、ブランドイメージがちぐはぐになる恐れがあります。

事前に整理しておくべき項目は次のとおりです。

• メインカラー・サブカラーのカラーコード
• 使用するフォント名
• ロゴの配置ルール（サイズ・余白・背景色の制約など）
• 文章で使う一人称（「当社」「弊社」「私たち」など）
• 避けるべき表現の一覧

ガイドラインがすでにある場合は、AIツールへの入力用に要点をまとめ、無い場合はLP制作を機に最低限のルールを決めておきましょう。

7-2. AIへの指示は【ターゲット・目的・トーン】まで具体的に書く

AIから質の高いものを引き出すには、指示（プロンプト）にターゲット・目的・トーンの3つを盛り込むことが大切です。

AIは、与えられた情報の範囲でしか内容を作れないため、指示があいまいだと精度も下がります。「30代の中小企業経営者向けに、クラウド会計ソフトの無料トライアル申し込みを目的としたファーストビューのコピーを3パターン作成」のように、具体的な条件を盛り込むほど使える結果が得られます。

プロンプトに含めると効果的な情報は次のとおりです。

• ペルソナの属性と課題
• LPのゴール（資料請求・申し込み・問い合わせなど）
• 文章のトーン（親しみやすい・専門的・高級感など）
• 文字数の目安
• 参考にしたい競合LPのURL

生成結果を見ながら指示を足したり直したりする「対話型」の進め方をとると、効率よく理想に近づけます。

LPができたら、次は成果を伸ばすためのCVR改善に取り組みましょう。心理・導線・検証の観点で改善ポイントを整理したCVR改善の基本：心理・導線・検証を一つずつ整えるも参考にしてください。

7-3. 機密情報・個人情報はAIに入力しない

AIツールを使うときは、自社の機密情報や顧客の個人情報を入力しないよう徹底しましょう。

AIツールによっては、入力した内容がモデルの学習に使われることがあります。たとえばChatGPTの料金ページでは、コンテンツをモデルの学習に使うかどうかを「無効化可能」と案内しています（出典：プランと料金｜ChatGPT）。v0は、Businessプラン以上で学習への利用をはじめから無効にしています（出典：Plans and Pricing｜v0）。設定やプランによって扱いが違うため、使う前に必ず確かめてください。

個人情報保護委員会も、生成AIサービスの利用について注意喚起を出しています（出典：生成AIサービスの利用に関する注意喚起等について｜個人情報保護委員会）。LP制作でAIに入力する情報は、公開済みの商品・サービスの情報や一般的な業界の情報に限るのが安全です。

あわせて、社内で「入力してよい情報」と「入力してはいけない情報」の線引きを明文化し、チーム全員に共有しておくことで、意図しない情報漏洩を防げます。

7-4. 最終チェックは必ず人が行う

AIが作ったLPの構成・コピー・デザイン・コードは、公開前に必ず人の目で最終確認しましょう。

AIの生成物をそのまま公開すると、誤った情報や不適切な表現があった場合に、ユーザーの信頼を損ねたり、法令違反につながったりする恐れがあります。

最終チェックで確かめるべき項目は次のとおりです。

• 商品・サービスのスペックや価格情報の正確さ
• 誇大表現や法令違反にあたる文言の有無
• 誤字脱字・文法の不自然さ
• CTAボタンやフォームの動作
• スマートフォン・タブレットでの表示崩れ
• ページの読み込み速度

景品表示法の優良誤認・有利誤認にあたる表現や、ブランドのトーンから外れた文言をAIが出力することもあります（第2章）。法的なリスクが心配な表現は、法務担当や外部の専門家に確認しましょう。

8. AIでのLP制作でよくある失敗3つ

AIでLPを作るときに起こりやすい失敗を3つ、症状・原因・対策・回避策の順に整理します。

8-1. AIが出した数字や実績をそのまま載せる

• 症状：AIが書いた「満足度」「導入社数」などの数字をそのまま載せると、根拠を聞かれたときに示せない表示になる
• 原因：AIは、事実と異なる情報をもっともらしく出力することがある
• 対策：数字・実績・料金・効果の表現は、すべて自社の資料と突き合わせ、根拠を示せないものは消す
• 回避策：プロンプトで「使ってよい事実」を渡し、「資料に無い数字は書かない」と指示しておく（ステップ2の型）

8-2. 1案だけ作って公開する

• 症状：AIで作ったLPを1案だけ公開すると、成果が出なかったときに、どこを直せばいいのか分からないままになる
• 原因：AIの強みである「別案を短時間で作れる」ことを使わず、比べる仕組みを用意していない
• 対策：訴求を変えた別案を作り、同じURLのまま出し分けて成果を比べる
• 回避策：公開前に、何を比べるか（キャッチコピーなど1つの要素）と、出し分けの方法を決めておく

8-3. AIが書いたコードをそのまま公開する

• 症状：AIが書いたHTMLをそのまま公開すると、スマートフォンで表示が崩れたり、フォームが送信できなかったりする
• 原因：生成されたコードは、すべてのブラウザや端末での表示・動作を確かめたものではない
• 対策：公開前に、スマートフォンの実機で表示とフォームの送信を確かめる
• 回避策：AIへの指示に「スマートフォンで崩れないレスポンシブなレイアウト」と入れ、確認用URLで実機を見てから公開する

9. AIでLPを制作する際によくある質問（FAQ）

10. まとめ｜AIを活用してLP制作のスピードとコストを改善しよう

AIを活用すれば、LP制作にかかる時間や費用を抑え、デザインやコーディングの専門知識がなくても、施策をスピーディーに実行できるようになります。2026年10月時点では、ChatGPT SitesやClaude Design、Canvaコードのように、指示文からページを作って公開や書き出しまでできるツールも増えています。

一方で、ブランドの世界観の再現や情報の正確さには注意が必要で、最後は人の目による確認が欠かせません。AIで作ったLPで成果を出すには、自社の目的やスキルに合ったツールを選び、複数の案を出し分けて比べ、検証と改善のサイクルを速く回すことが大切です。

まずは、第3章の早見表で「無料で使える範囲」と「ABテストへの対応」を確かめ、自社の制作の流れのどこにAIを入れるかを決めるところから始めてください。

　

Squad beyondサービス紹介資料はこちらからダウンロード