Claude Design のオープンソース代替

Claude Design は優れています。しかし同時に、クローズドソースであり、ホスト型のみで、Claude のサブスクリプションに抱き合わせられています。どんなときに Claude Design を選ぶべきか、そしてどんなときにオープンソースの道に軍配が上がるか——その率直な見解をお届けします。

Claude Design は優れています。私たちも実際のブリーフで使ってきました。それでも私たちが代わりにオープンソースのレイヤーを作ったのは、Anthropic が出来の悪いツールを出したからではありません——そんなことはありません。クローズドソースで、ホスト型のみで、月額 20 ドルから 200 ドルというデザインツールの形が、これから 10 年のデザイン作業にとって間違った形だからです。本記事は、同じカテゴリーで製品を出しているチームによる、Claude Design についての率直な見解です——それが何であるか、どこであなたをロックインするのか、オープンソースの代替が実際にはどう見えるのか、そしてこの四半期にどちらを選ぶべきか。

Claude Design とは実際のところ何か

Claude Design は 2026 年 4 月に Anthropic Labs から登場しました。Claude Opus 4.7 を搭載した対話型デザインツールで、左にチャット、右にキャンバスという構成です。欲しいものを説明すると Claude がデザインを生成し、コメント、インライン編集、プロンプトの調整を通じて反復していきます。

うまくこなすことが 4 つあります。

文章からのプロトタイプ。オンボーディングフロー、設定ページ、管理パネル、チェックアウトのバリエーション——プロンプトからインタラクティブな画面まで 5 分。
コードベースの認識。GitHub リポジトリをインポートするかローカルディレクトリを添付すると、プロトタイプがあなたの実際のコンポーネント、トークンシステム、規約を使います。
ブランド統合。デザインシステムを一度セットアップすれば、すべてのプロジェクトが自動的にカラー、タイポグラフィ、コンポーネントパターンを取り込みます。
Claude Code への引き渡し。「これをビルドする」ボタンで、同じブラウザタブ内でプロトタイプを本番対応のコードへ。

エクスポートには Canva、PDF、PPTX、HTML、スタンドアロン URL が含まれます。料金は抱き合わせ——Claude Pro が 20 ドル、Max が 100〜200 ドル、Enterprise はおなじみの問い合わせ制ティア。現在は有料の Claude サブスクライバー向けのリサーチプレビューです。

公式チュートリアルを読むと、Anthropic が説明するワークフローは Open Design が出しているものと同じです——ブリーフ、方向性、成果物、引き渡し。違いはひとつ下のレイヤーに存在します。

どこであなたをロックインするのか

Claude Design には、最初に名指ししておく価値のあるロックインが 4 つあります。マーケティングページは語ってくれないからです。

モデルは固定。すべてのレンダリングは Claude を通ります。Claude またはあなたがすでに支払い済みのモデル、ではなく——ただ Claude だけです。チームが GPT、Gemini、DeepSeek と契約していたり、機密性の高いブリーフのために Ollama でセルフホストしていたりするなら、そうしたワークフローは移行できません。トークンコストは永遠に Anthropic の価格曲線に乗ります。

ランタイムはホスト型。あなたのプロンプト、デザインシステム、コードベースのコンテキストはすべて Anthropic のサーバーへ渡ります。エージェンシーの仕事や NDA 下のローンチ前クリエイティブにとっては、毎回が調達の話し合いになります。リサーチプレビューではセルフホストは選択肢になく、発表もそれを約束していません。

スキルはあなたのものではない。Claude Design の振る舞いは Anthropic の内部にあるプロンプトとツールによって定義されます。フォークすることも、監査することも、どれかを置き換えることもできません。Anthropic が Claude Skills で出している「スキル」は隣接するものですが別物で、デザイン専用のツールは内部のものです。

請求はサブスクリプション。1 シートあたり月額 20〜200 ドルは、ソロデザイナーには問題ありませんが、20 人のチームには痛く、同じワークフローを採用しようとするオープンソースの十数人の貢献者には論外です。

これらはどれも Claude Design のバグではありません。ホスト型製品の形そのものです。Anthropic は中央値の Pro サブスクライバーに最適化しました。私たちは中央値の Pro サブスクライバーではありません。

黒いファセットの雲の立体が、破線で小さな地面のアンカーとサーバーブロックに繋ぎ止められている、暖色系のエディトリアルな習作プレート — デフォルトでホスト型——あなたのプロンプト、デザインシステム、コードベースのコンテキストは、誰か他人のサーバーへ渡ります。

オープンソースの代替

Open Design（このサイト）は別の賭けです。Claude Design のクローンではありません——あなたがすでに使っているコーディングエージェントをデザインエンジンに変える、薄いスキルレイヤーです。4 つのプリミティブはスキル、システム、アダプター、そしてデーモンです。すべてのスキルは SKILL.md ファイル。すべてのデザインシステムは DESIGN.md ファイル。すべてのエージェントアダプターは約 80 行の TypeScript です。

今日、箱に入って出荷されるもの。

