Open Design：Claude Design 的开源替代方案

原文来源：Open Design GitHub — Anthropic Claude Design 的开源替代方案，33.3k Stars，3.7k Forks，支持 16 种编码 Agent、72 套品牌级设计系统。

Open Design（OD）是 Claude Design 的开源替代方案。Claude Design（Anthropic 于 2026 年 4 月 17 日发布，基于 Opus 4.7）展示了当 LLM 不再写散文而是直接交付设计产物时会发生什么——它迅速走红，但始终闭源、付费、仅限云端、锁定在 Anthropic 的模型和技能体系内。Open Design 要做的是同样的事，但完全开放。

核心差异

特性	Claude Design	Open Design
开源	❌	✅
自托管	❌	✅
Vercel 部署	❌	✅
模型选择	仅 Claude	16 种 Agent
设计系统	内置	71 套可选
费用	订阅制	BYOK 免费
产物导出	有限	HTML/PDF/PPTX/ZIP

Open Design 的核心理念是不自己造 Agent。最强的编码 Agent 已经装在你的电脑上了，Open Design 只是把它们接入一个技能驱动的工作流。这种 BYOK（Bring Your Own Key）模式意味着你可以使用自己已经付费或免费获得的模型能力，不需要为设计工具额外支付订阅费用。

支持的编码 Agent

Open Design 能自动检测 PATH 上的 16 种编码 Agent：

Claude Code、Codex CLI、Devin for Terminal、Cursor Agent、Gemini CLI、OpenCode、Qwen Code、Qoder CLI、GitHub Copilot CLI、Hermes (ACP)、Kimi CLI (ACP)、Pi (RPC)、Kiro CLI (ACP)、Kilo (ACP)、Mistral Vibe CLI (ACP)、DeepSeek TUI。

这个列表几乎覆盖了当前所有主流的终端编码 Agent。Open Design 通过统一的接口与这些 Agent 通信，让它们按照设计技能的要求生成代码。没有 CLI？Open Design 也提供 OpenAI 兼容的 BYOK 代理，走同样的流程，只是少了 spawn Agent 的步骤。

设计系统

项目内置 72 套品牌级设计系统，覆盖多种视觉风格。Agent 在生成产物前会先选择一套设计系统作为视觉基准，确保输出的一致性。这些设计系统不是简单的颜色板，而是包含排版规则、组件规范、交互模式的完整设计语言。

设计系统的存在解决了 AI 设计工具的一个核心问题：一致性。没有设计系统约束的 AI 输出往往风格飘忽不定，这次生成的按钮是圆角，下次变成直角，整体看起来拼凑感强烈。72 套预设设计系统让 Agent 有了明确的视觉方向，输出质量显著提升。

技能驱动的工作流

Open Design 的核心是**技能（Skills）**体系，当前包含 31 个可组合技能：

发现阶段

交互式问卷收集需求，Agent 选择视觉方向，TodoWrite 计划实时流式显示。这个阶段不是简单的"你要什么颜色"，而是通过结构化对话理解用户的品牌定位、目标受众、情感诉求。

构建阶段

Daemon 在磁盘上创建真实项目文件夹，包含种子模板、布局库和自检清单。Agent 不是生成一段代码就结束，而是构建一个完整的、可维护的项目结构。

审查阶段

Agent 执行五维自我审查，对照输出质量 checklist。这包括视觉一致性检查、交互逻辑验证、响应式适配确认、性能基准测试、无障碍合规审查。

交付阶段

生成单个 artifact 产物，在沙盒 iframe 中秒级渲染。用户可以立即预览、交互、测试，确认满意后再导出。

这不是"AI 尝试设计点什么"，而是一个被 prompt 栈训练成像资深设计师一样工作的 AI——拥有工作文件系统、确定性调色板库和 checklist 文化。

产物类型

Open Design 支持生成多种设计产物：

Web 原型

响应式网页、落地页、仪表盘。生成的代码可以直接部署，不是静态图片或不可编辑的输出。

桌面应用

跨平台 UI 原型，支持 Electron、Tauri 等框架的代码生成。

移动端

iOS / Android 界面设计，包含手势交互和适配规则。

幻灯片

杂志风格的演示文稿，不是传统的 bullet point 堆砌，而是注重视觉叙事的设计导向输出。

图片

品牌视觉、营销素材、社交媒体图形。

视频

基于 HyperFrames 的动态内容，支持简单的动画和转场。

所有产物支持导出为 HTML、PDF、PPTX、ZIP 或 Markdown，确保设计成果可以无缝融入现有工作流。

技术架构

Open Design 建立在四个开源项目之上：

huashu-design（alchaincyf/huashu-design）

设计哲学指南针，提供初级设计师工作流、5 步品牌资产协议、反 AI-slop 清单、五维自我审查。它定义了"好的 AI 设计"应该遵循的原则，避免生成看起来廉价、模板化的内容。其核心理念被提炼进 apps/web/src/prompts/discovery.ts。

guizang-ppt-skill（op7418/guizang-ppt-skill）

幻灯片模式，杂志风格布局、WebGL 英雄区、P0/P1/P2 检查清单。专门处理演示文稿的生成，注重视觉冲击力而非信息密度。以原始 LICENSE 保留的方式打包在 skills/guizang-ppt/ 下。

open-codesign（OpenCoworkAI/open-codesign）

UX 北极星和最近的同类开源项目。提供流式产物循环、沙盒 iframe 预览（基于 vendored React 18 + Babel）、实时 Agent 面板（todos + 工具调用 + 可中断生成）、五种格式导出（HTML / PDF / PPTX / ZIP / Markdown）。Open Design 在形态上有意与之不同——open-codesign 是捆绑 pi-ai 的桌面 Electron 应用，而 Open Design 是 Web 应用 + 本地 Daemon，委托给已有的 CLI 工具。

multica（multica-ai/multica）

Daemon 运行时架构，PATH 扫描 Agent 检测、本地 Daemon 作为唯一特权进程、Agent 即协作者的设计理念。负责 Agent 发现、任务调度和安全隔离。

部署方式

本地开发

code

pnpm tools-dev

完全本地运行，所有数据留在本机，适合注重隐私的场景。

Web 部署

支持 Vercel 部署 Web 层，让团队成员可以通过浏览器访问设计工具，而不需要每个人都配置本地环境。

Daemon 模式

本地 Daemon 作为唯一特权进程，Agent 以协作者身份运行。这种架构确保了安全性——Agent 没有直接访问系统的权限，所有操作都通过受控的 Daemon 中介。

与同类工具对比

特性	Open Design	Claude Design	v0
开源	✅	❌	❌
自托管	✅	❌	❌
模型选择	16 种	仅 Claude	仅 Claude
设计系统	71 套	内置	有限
费用	BYOK 免费	订阅	订阅
产物类型	6 种	有限	有限

适用人群

需要快速生成高保真原型的产品经理
希望用 AI 辅助品牌设计的创业者
追求设计一致性、厌倦 AI 输出"塑料感"的设计师
需要自托管设计工具、注重数据隐私的团队
想要复用已有模型订阅、不愿为设计工具额外付费的用户

Open Design 的出现标志着 AI 设计工具从"玩具"向"生产工具"的跨越。它设定的标准很高：不是让 AI 随便生成点什么，而是让 AI 像资深设计师一样工作——有流程、有标准、有审查。这种对质量的坚持，加上完全开放的架构，让它成为当前最值得关注的 AI 设计开源项目之一。