你定方向——让 agent 干生产
你定系统和标准，agent 渲染屏幕、状态、变体、高保真稿。少推方块，多决定什么叫好。
一句话
Open Design 是不会累的生产助手：你定义设计系统、把控品味；agent 生成其余的，贴合系统、就在你的 repo 里。
设计师怎么用 Open Design
- 01
把系统编码
把品牌变成一份 DESIGN.md——字号体系、颜色、间距、组件、语气。这是 agent 遵守的事实来源。
- 02
生成长尾
那些你本来要手搭的屏幕、状态、变体——agent 贴合系统渲染，无聊的 80% 几分钟搞定。
- 03
指挥并打磨
用语言点评——「收紧间距、空状态做暖一点」。你保留最终决定权，agent 做迭代。
设计师能指挥什么
原型 查看完整提示词 → Web Prototype Taste 编辑风格
极简编辑风格网页原型。暖色单色调画布，衬线标题配无衬线正文，1px 细线边框，柔和粉彩色块，大量留白，微妙动效。
原型 查看完整提示词 → Web Prototype Taste Brutalist
瑞士工业印刷风格网页原型。新闻纸画布、黑色粗体字、溢出式数字、细线网格分隔、危险红强调色、ASCII 语法装饰。源自 Leonxlnx/taste-skill `brutalist-skill`（瑞士工业印刷模式）。
原型 查看完整提示词 → 移动端引导
多屏幕移动引导流程，呈现为三个并排的手机框架——启动页、价值主张、登录页。包含状态栏、滑动指示点和主要CTA按钮。适用于需要'移动端引导'、'iOS引导'、'手机注册'或'移动端引导'的场景。
原型 查看完整提示词 → 线框草图
手绘风格的线框图，包含方格纸背景、马克笔/铅笔质感、多标签页变体、便签注释、图表占位符和阴影填充。适用于「线框图」「草图线框」「手绘」「低保真」「白板」「草稿」「手绘原型」等需求。
原型 查看完整提示词 → Web Prototype Taste Soft
Apple 级柔和风格网页原型。银灰/奶油色画布，双边框卡片，嵌套按钮 CTA，大圆角，弹性动效和环境网格。基于 Leonxlnx/taste-skill 的 soft-skill 及第 4-8 节。
图像 查看完整提示词 → 图像海报
用于海报、主视觉和编辑插图的单图生成工具。默认使用 gpt-image-2，但支持通过上游工具切换至 Flux、Imagen 或 Midjourney。输出为保存到项目文件夹的 PNG/JPEG 文件。
用 Open Design 做设计 vs. 纯手工
| 你需要什么 | 用 Open Design | 手工设计工具 |
|---|---|---|
| 搭建设计系统 | ●一份 agent 处处套用的 DESIGN.md | 一个每个工具手维护的组件库 |
| 产出变体和状态 | ●从 prompt 贴合系统生成 | 复制画板、逐个调 |
| 高保真稿 | ●渲染成真实 HTML，不是扁平 mockup | 工程还要重建一遍的像素活 |
| 保持一致 | ●一套系统、自动强制 | 靠人工自律，时间一长就跑偏 |
| 交接 | ●产物即代码——没有翻译断层 | 规格文档和标注 |
agent 从指挥渲染出的高保真、贴合系统的作品。挑一个接近你风格的，打磨它。
设计师常见问题
-
01 这会取代我吗？
不会——它取代的是苦工。你定系统和品味，agent 干重复生产，你把时间花在只有你能做的决定上。
-
02 我怎么把控样子？
你的 DESIGN.md 就是契约。agent 在其中渲染，你用语言点评直到对为止。
-
03 产出可编辑/真实吗？
是真实的 HTML/CSS，不是扁平导出——直接带进生产，而不是被重建。
-
04 可以用哪些 agent？
Claude Code、Codex、Cursor Agent、Gemini CLI 等一方适配，自带 provider 密钥。
今晚就指挥你的下一个设计
给 repo 点个 star、装上 Open Design，让 agent 干生产、你来把控品味——在你本来就用的 agent 里。