大家好！我是瓜哥。前互联网技术副总裁，现在带队死磕 AI 编程。
这篇文章聊聊 AI 编程里的：视觉黑洞。
现在的 Agent 和 大模型确实越来越强，逻辑给满分。
但如果你不给它视觉指导，它写出来的网页往往长得土里土气，透着一股浓郁的 AI 味。就像一个逻辑严密的装修师傅，如果你不给他图纸，他只会给你刷白墙、装白炽灯。
比如：我昨晚在跑的一个小项目：面向12岁以下小朋友的 AI 文生图应用。
最近，我深度实操了两款彻底改变 AI 审美的工作流工具：awesome-design-md 和 ui-ux-pro-max-skill。
它们分别代表了 静态复刻 与 动态设计 的两大极端。
是目前解决 AI 审美拉胯最有效的两个药方。
01 / 审美补丁：awesome-design-md
简单来说，这是一个专门给 AI 编程助手看的 大厂审美说明书 库。
它由 VoltAgent 团队维护，核心理念非常纯粹：AI 不需要看复杂的 Figma 原型，它最擅长阅读的是具备语义化的 Markdown。
在这个库里，每一个文件夹都是一份顶级品牌的审美资产：
- Apple：极致留白、高级感、Weight-300 的轻盈。
- Stripe：程序员心目中的设计天花板，色彩华丽且极其专业。
- Linear：深色系磨砂感，极致的效率工具美学。
文件结构是双剑合璧。
DESIGN.md是核心说明书，规定了 Hex 颜色码、字号和间距。
preview.html是视觉目录，让你在写代码前先核对 AI 的理解是否跑偏。
当你把这份说明书丢进根目录，AI 就瞬间获得了大厂设计师的设计能力。它能精准叫出每一个颜色码，知道圆角该设为 8px 还是 12px。
02 / 范式转移：为什么是 Markdown？
这是一个极其硬核的转变：从给 人看的 Figma 进化到 给 AI 读的 Markdown。
这里引入了一个核心概念：Google Stitch 协议。
为什么 LLM（大语言模型）对 Markdown 的解析力远超 JSON 或 CSS 配置文件？
- 降维打击：一份 500 字的
DESIGN.md就能替代 100MB 的设计稿。AI 能瞬间理解页面表面层级（Surface Levels）这种高阶概念。
- 零配置解析：你不需要任何 Parser，直接丢进根目录，AI 就能在对话上下文里无缝引用。
这就是：设计即文档（Design-as-Doc）。
在 AI 时代，500 字的协议比 100 张截图管用。
03 / 设计大脑：UI/UX Pro Max
awesome-design-md是：像素级临摹，而 ui-ux-pro-max-skill 是为 AI 装上了一个设计师的大脑。
它不仅提供模版，还提供推理规则。它内置了 99 条 UX 准则和 161 种行业配色方案。
当你要求它设计一个‘银行应用’时，它会自动匹配稳重的深蓝色调，并强制检查点击元素的对比度。
它最硬核的地方在于自动补全 UX 细节。
比如，它会自动为你的按钮添加 cursor-pointer，为过渡动画设置 150ms 的 呼吸感 时长。
目前这套系统的设计逻辑已经接近一个工作两三年的初级 UI 设计师。而且，它支持 15 种主流技术栈的自动生成。
04 / 实战：两种流派的视觉对决
为了验证效果，我选了两个真实的任务，分别调用这两种力量进行‘视觉注入’。
任务 A：Harness Engineering（复刻 Apple 风格）
我通过 awesome-design-md 引入了 Apple 的规范。
提示词： 请参考根目录下的 DESIGN.md。核心调性要极致克制，使用 SF Pro 字体层级，保持 Weight-300 的轻盈感。不要添加任何多余的装饰。
design.md 作品
ui/ux pro max 作品
AI 几乎完美复刻了 Apple 那种贵气的留白感。用来生成官网和产品介绍页，无敌了。
相比较而言，我更喜欢 ui/ux pro max 的作品。
任务 B：Context Engineering（硬核极客风格）
我激活了 ui-ux-pro-max-skill 专家引擎。
提示词： 激活专家能力。应用 Linear.app 风格的磨砂感设计。选择行业匹配的赛博深蓝配色。必须通过 99 条 UX 准则检查。'
design.md 作品
ui/ux pro max 作品
生成的是一个极具张力的黑客风仪表盘。提示词约束比较强，做个版本除了在色系上不同，都很好的完成任务。
你更喜欢哪个版本呢？
05 / 写在最后：约束带来自由
把这两个放在一起，并不是一定要比较出谁强谁弱，而是揭示作为非设计出身，如何借助工具提升我们的作品美观度。
- 如果你追求 极致的复刻，想让你的产品瞬间拥有 Apple 的皮囊，直接去
design.md库里拷贝文件。
- 如果你正在构建一个 复杂的专业工具，需要 AI 帮你处理交互逻辑，
ui-ux-pro-max插件是更好的选择。
Agent 时代，真正的设计自由，是在 AI 无法理解美感时，学会给它戴上约束的镣铐。未来的 UI 交付将不再是画图，而是编写审美规则集。
别让平庸的 UI 浪费了你精妙的代码逻辑。
开始创建你的 design.md 吧。
提交反馈
图文500 字 vs 100MB：为什么 Design.md 正在杀掉 Figma？
评论区
暂无公开评论还没有公开评论。