Runner AI
ガイド

AIストアビルダー

AIを使用してホームページから商品ページまで完全なオンラインストアを生成し、ビジュアルエディターですべての詳細を微調整する方法を学びます。

Runner AIのAIストアビルダーは、シンプルな説明を使用してライブで販売可能なECウェブサイトを生成できるエンドツーエンドの自動ウェブサイト作成システムです。

従来のウェブサイトビルダーとは異なり、以下は不要です:

  • コードを書く
  • レイアウトをデザインする
  • 複雑なツールを学ぶ
  • 空白のキャンバスから始める

1つのプロンプトだけで、Runner AIは以下を生成できます:

  • ホームページ(ヒーローセクション、商品ブロック、カテゴリー構造)
  • 商品ページ(商品が追加されている場合)
  • サイト全体のカラーパレットとタイポグラフィ
  • コンバージョン重視のコピー
  • ウェブサイトの画像とビデオ(オプション)
  • 完全なサイト構造とレイアウトフレームワーク

生成後、ビジュアルエディターですべてを微調整したり、プロンプトでコンテンツをさらに最適化できます。

学べること

  • AIストア構築ワークフロー
  • プロンプトの書き方と最適化
  • デザインモード(ビジュアル編集)の使用
  • AIによるテキスト、画像、レイアウトの最適化
  • ウェブサイトビデオの生成
  • 新しいモジュールの追加
  • マルチページサイト構造の構築
  • 以前のバージョンの復元
  • よくある質問

1. AIで最初のウェブサイトを生成

Runner AIの中核機能は、プロンプトを通じてビジネスアイデアを完全なウェブサイトに変換することです。

(1) プロセス概要(ステップバイステップ)

ステップ1: ストアを作成

  • ダッシュボード → 新規ストアへ移動
  • ストア名を入力後、構築ページに入ります

ステップ2: プロンプトを入力

ウェブサイトのアイデアを自由に入力できます。例:

  • 「手作りキャンドルを販売するウェブサイトが必要です。優しくクリーンなクリームスタイルの美学で。」
  • 「カウントダウンと割引セクションのあるブラックフライデーエレクトロニクスプロモーションサイトを作成してください。」
  • 「私のAIコース用のプロモーションページを生成してください。」

ステップ3: 生成を待つ(数秒かかります)

AIが自動的に以下を生成します:

  • ページ構造
  • 画像(AI画像が選択されている場合)
  • コピー(タイトル、説明)
  • 推奨モジュール
  • ウェブサイトスタイルシステム

ステップ4: 結果を確認して編集を開始

生成後、以下のことができます:

  • レイアウトを変更
  • 画像を置き換え
  • コピーを最適化
  • モジュールを追加
  • 新しいページを追加

2. プロンプトの最適化

プロンプトの品質は、生成されるサイトの品質に直接影響します。

強力なプロンプトの重要な要素

よく構成されたプロンプトには通常以下が含まれます:

ビジネスタイプ

  • 「ペット用品店」
  • 「ヨガアパレルブランド」

デザインスタイル

  • 「ミニマル、クリーン、クリーミーなトーン」
  • 「ダーク、プレミアム、未来的」

ターゲットオーディエンス

  • 「米国の女性消費者向け」
  • 「プロの写真家向けに設計」

機能要件

  • 「カウントダウンモジュールを含める」
  • 「高解像度の画像ギャラリーを表示」

プロンプト強化(組み込みアシスタンス)

シンプルなアイデアから始める場合、例えば:

「ペット用品のウェブサイトを作りたい」

Runner AIが自動的にプロンプトを強化し、以下を拡張します:

  • サイト構造
  • デザインの方向性
  • モジュール要件
  • コピーのトーン
  • ユーザーシナリオ

Tabを押して強化されたプロンプトを受け入れ、続行します。

推奨プロンプト例

冬のクリアランス (モダンでモバイルファーストの冬服クリアランスECウェブサイトを作成...)

ホームデコールブティック (シック、ミニマリストなデザインのホームデコールブティックを作成...)

