一行の指示からランディングページを公開する

必要なページを伝えるだけで、Zero が全体の構成を組み立て、各セクションの文章を書き、GitHub の PR を作成し、公開前に確認できるプレビューリンクまで用意します。

Zeroの接続先:GitHubVercelPlausible

Zeroが用意するもの:公開済みのライブなストアフロント

Zeroが最初から最後まで構築した実在のページを確認できます。ハイジュエリーブランド向けのブリーフ1本から、Zeroは17セクションのストアフロントを書き、ライセンス済みの写真29点を集めてすべてにクレジットを付け、サイトを新しいGitHubリポジトリにコミットし、Vercelの本番環境へデプロイしました。下に表示されているのは、まさにそのデプロイ結果です。

これは実際のデプロイです。Zeroがこのページを書き、Vercelの本番環境に公開しており、上のフレームはそのライブURLを読み込んでいます。AURELLEはブリーフ用に考えたブランドで、写真はライセンス済みのストック素材をページ上でクレジット表記しています。

エージェントの要約. Zeroはハイジュエリーブランド向けに17セクションのストアフロントを書きました。ヒーローから始まり、コレクションギャラリー、オーダーメイドの流れ、ブランドストーリー、顧客の声、FAQ、そして予約を促すCTAまで続きます。ライセンス済みの写真29点を撮影者クレジット付きで集め、サイトを新しいGitHubリポジトリにコミットし、Vercelの本番環境にデプロイしました。デプロイ先はHTTP 200を返しています。 書いたセクション: 17, ヒーローから予約CTAまで. ライセンス画像: 29, UnsplashとPexels、すべてクレジット付き. 必要だった引き継ぎ: 0, ブリーフからライブURLまで1回の実行.

公開中のジュエリーストアフロントを開く

AIランディングページビルダーとは

AIランディングページビルダーとは、書かれたブリーフを、セクション構成・コピー・画像まで含む完成したレスポンシブなランディングページに変える仕組みです。デザイナーやフロントエンドエンジニアが手作業で組み立てる必要はありません。Zeroはホスティング型のページビルダーより一歩踏み込みます。サイトを実際のコードベースとして書き、GitHubにコミットし、Vercelにデプロイします。手元に残るのは、他社のエディタに閉じ込められたページではなく、自分たちが所有し編集し続けられる本番サイトです。成果物は、確認でき、普通の言葉で変更でき、キャンペーンの遷移先にできるライブURLです。

単純なランディングページに、いまだに1週間かかる理由

キャンペーンの準備は整っているのに、ランディングページだけが間に合っていない。オファーもターゲットも、ページにどんなことを書くべきかも、おおよそ頭の中にある。けれどそれを実際のページにするには、デザインへの依頼書、エンジニアリングへのチケット、何度かの文章修正、そして次のデプロイ枠を待つ時間が必要です。ページが公開される頃には、もう旬は過ぎている。Zero はその工程を一気に縮めます。誰に向けたページで、訪問者にどんな行動を取ってほしいかを伝えれば、構成全体(ヒーロー、バリュープロップ、ソーシャルプルーフ、FAQ、コールトゥアクション)を組み立て、文章を書き、PR を作成し、プレビュー URL を渡します。モックアップではなく、実際のインフラ上の本物のページを確認し、自然な言葉で修正を依頼できます。

Zeroがランディングページを構築してデプロイする流れ

ステップ1:ツールを接続する

GitHub
GitHub
必須
Zero がページを新しいブランチにコミットし、プルリクエストを作成します。ページの構築と公開に必須です。
接続
Vercel
Vercel
必須
Zero がプレビューデプロイを読み取り、PR とまったく同じページのライブ URL を渡せるようにします。プレビューリンクに必須です。
接続
Plausible
Plausible
オプション
Zero がページのアナリティクスを追加・取得し、公開後のパフォーマンスを計測できるようにします。任意です。
接続

ステップ2:Zeroに聞く

