Claude Design 的開源替代方案

Claude Design 很不錯。但它同時也是閉源的、只能託管使用，並且綁定在 Claude 訂閱裡。這篇文章誠實地分析：什麼時候該選它，什麼時候開源路線才是贏家。

Claude Design 很不錯。我們在真實的設計需求上用過它。我們之所以選擇打造一層開源的方案，並不是因為 Anthropic 做出了一個糟糕的工具——他們沒有。而是因為閉源、只能託管、每月 20 到 200 美元的設計工具，對於設計工作未來十年的形態而言是錯的。這篇文章是來自同一個賽道團隊對 Claude Design 的誠實解讀：它是什麼、它在哪裡把你鎖死、開源替代方案實際長什麼樣，以及這一季你該選哪一個。

Claude Design 究竟是什麼

Claude Design 於 2026 年 4 月從 Anthropic Labs 推出。它是一款由 Claude Opus 4.7 驅動的對話式設計工具：左邊聊天、右邊畫布。你描述想要什麼，Claude 生成一份設計，然後你透過評論、行內編輯和提示詞調整來迭代。

它有四件事做得很好：

從文字生成原型。引導流程、設定頁、後台管理面板、結帳變體——從提示詞到可互動畫面只要五分鐘。
程式碼庫感知。匯入一個 GitHub repo 或掛載本地目錄，原型就會使用你真實的元件、你的 token 系統、你的慣例。
品牌整合。設定好一次設計系統，之後每個專案都會自動沿用其中的顏色、字體和元件樣式。
交接給 Claude Code。「build this」按鈕在同一個瀏覽器分頁裡把原型帶到可上線的程式碼。

匯出格式包含 Canva、PDF、PPTX、HTML 以及獨立 URL。定價是綁定式的——Claude Pro 20 美元、Max 100 至 200 美元、Enterprise 則是慣常的「請洽詢」等級。它目前是面向付費 Claude 訂閱者的研究預覽版。

如果你讀過官方教學，Anthropic 描述的工作流程跟 Open Design 提供的一模一樣：一份需求、一個方向、一件產物、一次交接。差異藏在下面一層。

它在哪裡把你鎖死

Claude Design 帶著四道值得先講清楚的鎖定，因為行銷頁面不會講。

模型是固定的。每一次渲染都走 Claude。不是 Claude 或你已經付過費的某個模型——就只有 Claude。如果你的團隊跟 GPT、Gemini 或 DeepSeek 有合約，或者你為了敏感需求在 Ollama 上自架，那些工作流程都無法轉移。Token 成本永遠跟著 Anthropic 的定價曲線走。

執行環境是託管的。你的提示詞、你的設計系統、你的程式碼庫上下文,全都會傳到 Anthropic 的伺服器。對於代理商工作或受 NDA 約束的上市前創意而言,那每次都是一場採購對話。在研究預覽版裡自架不是一個選項,而公告也沒有承諾會有。

那些 skills 不屬於你。Claude Design 的行為由活在 Anthropic 內部的提示詞和工具定義。你無法 fork 它們、稽核它們,或替換其中任何一個。Anthropic 在 Claude Skills 裡推出的那些「skills」是相鄰但獨立的;設計專用的工具是內部的。

帳單是訂閱制。每席每月 20 至 200 美元,對單人設計師沒問題,對二十人的團隊就很痛,對於原本會採用同一套工作流程的十幾位開源貢獻者來說則根本行不通。

這些都不是 Claude Design 的 bug。它們是託管產品的形態。Anthropic 是為中位數的 Pro 訂閱者做最佳化。我們不是中位數的 Pro 訂閱者。

一個黑色多面體雲團，以一條虛線繫在一個小小的地面錨點和伺服器方塊上，置於暖色調的編輯式研究底版上 — 預設託管：你的提示詞、設計系統和程式碼庫上下文，都傳到別人的伺服器上。

開源替代方案

Open Design（就是本站）是一個不同的賭注。它不是 Claude Design 的複製品——它是一層薄薄的 skill 層,把你已經在用的編碼 agent 變成一台設計引擎。四個基本元件是 skills、systems、adapters 和 daemon。每個 skill 都是一個 SKILL.md 檔案。每個設計系統都是一個 DESIGN.md 檔案。每個 agent adapter 大約 80 行 TypeScript。

今天開箱即附的內容：

