2026 年 4 月 Anthropic 发布 Claude Design 之后，开源社区迅速做出了回应。nexu-io/open-design 项目在发布后即获得大量关注，其核心主张并非重复造轮子，而是将用户本地已有的最强编码代理变成设计引擎。本文将深入解析这一设计自动化框架的架构设计与实现路径，为意图构建类似系统的团队提供可落地的技术参数与关键决策点。
设计意图捕获：交互式表单与方向选择器
传统 AI 设计工具往往直接接收自然语言描述并开始生成代码，这种方式的根本问题在于：设计决策的维度远超出一次性描述所能承载的信息量。Open Design 强制规定了一个关键规则 —— 每个设计请求必须以交互式表单开始，而非直接生成代码。这一设计决策来源于 huashu-design 项目的 Junior-Designer 模式，其核心逻辑是：将设计问题拆解为表面层、受众、语调、品牌上下文、规模与约束六个维度，在模型实际编写任何像素之前完成需求锁定。
交互式表单的实现位于应用层，当用户输入类似「帮我做一个杂志风格的融资演示文稿」这样的请求时，系统首先弹出一个结构化表单而非直接调用代理。表单包含的场景参数与 SKILL.md 中定义的 skill 行为模式对应，形成需求层到执行层的映射。当用户没有现成品牌规范时，系统会触发第二轮表单 —— 方向选择器，提供五个预置视觉方向：Editorial Monocle（编辑风格）、Modern Minimal（现代极简）、Tech Utility（技术实用）、Brutalist（粗野主义）与 Soft Warm（柔和温暖）。每个方向携带确定性参数：OKLch 色彩空间的具体色值、字体栈、设备框架样式，代理直接使用这些参数而非自由发挥，从根源上抑制了所谓的 AI Slop（AI 垃圾设计）。
这一机制的关键工程参数包括：表单字段数控制在 6 至 8 个确保 30 秒内完成、方向选择器的色值必须使用 OKLch 色彩空间（ perceptual uniformity 优于 HSL）、字体栈必须指定具体 typeface 而非 generic family。这些约束通过 prompt stack 的 DISCOVERY 指令层注入，任何 SKILL.md 加载时自动继承。
代理层架构：PATH 扫描与多 CLI 适配
Open Design 的核心创新在于不捆绑特定 AI 代理，而是在运行时扫描用户 PATH 环境变量，自动发现并注册可用的编码代理 CLI。当前支持 12 种代理：Claude Code、Codex CLI、Devin for Terminal、Cursor Agent、Gemini CLI、OpenCode、Qwen Code、GitHub Copilot CLI、Hermes（ACP）、Kimi CLI（ACP）、Pi（RPC）与 Kiro CLI（ACP）。这一设计借鉴了 multica 项目的 daemon 架构思路 —— 将代理视为可替换的计算资源而非绑定关系。
每个代理的适配逻辑封装在 apps/daemon/src/agents.ts 中，核心难点在于处理不同 CLI 的输出格式差异。Claude Code 使用 claude-stream-json 格式输出结构化事件流，Copilot CLI 使用 copilot-stream-json，Codex 与 Gemini 等使用通用的 json-event-stream 但需要针对各 CLI 实现 eventParser，ACP 协议的代理（Devin、Hermes、Kimi、Kiro）使用 acp-json-rpc，Pi 使用自定义的 pi-rpc 协议，Qwen Code 则使用 plain 模式直接输出原始文本块。Daemon 根据 PATH 扫描结果动态构建 AGENT_DEFS 配置表，并在用户切换代理时即时切换适配器。
一个关键的工程细节是 Windows 平台的 argv 长度限制。当组合后的 prompt 超过约 32KB 时，CreateProcess 的命令行参数会溢出。Open Design 对此的解决方案是：对于 Codex、Gemini、OpenCode、Cursor Agent、Qwen、Pi 等 CLI，将 prompt 通过 stdin 而非命令行参数传入。Claude Code 和 Copilot 保持 -p 参数模式，当两者均超出限制时，daemon 会将 prompt 写入临时文件并通过文件路径引用。SSRF 防护层面，BYOK 代理路径（/api/proxy/stream）在 daemon 边缘即拒绝 loopback、link-local 与 RFC1918 地址。
技能系统：SKILL.md 约定与可组合性
Open Design 的技能系统直接采用了 Claude Code 的 SKILL.md 约定，同时通过自定义 od: frontmatter 扩展了平台特定能力。每个 skill 目录下包含 SKILL.md 主文件、assets/ 资源文件夹与 references/ 参考文件夹。Daemon 启动时扫描 skills/ 目录，解析每个 SKILL.md 的 frontmatter 并注册到 /api/skills 端点。添加新 skill 只需创建文件夹并放入符合约定的文件，重启 daemon 后自动出现在技能选择器中。
当前内置 31 个技能，分为 prototype 模式（27 个）与 deck 模式（4 个）两类。Prototype 模式产出单页 artifact，包括 web-prototype（默认原型）、saas-landing、dashboard、mobile-app、social-carousel、magazine-poster、motion-frames、sprite-animation、email-marketing、dating-web、gamified-app、mobile-onboarding、digital-eguide、wireframe-sketch、critique、tweaks、pm-spec、team-okrs、meeting-notes、kanban-board、eng-runbook、finance-report、invoice 与 hr-onboarding。Deck 模式产出横向滑动演示文稿，默认使用 guizang-ppt 技能（集成自 op7418/guizang-ppt-skill），另有 simple-deck、replit-deck 与 weekly-update。
每个 skill 的前端注入通过 prompt stack 的 active SKILL.md 层实现。发送请求时，composeSystemPrompt 函数将以下层级组合为最终 prompt：DISCOVERY 指令（turn-1 表单、turn-2 品牌分支、TodoWrite、五维批判）、identity charter（OFFICIAL_DESIGNER_PROMPT、anti-AI-slop 规则、junior-pass 校验）、active DESIGN.md（当前选中的设计系统）、active SKILL.md（当前选中的技能）、project metadata（kind、fidelity、speakerNotes、animations、inspiration ids）、skill side files（自动注入的 assets/template.html 与 references/*.md 内容），对于 deck 类型还有 DECK_FRAMEWORK_DIRECTIVE。这种组合式 prompt 架构使得同一代理可以胜任截然不同的设计任务，只需切换注入的技能上下文。
设计系统层：DESIGN.md 可移植规范
设计系统采用 Markdown 文件格式存储，而非常见的 JSON 主题配置。这一选择的核心考量是可读性与可编辑性 —— 设计师可以直接阅读 DESIGN.md 内容，修改色值或字体后即时生效。Schema 来源于 VoltAgent/awesome-design-md 项目的九段式规范：color（色彩）、typography（字体）、spacing（间距）、layout（布局）、components（组件）、motion（动效）、voice（语调）、brand（品牌）、anti-patterns（反模式）。
开箱即用的 72 个设计系统覆盖主要科技产品与品牌：AI 与 LLM 类（Claude、Cohere、Mistral、Replicate、Ollama、X.AI 等）、开发者工具类（Cursor、Vercel、Linear、Supabase、PostHog、Sentry 等）、生产力工具类（Notion、Figma、Miro、Airtable、Raycast 等）、金融科技类（Stripe、Coinbase、Binance、Kraken、Revolut 等）、电商与媒体类（Shopify、Airbnb、Spotify、Meta 等）以及汽车品牌类（Tesla、BMW、Ferrari、Lamborghini 等）。系统切换时，next render 直接读取新的 DESIGN.md 替换 :root 变量，无需重启服务。
设计系统还通过 scripts/sync-design-systems.ts 支持从上游 awesome-design-md 项目批量同步更新。57 个设计技能（Design Skills）直接引用自 bergside/awesome-design-skills 项目，作为 DESIGN.md 的扩展补充。
质量保障：五维自检与预发射检查
为确保输出质量不滑向 AI Slop，Open Design 内置了两层质量门禁。第一层是五维自检（Five-dimensional Self-Critique），代理在生成 前对产出进行哲学性（Philosophy）、层级性（Hierarchy）、执行度（Detail）、功能完整性（Function）与克制感（Restraint）五个维度的 1-5 分评分。任何维度低于 3 分被视为回归（regression），代理必须修复后重新评分，通常两轮迭代后可达到发射标准。这一机制直接集成在 prompt stack 的 DISCOVERY 指令层，通过 5-dim critique 脚手架实现。
第二层是 P0/P1/P2 清单检查。每个 skill 的 references/ 目录下包含 checklist.md 文件，定义了必须通过的硬性检查项。P0 为发射前置条件（如 HTML 语法有效性、必需的资源文件存在），P1 为强烈建议项，P2 为可选优化项。代理必须在通过所有 P0 项后才可输出 标签。Artifact Lint API（POST /api/artifacts/lint）提供结构化检查能力，检查结果可反馈给代理用于自检修正。
预览与导出：沙盒渲染与多格式输出
生成的 design artifact 通过 sandboxed iframe 实时渲染预览。具体实现使用 srcdoc 属性加载生成的 HTML，配合 skill 特定的 标签解析器（apps/web/src/artifacts/parser.ts）提取内容。预览环境与主应用隔离，避免安全问题。
导出格式覆盖主流需求：HTML（内联所有资源为单文件）、PDF（通过浏览器打印实现，deck 模式下自动适配横向分页）、PPTX（由 agent 驱动 skill 生成）、ZIP（打包项目文件）与 Markdown（纯文本导出）。File workspace 显示为下载 chips，用户可即时保存到本地。
工程化启示与可落地参数
对于计划构建类似设计自动化系统的团队，以下参数值得优先考量。代理发现层面，建议在 daemon 启动时执行一次 PATH 扫描并将结果缓存，动态切换代理的延迟应控制在 200ms 以内。Skill 加载层面，SKILL.md 的解析应在 daemon 启动时完成并持久化到内存，skill 数量增长到百级别时考虑 LRU 缓存。设计系统切换应实现为 O (1) 查找，当前实现通过文件系统读取实现，规模化后建议预加载到内存并监听文件变更热更新。
交互式表单的字段数建议控制在 6-8 个，完成时间目标为 30 秒以内，这与 Open Design 的实测数据一致。方向选择器的色彩规范必须使用 OKLch 而非十六进制，以避免 perceptual non-uniformity 导致的视觉不一致。质量门禁的五维评分阈值建议设定为：任一维度低于 3 分必须重做，这一参数来源于项目团队的消保测试。
资料来源：本文核心事实基于 nexu-io/open-design GitHub 仓库公开信息，技术架构细节参考项目 README 与源码结构。