Shopifyテーマのリミックス (Shopify impulseテーマをリミックス https://themes.shopify.com/themes/impulse/presets/impulse...)

パーソナルブランドウェブサイト (モダンでレスポンシブな創業者主導のECウェブサイトを作成...)

(上記のプロンプトは公式推奨例です。)

3. デザインモード(ビジュアル編集)

デザインモードでは、コード不要でウェブサイトを視覚的に微調整できます。

テキスト編集

以下のことができます:

  • テキストを手動で編集
  • フォント、サイズ、ウェイトを調整
  • 色、配置、位置を変更
  • AIリライトを使用して異なるトーンでコピーを再生成

AI機能の編集はクレジットを消費します。

画像編集

2つのオプションがあります:

自分の画像をアップロード 既存のブランドアセットを持つ販売者に最適。

AI画像で生成または置換 ビジュアル素材がない場合に最適。

プロンプト例:

「柔らかいベージュの背景と自然な太陽光を持つ、温かいライフスタイルヒーロー画像を生成して。」

Runner AIが選択した画像を自動的に置き換えます。

4. ビデオ生成

ビデオ生成は、エンゲージメントとSEOを向上させるために設計された高度な機能です。

ビデオの生成方法

以下のようなプロンプトを入力:

generate a branding video for my hero section that showcases modern jewelry with gold accents and slow-motion product shots

Runner AIは以下を行います:

  • ビデオを生成
  • ヒーローセクションに挿入
  • 自動再生、ミュート、ループ設定を構成

カスタマイズ可能なオプション

  • サムネイル画像
  • 再生動作(自動再生、ミュート、ループ)
  • ビジュアルスタイル(リアリスティック、シネマティック、ブランド重視)

利用可能性とコスト

  • Runner Plan以上で利用可能
  • 各ビデオは10クレジットを消費

5. 新しいモジュールを追加

モジュールはページの充実度とSEOパフォーマンスを決定します。

利用可能なモジュール:

  • 商品カテゴリーセクション
  • FAQ
  • お客様の声
  • テキストブロック
  • 画像+テキストセクション
  • マーケティングポップアップ(割引、カウントダウン)
  • メール購読ブロック
  • 機能ハイライト
  • ブランドストーリー / Aboutセクション

ユースケース:

  • 商品ローンチページ
  • キャンペーンランディングページ
  • ブランドストーリーテリングページ
  • SEOコンテンツページ(例:「冬のコーディネートガイド」)

モジュールは制限なく追加でき、コード不要です。

6. マルチページサイト構造を構築

完全なウェブサイトには通常、ホームページ以上のものが含まれます。

以下を作成できます:

商品詳細ページ

含まれるもの:

  • 商品画像
  • 説明
  • 仕様
  • カスタマーレビュー
  • おすすめ商品
  • FAQ

ブログページ

SEOとコンテンツマーケティングに使用、例えば:

  • 「正しいヨガウェアの選び方」
  • 「なぜ天然キャンドルの方が安全なのか」

会社概要ページ

ブランドの信頼性と信用を構築。

お問い合わせページ

カスタマーサポートメールとソーシャルリンクを提供。

Runner AIは各ページの完全なコンテンツを自動生成できます。

7. バージョン履歴とロールバック

AI生成の変更や手動編集はすべて自動的にバージョンとして保存されます。

以下のことができます:

  • すべてのバージョンを表示
  • 以前の状態をプレビュー
  • ワンクリックで任意のバージョンを復元

以下に最適:

  • 異なるデザインのテスト
  • ミスの修正
  • 不要な変更の取り消し

8. FAQ

Q1: 生成されたウェブサイトを完全にカスタマイズできますか? はい。ほぼすべてのレイアウト、画像、テキストが編集可能です。

Q2: なぜビデオ生成は有料機能ですか? ビデオ生成はリソース集約型のため、高度な機能として分類されています。

Q3: AI生成画像の権利は誰が所有しますか? 完全な商用利用権を取得できます。

Q4: 英語以外のプロンプトを使用できますか? はい、ただし現在は英語のプロンプトが最良の結果を提供します。