123 個 skills——投影片產生器、行動端 mockup、編輯式頁面、Word/Excel/PPT、品牌探索
148 套設計系統——Linear、Vercel、Stripe、Apple、Cursor、Figma 的可攜 Markdown 版本,外加一條長尾
自動偵測你 $PATH 上的 16 個編碼 agent CLI——Claude Code、Codex、Cursor、Gemini、OpenCode、Copilot、Devin、Hermes、Pi、Kimi、Kiro、Qwen、DeepSeek TUI、Qoder、Mistral Vibe、Kilo
四步鎖定式工作流程——問題表單 → 方向選擇器 → 即時計畫串流 → 沙箱化的 iframe 預覽
預設 BYOK——貼上任何 OpenAI 相容的 base_url 和金鑰,你的 token 直接走向供應商
Apache-2.0、免註冊、用 pnpm tools-dev 就能跑

心智模型：Claude Design 是一個產品。Open Design 是一個層。

三個黑色多面體立於一條量好的基準線上，只有一個嵌進了支架框中，其餘的則鬆散擺放，置於暖色調的編輯式研究底版上 — Claude Design 把模型固定死。開源路線讓你帶上你已經在付費的那一個。

並排對照

	Claude Design	Open Design
授權條款	專有	Apache-2.0
執行環境	託管（Anthropic）	本地 daemon（`pnpm tools-dev`）+ 可選的 Vercel 部署
模型	僅限 Claude	任何 OpenAI 相容端點 + 16 個偵測到的 CLI
Skills	內部	123 個可 fork 的 `SKILL.md` 資料夾
設計系統	逐專案的品牌設定	148 個可攜的 `DESIGN.md` 檔案
程式碼庫上下文	GitHub 匯入 + 本地	skill 層級、真實工作目錄
定價	20 / 100 / 200 美元 / Enterprise	免費；你直接付費給你的模型供應商
交接	Claude Code（應用內）	`$PATH` 上的任何 agent,外加 HTML / PDF / PPTX / ZIP 匯出
可自架	否	是（筆電或 Vercel）
資料路徑	提示詞 → Anthropic	提示詞 → 你選的供應商;沒有任何東西經過我們

誠實的總結：Claude Design 擁有最精緻的單一產品體驗。Open Design 用精緻的單一產品表層,換來一座資料庫——更多 skills、更多 systems、更多 agents,設計上就是要跟你筆電上已有的 agent 組合在一起。

三片薄薄的黑色板塊以可見的間隙等距堆疊，像一個分層堆疊，尺寸刻度標記著那些間隙，最上方放著一片橄欖葉，置於暖色調的編輯式研究底版上 — 一個產品和一個層——Open Design 坐落在你的 agent 與設計工作之間。

誰該選哪一個

如果你是……	選
一家公司裡的單人 PM,公司已經在用 Claude Pro,而你需要在午餐前生出一個原型	Claude Design。那 20 美元/月已經是沉沒成本;介面是真的快。
一個企業設計團隊,Anthropic 已經通過了採購流程	Claude Design。整合成本你已經付過一次了;就把它用好。
一個想要「免費版 Claude Design」的單人設計師	Open Design。免費,而且你擁有這套工作流程而不是在租它——把它指向一個你已經在付費的模型,第一份投影片大約十分鐘搞定。
一個已經在終端機裡駕馭 Claude Code、Codex 或 Cursor 的設計工程師	Open Design。你的 agent 就是設計引擎;skill 層在不引入新應用的情況下加進了品味與結構。
任何需要 BYOK、需要在專案中途切換模型,或為敏感需求純本地運行的人	Open Design。現實比行銷更粗糙,但這份契約是唯一真正站得住腳的。
一個想要交付一個專案能採納的新設計 skill 的開源貢獻者	Open Design。丟進一個資料夾、重啟 daemon、送出 PR。
一個正在標準化一套能在工具更迭中存活的可攜設計系統的團隊	Open Design。`DESIGN.md` 檔案比讀取它的工具活得更久。

對大多數團隊而言,真正決定勝負的維度不是品質。而是你寧願租這套工作流程,還是擁有它。

接下來怎麼做

如果你想在花一筆 Pro 訂閱費之前,先感受擁有這套工作流程是什麼滋味,就跑一下這個三行指令的快速上手,然後把它指向你已經在付費的模型。整套東西就裝在一個 repo 裡,第一份投影片大約十分鐘搞定。

試試這套開源工作流程。