123 個のスキル——デッキジェネレーター、モバイルモックアップ、エディトリアルページ、Word/Excel/PPT、ブランド探索
148 個のデザインシステム——Linear、Vercel、Stripe、Apple、Cursor、Figma のポータブルな Markdown 版、それにロングテール
16 個のコーディングエージェント CLI をあなたの $PATH 上で自動検出——Claude Code、Codex、Cursor、Gemini、OpenCode、Copilot、Devin、Hermes、Pi、Kimi、Kiro、Qwen、DeepSeek TUI、Qoder、Mistral Vibe、Kilo
4 ステップの固定ワークフロー——質問フォーム → 方向性ピッカー → ライブプランストリーム → サンドボックス化された iframe プレビュー
デフォルトで BYOK——任意の OpenAI 互換の base_url とキーを貼り付ければ、あなたのトークンはプロバイダーへ直行します
Apache-2.0、サインアップ不要、pnpm tools-dev で動作

メンタルモデル：Claude Design は製品。Open Design はレイヤー。

計測された基準線の上に黒いファセットの多面体が 3 つ、1 つだけがブラケットフレームにはめ込まれ、残りはゆるく置かれている、暖色系のエディトリアルな習作プレート — Claude Design はモデルを固定します。オープンな道は、あなたがすでに支払っているモデルを持ち込ませてくれます。

並べて比較

	Claude Design	Open Design
ライセンス	プロプライエタリ	Apache-2.0
ランタイム	ホスト型（Anthropic）	ローカルデーモン（`pnpm tools-dev`）＋オプションの Vercel デプロイ
モデル	Claude のみ	任意の OpenAI 互換エンドポイント＋検出された 16 個の CLI
スキル	内部	フォーク可能な 123 個の `SKILL.md` フォルダ
デザインシステム	プロジェクトごとのブランドセットアップ	ポータブルな 148 個の `DESIGN.md` ファイル
コードベースのコンテキスト	GitHub インポート＋ローカル	スキルレベル、実際の作業ディレクトリ
料金	20 ドル / 100 ドル / 200 ドル / Enterprise	無料。モデルプロバイダーに直接支払う
引き渡し	Claude Code（アプリ内）	`$PATH` 上の任意のエージェント、加えて HTML / PDF / PPTX / ZIP エクスポート
セルフホスト可能	不可	可（ラップトップまたは Vercel）
データの経路	プロンプト → Anthropic	プロンプト → あなたが選んだプロバイダー。私たちを経由するものは何もない

率直なまとめ：Claude Design は最も洗練された単一製品の体験を持っています。Open Design はその洗練された単一製品の表面を、ライブラリと引き換えにします——より多くのスキル、より多くのシステム、より多くのエージェント、あなたのラップトップにすでにあるエージェントと組み合わせて使えるように設計されています。

薄い黒のスラブが 3 枚、レイヤースタックのように隙間を見せてアイソメトリックに積み重なり、隙間を寸法目盛りが示し、上にオリーブの葉、暖色系のエディトリアルな習作プレート — 製品とレイヤー——Open Design はあなたのエージェントとデザイン作業の間に位置します。

誰が何を選ぶべきか

あなたが…なら	選ぶべきは
すでに Claude Pro を使っている会社のソロ PM で、昼食前にプロトタイプが必要	Claude Design。月額 20 ドルはサンクコスト。インターフェースは本当に速い。
Anthropic がすでに調達を通っているエンタープライズのデザインチーム	Claude Design。統合コストは一度払った。使い倒そう。
「無料の Claude Design」が欲しいソロデザイナー	Open Design。無料で、ワークフローを借りるのではなく所有できる——すでに支払っているモデルに向けて設定すれば、最初のデッキはおよそ 10 分。
すでにターミナルから Claude Code、Codex、Cursor を動かしているデザインエンジニア	Open Design。あなたのエージェントがデザインエンジン。スキルレイヤーは新しいアプリなしにセンスと構造を加えます。
BYOK、プロジェクト途中でのモデル切り替え、機密ブリーフのためのローカル専用が必要な人	Open Design。現実はマーケティングより荒削りですが、実際に守られる契約はこれだけです。
プロジェクトが採用できる新しいデザインスキルを出したいオープンソースの貢献者	Open Design。フォルダを置き、デーモンを再起動し、PR を送る。
ツールの入れ替わりを生き延びるポータブルなデザインシステムで標準化するチーム	Open Design。`DESIGN.md` ファイルは、それを読むツールより長生きします。

ほとんどのチームにとって決め手になる軸は、品質ではありません。ワークフローを借りたいか、それとも所有したいか、です。

次にすべきこと

Pro サブスクリプションにお金を使う前に、ワークフローを所有するとはどういう感覚かを見てみたいなら、3 コマンドのクイックスタートを実行し、すでに支払っているモデルに向けて設定してみてください。すべてが 1 つのリポジトリに収まっていて、最初のデッキはおよそ 10 分です。

オープンソースのワークフローを試す。