ドキュメントはじめにクイックスタート

クイックスタート

ゼロから5分以内にウェブサイトを公開する方法。

ステップ1 — サインイン

draftly.space にアクセスし、Googleまたはメールでサインインしてください。新規アカウントは30秒で作成できます。

サインイン後はダッシュボード — プロジェクト一覧 — に移動します。初回ユーザーには最初のサイトを作成するプロンプトが表示されます。

ステップ2 — ビルダーを開く

ダッシュボードまたは上部ナビゲーションから 新規プロジェクト または 3Dビルダー をクリックしてください。

ビルダーは左下にチャット入力、右側にライブプレビューパネルが表示されます。初回訪問の場合、インターフェースを案内する3ステップのツアーが表示されます。いつでも閉じるか、? ヘルプボタンから再度確認できます。

ステップ3 — プロンプトを書く

チャット入力にウェブサイトの説明を入力してください。具体的であるほど良い結果が得られます — ビジネス名、業種、必要なセクション、ビジュアルムードを含めてください。

例:「Romano's Coal-Fired Pizza — 1987年創業のブルックリンのファミリーレストラン。温かみのある、素朴で暗い映画的な雰囲気。ヒーロー、メニュー、私たちのストーリー、予約、レビューのセクションを含む。CTA:テーブルを予約する。」

Enter を押すか送信アイコンをクリックして生成を開始してください。オプションで最初に ✨ エンハンス ボタン(1クレジット)をクリックすると、AIがプロンプトを強化します。

ステップ4 — パイプラインを見守る

生成には平均2〜3分かかります。ライブプログレスバーに4つのステージが表示されます:

1.サイトの計画 — AIがブランド名、見出し、セクションを抽出
2.ヒーロー画像の生成 — AIが映画的な背景静止画を作成
3.モーション動画の作成 — Veo 3.1がスクロール動画を生成(約60〜90秒)
4.サイトの構築 — HTMLセクションが並列で組み立てられる

タブを開いたままにしておくのが最良の体験です。タブを閉じた場合、プロジェクトを再び開くと自動再開バナーが表示されます — クリックして中断したところから続けてください。

ステップ5 — プレビューと編集

生成が完了すると、プレビューパネルにスクロールアニメーションが有効になったライブサイトが表示されます。

プレビューでスクロールして動画連動パララックスアニメーションを確認
任意のテキストをクリックしてインラインで編集 — 無料、即時、クレジット不要
チャットで入力してデザイン変更をリクエスト:「背景を暗くする」、「CTAを「今すぐ予約する」に変更する」、「価格セクションを追加する」
デザインプリセット(筆アイコン) — ワンクリックのスタイル変換、無料

ステップ6 — 公開

左下のアクションバーの Publish Live をクリックしてください。

サブドメインを選択してください(例:romanos-pizza.draftly.space)。サイトはCloudflare CDNを通じて約5秒でライブになります。

クライアントにURLを共有するか、実際のウェブサイトとして使用してください。ビルダーでの将来の編集は新しいURLなしかつダウンタイムなしで即座に再公開できます。