Designobo について
Designoboは、AIエージェントがライブキャンバス上でUIプロトタイプを作成・編集するデザイン環境です。画面を制作・確認するチーム向けで、プロジェクトや画面へのアクセスに加え、ブラウザーでのレンダリングによるエラー確認ができます。
主な機能
- 01チームプロジェクトの閲覧
- 02画面の読み取りと検索
- 03プロジェクトと画面の作成
- 04画面のリアルタイム編集
- 05ブラウザーでの画面レンダリング
活用シーン
- 01アプリのオンボーディング画面設計
- 02画面への料金セクション追加
- 03チェックアウト画面の確認
- 04レンダリング画面のエラー確認
MCP 対応
OAuthを使ってDesignoboのリモートサーバー `https://designobo.com/mcp` に接続します。エージェントはMCP経由でプロジェクトや画面にアクセスし、作成、編集、レンダリングを行えます。
設定
リモートサーバーはインストール不要です。クライアントを選んで設定をコピーするか、ワンクリックで導入できます。
https://designobo.com/mcpclaude mcp add --transport http guillemus-designobo https://designobo.com/mcp{"mcpServers":{"guillemus-designobo":{"type":"http","url":"https://designobo.com/mcp"}}}Cursor で開く{"servers":{"guillemus-designobo":{"type":"http","url":"https://designobo.com/mcp"}}}VS Code で開く{"mcpServers":{"guillemus-designobo":{"type":"http","url":"https://designobo.com/mcp"}}}{"mcpServers":{"guillemus-designobo":{"serverUrl":"https://designobo.com/mcp"}}}コマンドはターミナルで実行し、JSON は各クライアントの MCP 設定に貼り付けて再起動します。認可が必要なサーバーは初回接続時にログインを求めます。
ツール
詳細
Designobo
AI エージェントから Designobo で UI プロトタイプをデザイン、編集できます。
エージェントは、チームのプロジェクトを閲覧したり、画面を読み込んで検索したり、新しいプロジェクトや画面を作成したりできます。また、変更がリアルタイムで反映される様子を見ながら既存の画面を編集し、実際のブラウザーで画面をレンダリングしてエラーを確認することもできます。
インストール
エージェントのプラグインディレクトリから Designobo をインストールします。初回使用時にエージェントがブラウザーウィンドウを開くので、Designobo にサインインし、チームへのアクセスを許可してください。設定する API キーはありません。
このプラグインは OAuth を使用して、https://designobo.com/mcp のリモート MCP サーバーに接続します。
プロンプトの例
- 習慣トラッカーアプリ用の Designobo プロジェクトを作成し、オンボーディング画面をデザインしてください。
- Designobo プロジェクトのホーム画面に料金セクションを追加してください。
- Designobo のチェックアウト画面を読み込み、このリポジトリでコンポーネントとして構築してください。
ドキュメントとサポート
- ドキュメント：https://designobo.com/docs/mcp
- プライバシーポリシー：https://designobo.com/privacy
- サポート：[email protected]
コメント
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。