メインコンテンツまでスキップ

AI アシスタント (MCP)

WebTwizz を AI アシスタントに接続すると、会話を通じてサイトを作成、変更、公開できます。アシスタントが WebTwizz に作業を依頼し、すべてが WebTwizz アカウントに保存されます。どのサイトもエディターで開いて、作業を続けられます。

WebTwizz は、MCP サーバーに接続できるアシスタントならどれでも使えます。サーバー URL は次のとおりです。

https://app.webtwizz.com/mcp

接続​

ChatGPT​

近日対応予定

WebTwizz は、近日中に ChatGPT のアプリディレクトリに追加される予定です。

  1. ChatGPT のアプリディレクトリで WebTwizz を開くか、WebTwizz を検索します。
  2. 接続をクリックします。
  3. WebTwizz にログインするか、無料アカウントを作成して、アクセスを許可します。

Claude​

  1. Web 版またはデスクトップアプリの Claude で、設定、コネクタの順に開き、カスタムコネクタを追加を選択します。
  2. サーバー URL を貼り付けて確定します。
  3. WebTwizz にログインするか、無料アカウントを作成して、アクセスを許可します。

Claude Code​

  1. ターミナルで claude mcp add --transport http webtwizz https://app.webtwizz.com/mcp を実行します。
  2. Claude Code で /mcp と入力し、WebTwizz を選択します。
  3. 開いたブラウザーウィンドウで WebTwizz にログインします。

Codex​

  1. ターミナルで codex mcp add webtwizz --url https://app.webtwizz.com/mcp を実行します。
  2. codex mcp login webtwizz を実行します。
  3. 開いたブラウザーウィンドウで WebTwizz にログインします。Codex アプリとエディター拡張機能は、同じ設定を使います。

Cursor​

  1. Cursor 設定、MCPの順に開き、新しい MCP サーバーを追加します。
  2. 次の設定を貼り付けるか、~/.cursor/mcp.json に追加します。
{
  "mcpServers": {
    "webtwizz": { "url": "https://app.webtwizz.com/mcp" }
  }
}
  1. WebTwizz の横にあるログインをクリックし、ログインします。

VS Code​

  1. code --add-mcp '{"name":"webtwizz","type":"http","url":"https://app.webtwizz.com/mcp"}' を実行するか、コマンドパレットで MCP: サーバーの追加を選択してサーバー URL を貼り付けます。
  2. MCP サーバーの一覧から WebTwizz を起動します。
  3. VS Code に求められたら、WebTwizz にログインします。

その他のアシスタント​

HTTP 経由でリモートサーバーを追加でき、ログインに対応している MCP クライアントなら、WebTwizz を使えます。サーバー URL を追加し、ログイン方法を尋ねられたら OAuth を選択します。その後、WebTwizz にログインしてアクセスを許可します。

接続できたら、「パン屋のサイトを、メニューと営業時間付きで作って」のように、WebTwizz を使うようアシスタントに依頼してください。アシスタントが作成や変更を行うには、WebTwizz アカウントのメールアドレスを確認済みにする必要があります。

依頼できること​

  • サイトの作成: 作りたいサイトを説明したり、テンプレートから始めたり、会話の内容をサイトにするようアシスタントに依頼したりできます。
  • サイトの変更: 文章やデザインの変更、新しいセクションやページの追加、不具合の修正ができます。アシスタントにサイトを確認してもらい、変更を提案してもらうこともできます。
  • 公開: WebTwizz が確認を求め、公開を押した場合にのみ公開します。サイトを非公開にする、名前を変更する、webtwizz.app アドレスを変更する、コピーを作成することもできます。
  • 元に戻す: サイトの保存済みバージョンに戻せます。
  • データ: サイトのデータベース内のレコードを読み取り、変更できます。
  • コネクタ: Stripe や Supabase など、すでに接続済みのアカウントを使えます。
  • GitHub: GitHub に接続したサイトで、プッシュ、プルなどの git 操作ができます。
  • シークレット: サイトに設定されているシークレットを確認し、新しく追加できます。連絡先メールアドレスなど、サイト上で誰でも見られる公開設定はすぐに保存されます。API キーは必ず WebTwizz の設定 > シークレットに貼り付けてください。チャットには貼り付けないでください。
  • ファイル: アシスタントが生成した画像も含め、会話内の写真、ロゴ、文書をサイトで使えます。

ChatGPT 内の WebTwizz カード​

ChatGPT では、チャット内の WebTwizz カードに作業の進行状況が表示され、完了すると結果が表示されます。

  • 全画面表示では、プレビューを大きく表示し、その横にチャットを表示します。
  • 編集では、プレビュー内の要素をクリックして変更内容を伝えたり、テキストをダブルクリックして直接書き換えたりできます。入力したテキストはすぐに保存されます。
  • プレビューの下にあるこの変更を元に戻すを押すと、最新の変更前の状態にサイトを戻せます。ただし、その後に新しい変更が行われていない場合に限ります。
  • 質問への回答、手順の承認、公開の確認などが必要な場合は、カード上部のボックスに表示されます。その場で回答することも、チャットで回答することもできます。
  • WebTwizz で開くを押すと、サイトがエディターで開きます。

アシスタントとエディターの併用​

  • アシスタントで作成したサイトは、通常の WebTwizz プロジェクトです。
  • サイトをエディターで開いている場合、アシスタントによる変更はチャットパネルに随時表示され、エディターにも反映されます。
  • すべての変更は、バージョン履歴にバージョンとして保存されます。
  • 1 つのサイトで同時に実行できる変更は 1 つです。WebTwizz がすでにそのサイトで作業中の場合、アシスタントは別の変更を始めず、作業中であることを伝えます。
  • ChatGPT からサイトを開いた場合、エディターのメニューにある ChatGPT に戻るで会話に戻れます。

クレジットとプラン​

アシスタントからの作業でも、エディターでの作業と同じように WebTwizz のクレジットを使います。クレジットがなくなると、アシスタントがその旨を伝え、変更は行われません。無料クレジットは毎日補充されます。独自ドメイン、非公開サイト、コードのダウンロードなどの有料プランの機能は、対象のプランであればアシスタントからも使えます。

プライバシー​

アシスタントが WebTwizz に送るのは、依頼に必要な情報だけです。依頼内容、対象のサイト、使用するために選択したファイルが含まれます。WebTwizz が会話履歴を見ることはありません。詳しくはプライバシーポリシーをご覧ください。

接続の解除​

WebTwizz で設定、セッションの順に開き、接続済みのアプリでアシスタントの接続を解除します。アクセスはすぐに停止されます。アシスタントの設定から WebTwizz を削除した場合も、アカウントを利用できなくなります。

トラブルシューティング​

  • プレビューの表示に時間がかかる: サイトのプレビューは必要になったときに起動します。しばらく開いていなかったサイトでは、起動に最大 1 分かかる場合があります。
  • WebTwizz が使用中だとアシスタントに言われる: そのサイトで変更が実行中か、エディターでバージョン履歴が開かれています。変更の完了を待つか、バージョン履歴を閉じてください。
  • クレジットがないとアシスタントに言われる: 変更は行われていません。クレジットは毎日補充されます。クレジットとプランの仕組みについては、料金をご覧ください。