Studio MCP とは?
Studio MCP は、ProtoPie Studio 内でローカル MCP サーバーを実行し、Claude Desktop、Claude Code、Codex などの AI クライアントが現在開いているプロトタイプを読み取り・操作できるようにします。チャットプロンプトから直接、AI にインタラクションの分析、新規構築、キャンバスのキャプチャなどを依頼できます。

主な機能
インタラクションの分析: 現在のプロトタイプ内のインタラクションを分析します。
プロンプトによるレイヤーおよびレイアウトの作成: レイヤーの作成、変更、配置、スタイル設定を行い、画面を構築・改良します。
プロンプトによるインタラクションの作成: 例えば、ボタンに Tap トリガーを追加したり、タップするとカードが反転する画面を構築したりできます。
画面キャプチャ: 現在の画面のプレビューをキャプチャします。
必要条件
ProtoPie Studio 10.3.0 以降(MCP サーバーは 10.3.0 から標準搭載されています)。
使用する AI クライアントと ProtoPie Studio が同じコンピューターで実行されている必要があります。
ProtoPie Pro または Enterprise プラン。
どのクライアントを接続すべきですか?
接続後の機能体験は同一であり、接続方法のみが異なります。ご自身の環境に最適な方法を選択してください。
クライアント | 対象 | 接続の概要 |
|---|---|---|
Claude Desktop (Chat) | コードやターミナルの使用を避けたいデザイナー(最も簡単な経路) | Labs で Open in Claude Desktop をクリック → 拡張機能 ( |
Claude Code (ターミナル CLI または Claude Desktop の Code タブ) | コードエディターやターミナルの操作に慣れているデザイナーおよびデザインエンジニア |
|
Codex / Cursor / VS Code / その他 | すでに他の MCP クライアントを使用している方 | コマンドまたは設定ファイル (config) 経由でエンドポイントを登録 |