怎么把公司里的设计规范变成 Skill？
原文链接怎么把公司里的设计规范变成 Skill？
原文链接：https://mp.weixin.qq.com/s/VtZy3QSIoCNeuF5y4z2inA 作者：彩云Sky | 来源：彩云译设计
摘要
把公司零散的设计规范（UI KIT、品牌手册等）转化为 AI（Claude）可执行的 SKILL.md 文件，四步法：整理设计资产 → 丢给 Claude 生成初稿 → 人工校对补充（最关键） → 测试迭代。核心洞见——不能做清单对输出质量的提升甚至比要做什么更大。AI 工具的天花板取决于投喂的上下文质量。
背景与痛点
AI 生成的 UI 乍一看像那么回事，但真正落地不行——因为缺少具体设计规范约束，容易产生"Inter 字体加紫色渐变加白色背景的标准 AI 味设计"。
解决方案：给 AI 一份设计规范说明书——SKILL.md 文件。
作者以腾讯 TDesign Figma 组件库为案例，四步走。
第一步：整理现有设计资产规范
把 Figma、PDF、图片等格式的设计规范收集整理好。直接发 Figma 链接 AI 无法识别。
推荐做法： 将 Figma 组件库等导出成 PDF 文件，以便 AI 读取。
第二步：把文件丢给 Claude 生成初稿
提示词： "帮我把这些设计规范整理成一个 SKILL.md 文件，用于约束 AI 生成符合我们品牌规范的 UI。"
Claude 约两分钟生成初稿，包含色彩、字体、组件、间距等基本板块。
注意： 初稿就是初稿，没有一遍就搞定的 skill。
第三步：人工校对和补充（最关键）
作者逐一指出最容易出问题的几个地方：
1. 氛围描述（最重要）
很多人上来甩色值字号，但 AI 不知道这些数字组合起来是什么感觉。必须在文件开头用几段话描述整体视觉氛围。
- 以 TDesign 为例："稳健、专业、不张扬"
- 用大白话写，要具体——"高端大气"不如"大面积留白加深色系、产品图片高清无背景"具体
2. 颜色：不能只给色值，要分配角色和边界
"主色 #0052D9 用于核心交互元素和品牌强调……这个'仅用于'三个字特别重要，它告诉 AI 这个颜色的使用边界在哪。"
3. 字体：参数越详细越好
字体名、字号、行高、字重、字间距。偷懒少写行高，生成的标题会"松松垮垮"。
4. 组件样式：逐个写清楚
以按钮为例，精确到背景色、文字色、圆角、高度、内边距、字号、字重、以及禁用态等各种状态的具体参数。
5. 明确"不能做的事"（大杀器）
不能做清单对输出质量的提升甚至比要做什么更大。
案例：
- 不要在浅色卡片上用浅色文字
- 不要把品牌蓝用在非交互元素的装饰上
- 不要把底部导航超过 5 个 tab
第四步：测试和迭代
拿真实需求测试，发现问题回去修改 skill 文件。
案例：发现 AI 在生成列表项时用了品牌蓝做分割线，规范里应该是中性色 → 在"不能做"清单加规则。
每发现一个偏差，就回去补一条规则。跑上三五轮之后，AI 的输出越来越靠谱。
三大提效场景
- 快速出方案：产品经理突然要方案时，AI 按规范快速生成多个方向，设计师挑选精修，半天缩到一两个小时
- 批量生成重复页面：结构相似的页面（如不同品类详情页），AI 批量生成骨架，设计师只做差异化调整
- 设计走查：反向利用 skill，让 AI 审查已有的设计稿，识别色值、间距等规范问题
额外价值
"这整件事最大的价值可能不只是提效本身……把设计知识真正编码出来，会逼着你说清楚自己到底懂什么。这某种程度上，也是在审计你自己作为设计师的能力边界。"
AI 的作用不是替代设计师，是逼我们把模糊的经验变成清晰的规则。
"AI 工具的天花板的关键还是要看你喂给它的上下文质量。"