Anthropic 的 Claude Design 发布没多久，GitHub 上便迅速出现了开源复刻版。
4 月 17 日，Anthropic 正式上线了 Claude Design，基于 Opus 4.7 模型。
只需输入一句话，即可直接生成可交付的设计成品——不是草图，不是线框图，而是完整的 HTML 页面、PPT 或移动端原型。
效果极为震撼，迅速引爆了话题。
11 天后，nexu-io 团队将 Open Design 项目开源。
目前该项目已接近 2 万星。
01
开源项目简介
Open Design 是 Claude Design 的开源替代方案。
但它本身不包含 AI 模型，其核心功能是将你电脑上已安装的 Coding Agent 转变为设计引擎。
当你输入一条需求，例如“帮我制作一个杂志风格的官网”，系统会先弹出一个表单来确认你的需求，包括目标平台、受众、调性、品牌等。
随后，Agent 会从 5 套视觉方向中挑选一个，生成一份实时 Todo 计划，并在你的电脑上创建真实的项目目录。
它会读取模板、编写 CSS、生成 HTML，最后在沙盒 iframe 中渲染出结果。整个过程你可以随时介入并纠正偏差。
输出结果不是截图或草图，而是完整的单文件 HTML，支持直接导出为 HTML、PDF、PPTX 或 ZIP 格式。
Claude Code、Codex、Cursor、OpenCode 等工具均可使用，哪个已安装就用哪个。
内置 19 个可组合的 Skill 以及 71 套品牌级 Design System。
可以将其视为将你手中最强的 Coding Agent 接入设计工作流的中间层。
- 开源地址：github.com/nexu-io/open-design
02
工作原理是什么
该项目架构分为两层：浏览器中运行一个 Next.js Web 界面，你电脑本地则运行一个 Node daemon 服务。
核心流程如下：
你输入需求后，daemon 会将 SKILL.md 设计能力描述和 DESIGN.md 品牌风格规范拼装进提示词栈，然后通过 stdio 调用你机器上的 coding agent CLI 来执行。
Agent 拥有真实文件系统权限，它会真实地在你的电脑上读取模板文件、用 grep 查找 CSS 中的十六进制色值、编写 brand-spec.md、生成 HTML 和图片。
这不是虚拟沙盒，也不是内存模拟。
Agent 完成一轮后，daemon 会将生成的 HTML 放入沙盒 iframe 中进行实时预览。你可以在界面上直接编辑文件，也可以一键导出为 HTML、PDF、PPTX 或 ZIP 格式。
你拥有什么 Agent，它就使用什么 Agent
Daemon 启动时会自动扫描 PATH，检测你安装了哪些 CLI 工具。
它不绑定任何特定模型，每一层都采用 BYOK（自带密钥）模式。
Claude Design 仅支持 Opus 4.7，而 Open Design 可以使用你手中最强的那个 agent。
消除 AI 痕迹的提示词工程
该项目在提示词层面做了大量工作，以防止 AI 生成那些一眼就能看穿的设计。
在开始生成之前，会先弹出一个初始化问题表单，让你选择 surface、受众、调性、品牌上下文。
只需 30 秒即可完成勾选，比反复调整需求高效得多。
输出之前，还会进行一次五维自评审，AI 会自己给自己打分，低于 3 分的维度需要重做。
此外，还有一份 slop 黑名单：暴力紫渐变、通用 emoji 图标、手绘 SVG 真人脸、将 Inter 用作 display 字体等，全部被明令禁止。
如果没有真实数字，就使用破折号代替，绝不编造数据。
71 套 Design System + 19 个 Skill，开箱即用
71 套品牌设计系统，包括 Apple、Stripe、Vercel、Airbnb、Tesla、Notion、Cursor、Figma 等，直接从下拉框中选择，切换后下一次渲染就会使用新的 token。
19 个 Skill 覆盖网页原型、杂志风格 PPT、Dashboard、移动端原型、定价页、邮件营销、社交媒体轮播图等多种场景。
03
如何快速上手
只需三条命令：
git clone https://github.com/nexu-io/open-design.git
cd open-design
pnpm install && pnpm dev:all
最简单的方式是将开源项目交给你的 Agent，让它自行安装。
启动后，打开 localhost:3000，选择一个 Skill、一套 Design System，输入需求，然后按回车键。
系统会先弹出一个问题表单让你锁定需求，随后 agent 开始工作，
实时 todo 卡片会流入 UI，最终在沙盒 iframe 中渲染出成品。
支持导出为 HTML、PDF、PPTX 或 ZIP 格式。
关注“鲸栖”小程序，掌握最新AI资讯
本文来自网络搜集，不代表鲸林向海立场，如有侵权，联系删除。转载请注明出处：https://www.itsolotime.com/archives/33330
