前端工程师经常要做「设计变量同步」这类事：把设计稿中的颜色、字号整理为设计变量。每次都从头写提示词，结果时好时坏；把它做成智能体 Skill，就能让智能体每次按同一套步骤执行，输出结构也更稳定。

通用版的「设计变量同步」能覆盖大多数情况，但每个团队都有自己的习惯。下面列出最值得调整的几个地方。

可调参数一览

参数默认可以怎么改
输出格式变量文件改成团队模板、表格或固定小标题
详略程度适中给领导看的精简版 / 给执行者看的详细版
语气风格中性按团队文风、对外或对内调整
严格程度标注不确定项提高到“任何推断都要给依据”
步骤4 步增加团队特有的检查步骤

改写示例：description

通用版：

把设计稿中的颜色、字号整理为设计变量。当用户提到设计变量同步时使用。

团队版（示意）：

按本团队规范进行设计变量同步：先读取 reference.md 中的模板与术语表，再处理设计规范。当团队成员提到设计变量同步或上传相关材料时使用。

改写示例：增加团队步骤

## 步骤
1. 提取颜色与字号
2. 命名变量
3. 生成样式文件
4. 替换硬编码值
5. 对照 reference.md 中的团队检查表逐项确认
6. 按团队模板输出，并在开头写一句结论

按角色出多个版本

同一个技能可以为不同角色准备变体：新人版写得更细，并解释每一步的理由；熟手版只保留关键检查点。也可以在一个技能里用参数区分，例如“简版/详版”。

定制时别丢掉的东西

  • 领域底线：视觉与交互结果要在真实浏览器里确认
  • 缺信息先提问
  • 需人工确认清单
  • 风险较低，但输出仍需快速过目再使用

改完后记得重跑测试用例，团队共享时参考团队落地。

交付物结构示例

建议把变量文件固定成下面的结构（示意），方便复核与归档：

## 结论
一句话说明最重要的发现或结果

## 主要内容
- 提取颜色与字号：……
- 命名变量：……
- 生成样式文件：……
- 替换硬编码值：……

## 依据
- 引用输入中的具体位置或数据

## 需人工确认
- ……（没有则写“无”）

结构固定之后，复核的人只要先看“结论”和“需人工确认”两部分，就能快速判断结果能否使用。

平台选择建议

同一个「设计变量同步」技能可以落在不同平台上，选择时主要看你在哪里工作、要不要执行代码、要不要接外部系统：

  • LangChain / LangGraph 工具：LangChain 用 @tool 装饰器把函数变成工具。详见LangChain / LangGraph 工具 版
  • Claude Code Skill：Claude Code 的 Agent Skills 以文件夹为单位：一个 SKILL.md（YAML 头写 name 与 description）加上可选的脚本和参考资料。智能体平时只看到 description。详见Claude Code Skill 版
  • GitHub Copilot 指令与提示文件：GitHub Copilot 支持仓库级自定义指令文件 .github/copilot-instructions.md。详见GitHub Copilot 指令与提示文件 版

这个技能纯指令型，不需要额外脚本或外部连接，复制到大多数平台都能用，可据此排除不支持相应能力的平台。

延伸阅读

说明：文中的配置、代码与目录结构均为示意，用于说明思路；各平台的入口、字段名与能力会更新，落地前请以对应官方文档为准。示例中的数据与场景为虚构，不代表真实案例。