AIは数秒でUIを生成し、コードを書くことができますが、それらの生のアイデアを豊かでインタラクティブな体験へと落とし込むプロセスは、実際のコンテキスト、コントロール、統合が必要になった時点で通常は破綻してしまいます。
本日、それが変わります。 ProtoPie MCPが正式にリリースされました。
このリリースは、AIによる生成と本番対応のプロトタイピングとの間のギャップを埋めるものです。カスタムProtoPieライブラリのサポート、IDによる正確な要素ターゲティング、React Nativeなどのフレームワーク向けに拡張されたコード生成により、高度なインタラクティブプロトタイプをこれまで以上に迅速に構築、微調整、ハンドオフできるようになります。
ProtoPie MCPの新機能
独自のライブラリを使用する
チームがすでに使用しているコンポーネントを使ってプロトタイプを構築できます。
Studio MCPで、有効になっているProtoPieライブラリをブラウズし、ライブラリコンポーネントをインスタンスとしてプロトタイプに追加できるようになりました。これにより、既存のコンポーネントやデザインシステムをワークフローに維持したまま、新しい画面をより簡単に作成できます。

IDで特定の要素をターゲットにする
AIエージェントにより正確なターゲットを指示します。
特定のレイヤー、シーン、変数、コンポーネント、トリガー、レスポンス、またはその他のサポートされている要素のIDをコピーして、プロンプトに含めることができるようになりました。
変更したい要素を説明する代わりに、AIエージェントにそのIDを伝えるだけで済みます。
「[element ID]のインタラクティブ関係(インタラクション)を変更してください。」
これにより、特に複雑なプロトタイプを扱う場合に、AI支援による編集がより正確になります。

React Nativeのサポートによるコード生成
React Nativeの追加により、Code MCPはAIを活用したコード生成において、より多くのフレームワークをサポートするようになりました。Code MCPは以下を公式にサポートしています。
React
React Native
Qt / QML
Flutter
SwiftUI
Compose
ArkTS

ワークフローに合わせたMCPパッケージの選択
プロダクトのワークフローでAIをどこまで活用したいかに応じて、ProtoPie MCPは2つのパッケージでご利用いただけます。
MCP Core: Studio MCPを使用し、独自のAIで高度なプロトタイプを構築・微調整できます。Proプランでご利用いただけます。
MCP Enterprise: Studio MCP、Code MCP、およびDev Viewを使用して、プロトタイプを開発フェーズに移行させます。Enterpriseプランでご利用いただけます。
AIプロンプトからプロダクトへ
ProtoPie MCPは、AIをプロダクトの全ワークフローに接続します。 プロンプト → プロトタイプ → 検証 → コード。
独自のAIを使用してプロトタイプを構築・微調整し、ユーザーテストを行い、ProtoPie Connectを介して実機でインタラクションを検証し、開発前に磨きをかけます。その後、Code MCPとDev Viewが、そのプロトタイプの文脈をAI駆動のコード生成へと引き継ぎます。

AIでより迅速に構築。ProtoPieで微調整。より豊かな文脈を持ってコードへ移行。




