OpenDesignとは何ですか?
OpenDesignは、デザインシステムに基づいてHTMLプロトタイプを生成・編集し、チームで共有できるコラボレーション型デザインエージェントワークスペースです。ローカルにインストールしたコーディングエージェントや独自APIキーを用いればアカウント登録なしで利用可能ですが、ホスト型モデルの利用には有料プランへの加入が必要です。
OpenDesignの特徴は何ですか?
- デザインシステムの適用150以上のオープンソースデザインシステムを選択するか、WebサイトやGitHubリポジトリから独自システムを作成し、色やタイポグラフィを全制作物に反映します。
- プロトタイプの直接編集生成後も要素の移動・サイズ変更やテキスト修正が可能で、再生成せずに細部を調整できます。
- チームでのレビューと修正プロトタイプを共有リンクやワークスペースで公開し、メンバーが画面上にコメントを残すと、エージェントがそのフィードバックを受けてファイルを修正します。
- 多様な出力形式スタンドアロンHTML、PDF、PNGへ書き出せます。スライド資料はPowerPoint形式でもエクスポート可能です。
- スキルによる機能拡張リサーチやコンテンツ作成などのコミュニティ提供スキルを追加し、カスタマイズして機能を強化できます。
- 既存エージェントとの連携Claude CodeやCursorなど21種類以上のコーディングエージェントをローカル環境でそのまま利用できます。
OpenDesignの使用例は何ですか?
- ブランド統一された迅速なUI設計デザインシステムを選択し、自然言語で画面構成を記述するだけで、ブランドガイドラインに沿った動作するHTMLプロトタイプを生成する場合。
- エンジニアリングへのハンドオフ完成したプロトタイプをHTMLやPDFとしてエクスポートし、開発チームへ渡すか、引き続きコーディングエージェントで本番アプリ化を進める場合。
- 非技術者によるデザイン確認コーディング知識がないユーザーが、プレビュー機能で結果を確認し、直接要素を操作したり追加指示を出したりしてデザインを仕上げる場合。
OpenDesignの使い方は?
- エージェント接続またはクラウド起動ローカルエージェントを接続するか、OpenDesign Cloudにサインインしてプロジェクトを開始します。
- デザインシステム選択と指示デザインシステムを選び、必要な画面内容を記述してエージェントにHTMLプロトタイプを書き込ませます。
- プレビューと直接編集ライブプレビューで確認し、必要に応じて要素の移動やテキスト変更を直接行います。
- チーム共有とコメント収集共有リンクを発行し、チームメンバーが画面上に付けたコメントを集約します。
- 修正とエクスポートコメントをエージェントに渡して修正させ、最終的にHTMLやPDFなどで出力します。
OpenDesignの価格情報:
- Freeデスクトップアプリ本体と、ローカルエージェントまたは独自APIキーの使用は無料です。OpenDesign Cloudのホスト型モデルクレジットは含まれません。
- Plus, Pro, MaxOpenDesign Cloud上のホスト型モデルを利用するための月次モデルクレジットと、パブリッシング機能が提供されます。
- Team共有ワークスペース、オーナー/管理者/メンバー権限、共有デザインシステムおよびプラグインを利用でき、シート単位で課金されます。