@Zero スタートアップの創業者向けの新しいチームプラン用ランディングページを作って。ヒーロー、3つのバリュープロップ、短い FAQ、登録のコールトゥアクションを入れて。PR を作成してプレビューリンクを送って。
Zero がブリーフをページ構成に変換します
Zero はあなたのゴールとターゲットを受け取り、コンバージョンするページに必要なセクションを設計します。明確な見出しを持つヒーロー、バリュープロポジション、ソーシャルプルーフ、反論に答える FAQ、そして1つの主要なコールトゥアクションです。
Zero が文章を書き、ページを構築します
Zero は各セクションをあなたのプロダクトのトーンで書き起こし、コードベースの中でページを組み立て、新しいブランチにコミットします。既存のデザインシステムに沿うので、後付け感のない、自然に馴染むページに仕上がります。
Zero がプレビューデプロイ付きの PR を作成します
Zero は GitHub のプルリクエストを作成し、プレビューデプロイの完了を待ちます。実際のインフラ上の本物のページを表示するライブ URL が手に入るので、確認したものがそのまま訪問者の見るものになります。
自然な言葉で修正を重ねられます
見出しをより鋭く、FAQ の順序を入れ替え、コールトゥアクションを変える、といった希望を返信するだけで、Zero はブランチを更新し、マージできる状態になるまでプレビューを再デプロイします。

ステップ3:さらに活用する

アナリティクスを設定する
ページ単位のトラッキングを追加し、初日からパフォーマンスを計測できるようにします
@Zero 新しいランディングページに Plausible のトラッキングを追加して、どのイベントを取得しているか教えて。
テスト用のバリアントを用意する
最初のページと A/B テストするための2つ目のバージョンを作成します
@Zero ランディングページを複製して、機能訴求ではなくベネフィット訴求の見出しにしたバリアントを作り、PR を作成して。
定例化する
新しいキャンペーンブリーフを渡せば Zero がページを作るようにします
@Zero このチャンネルにキャンペーンブリーフを置いたら、それに合ったランディングページを作り、PR を作成して、プレビューリンクを送って。

ランディングページ向けのGitHub・Vercel・Plausible連携

このワークフローは、間にエージェントが入るGitHubとVercelの連携です。Zeroがサイトを書き、GitHub経由でコミットし、Vercel経由で公開します。各コネクターは個別に許可され、ワークフローが実際に使う範囲に限定されるため、デプロイの権限が他のリポジトリへのアクセスを意味することはありません。

GitHub

GitHub連携:Zeroが書き込むリポジトリ

必須

Zeroはリポジトリを作成し、ページとアセットをコミットし、指定されたブランチにプッシュします。サイトがホスティング型エディタではなくGitに置かれるため、すべての変更は読み・レビュー・取り消しができる通常のコミットになり、社内のエンジニアはエクスポート作業なしでいつでもページを引き継げます。既存のサイトがある場合、Zeroはその中で作業します。既存のデザインシステムに従い、リポジトリにプルリクエストを開くので、新しいページはすでに運用しているレビュープロセスを通って公開されます。書き込み権限は、許可したリポジトリだけに限定されます。

Vercel

Vercel連携:Zeroが公開するデプロイ

必須

ZeroはVercelのプロジェクトを作成し、コミット済みのサイトをデプロイし、そのデプロイを読み返して、実際に配信されているURLを手渡します。この読み返しが重要です。ビルドが始まったという約束ではなく、ビルドが完了してからリンクが渡されますし、ビルドが失敗した場合は死んだリンクではなくエラーが報告されます。プレビューのデプロイも同じ仕組みなので、本番URLになる前に実際のインフラ上でページを確認できます。プッシュによる自動再デプロイのためにVercelプロジェクトをGitHubと接続するのは、あなた自身が一度だけ行う認可であり、それによって以降のすべての更新が自動でデプロイされるようになります。

Plausible

Plausible連携:Zeroが追加して読み取る解析

オプション

Plausibleは任意で、価値を発揮するのは公開後です。Zeroは作ったばかりのページに計測スクリプトを追加し、数えるべきイベントに名前を付け、依頼があればその数値を読み返します。つまり「今週このページはどうだったか」を、ページを生み出したのと同じ会話の中で聞けます。ページを作ることと、それがコンバージョンするかを知ることがつながり、そこからバリエーションのテストが始まります。Plausibleがなくてもワークフローは最後まで動きます。結果を別の場所で測るだけです。

Zero、ドラッグ&ドロップのページビルダー、デザイン・開発サイクルの比較

ランディングページ作りは、たいてい速さと所有権のどちらを取るかの選択になります。ホスティング型ビルダーは速いがページはツールの中に留まり、デザインと開発のサイクルは本物のコードが手に入るが1週間かかります。Zeroは、コードとデプロイを1回の実行で生み出すAIサイトビルダーの道筋です。

ドラッグ&ドロップのページビルダー

テンプレートとビジュアルエディタでページはすぐ公開できますが、見出しはすべて自分で書き、画像もすべて自分で選び、セクションの並びも自分で決めることになります。さらにページはツールの中に留まるため、後から移すには作り直しが必要で、サブスクリプションは終わりません。

デザインと開発のサイクル

デザインへのブリーフ、エンジニアリングへのチケット、コピー修正の往復、そしてデプロイの枠。求めたとおりの結果が完全に自社の資産として得られますが、たいていキャンペーン側が待たされますし、単発のページがロードマップより優先されることはめったにありません。

Zeroのランディングページ ワークフロー

Zeroは一度の実行で全工程を進めます。構成、コピー、ライセンス画像、GitHubへのコミット、そしてライブURLを返すVercelのデプロイまでです。成果物は自社リポジトリの中のコードなので、修正はチャットでの一言で済み、エンジニアへの引き渡しにエクスポートは要りません。

より良い結果のためのヒント

ブリーフは、訪問者に取ってほしい行動(登録する、デモを予約する、トライアルを始める)から書き始めましょう。ゴールが明確なほど、機能の羅列よりも鋭いページに仕上がります。
気に入っている既存ページを参考として Zero に示すと、新しいページが実績のある構成とあなたのデザインシステムを引き継ぎます。
初日からアナリティクスを有効にして、推測ではなく実際の訪問者の行動をもとに改善できるようにしましょう。

よくある質問

AIでランディングページを作るにはどうすればよいですか。

GitHubとVercelをZeroに接続し、ブランド、想定する読み手、そして訪問者に取ってほしい行動を説明してください。Zeroはセクションを設計し、コピーを書き、画像を集め、サイトをリポジトリにコミットし、デプロイします。ライブURLが返ってくるので、あとは普通の言葉で返信して調整していきます。

AIエージェントがランディングページをVercelに自動でデプロイできますか。

できます。Vercelのコネクターを許可すると、Zeroはプロジェクトを作成し、コミット済みのサイトをデプロイし、URLを渡す前にデプロイ状態を読み返します。したがって渡されるリンクは、すでにページを配信しているものです。プッシュによる自動再デプロイのためにVercelプロジェクトをGitHubと接続するのは、あなた自身が一度だけ行う認可で、それ以降の変更はすべて自動で再デプロイされます。

Zeroはレイアウトだけでなく、ランディングページのコピーも書きますか。

書きます。ページ制作を止めがちなのはたいていコピーなので、Zeroはヒーローの見出し、価値提案、プロセスの説明、FAQの回答、行動喚起まで、指定されたトーンで各セクションを下書きします。トーンと参考にしたいブランドを2〜3社挙げれば、最初の下書きの精度が大きく上がります。

ページの画像はどこから来ていますか。

ZeroはUnsplashやPexelsなどライセンス済みのストックライブラリから写真を取得し、各画像の撮影者クレジットをページに記録します。このページのサンプルストアフロントでは、クレジット付きの写真が29点でした。自社のアセットフォルダやブランドライブラリを指定すれば、そちらを使います。

既存のサイトとデザインシステムの中にページを作れますか。

作れますし、すでにサイトがある場合はそちらの方が適しています。Zeroにリポジトリを指定すると、既存のコンポーネントとトークンからページを組み立て、独立したプロジェクトを作る代わりにプルリクエストを開きます。サイトの他の部分と同じ部品で作られているため、見た目も自然になじみます。

作った後でページを変更するにはどうしますか。

変えたい内容を返信するだけです。Zeroがコードを編集し、コミットし、再デプロイします。本番URLは変わりません。すべての変更がGitのコミットなので、差分を確認したり、以前のバージョンに戻したりもできます。

AIエージェントが生成したコードの所有権は誰にありますか。

あなたにあります。サイトは自分のGitHubリポジトリにコミットされ、自分のVercelアカウントにデプロイされるため、エクスポート作業も、ページを公開し続けるためにZeroに依存することもありません。コネクターの許可を取り消しても、リポジトリと稼働中のデプロイはそのまま残ります。

このランディングページのワークフローにはどのツールが必要ですか。

GitHubとVercelが必須です。GitHubがコードを保持し、Vercelがそれを配信します。Plausibleは任意で、公開後にページの解析を追加し、成果を測ったりバリエーションをテストしたりできるようにします。

最初のページを作る

GitHubとVercelを接続し、ブランドと訪問者に取ってほしい行動を説明してください。上のストアフロントを生んだのと同じプロンプトが、あなたのページを生み出します。

@Zero スタートアップの創業者向けの新しいチームプラン用ランディングページを作って。ヒーロー、3つのバリュープロップ、短い FAQ、登録のコールトゥアクションを入れて。PR を作成してプレビューリンクを送って。