关于 fix-design-system-finding
用于处理 audit-design-system 已定位的单个设计系统问题的 Figma 技能,适合需要限定修改范围的设计工作。它要求局部检查、备份和验证,避免扩展为整屏清理。
主要功能
- 01逐项处理单个问题
- 02限定节点和修改范围
- 03检查 Figma 结构与变量
- 04编辑前备份目标区域
- 05验证局部修复结果
适用场景
- 01替换被标记的不匹配组件
- 02将原始样式值绑定到令牌
- 03调整实例的变体或属性状态
MCP 相关
使用 Figma MCP 读取设计信息,并在环境需要时通过 figma-use 类辅助工具执行写入。
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ edenspiekermann/ skills --skill fix-design-system-finding安装后在 Claude Code 中输入/fix-design-system-finding确认已加载。
附带文件agents/openai.yaml
详细介绍
修复一个设计系统问题
在 audit-design-system 已识别出具体问题后,使用此技能。
此技能的范围刻意设得很窄:
- 每次处理一个问题
- 每次处理一个问题节点或局部节点组
- 尽可能缩小读取范围
- 尽可能缩小写入范围
首先加载以下能力:
- 用于常规检查工具的 Figma MCP 读取权限
- 如果你的环境有此要求,则在任何
use_figma写入调用前加载figma-use风格的辅助工具
如果任务涉及更广泛的整屏重新连接、需要协调修改多个部分,或用户明确要求全面检查整个画板,请改用 apply-design-system。
预期输入
优先使用以下任一项:
- 来自
audit-design-system的单条 JSON 问题记录 - 完整的审核 JSON,以及需要处理的具体问题
- 对问题的转述,以及 Figma URL 或
fileKey和nodeId
如果问题来自 audit-design-system,请从以下字段提取目标:
code_location.absolute_file_path = /figma/<fileKey>/nodes/<nodeId>
将审核结果视为范围约定。不要悄悄将单个问题扩展为全面清理。
范围规则
持续聚焦所选问题,直到符合以下任一情况:
fixed:目标问题已修正blocked:修复需要缺失的库资源、无法访问的组件,或更广泛的产品决策needs-follow-up:目标节点已改进,但仍有一个独立的相邻问题需要单独审核
如果用户粘贴了多个问题,请处理他们选定的问题,或选择优先级最高的问题,并说明当前正在修复该问题。
必需工作流
1. 规范化问题
提取并重述:
fileKey- 有问题的
nodeId - 问题标题
- 审核者标记此问题的原因
如果审核输出未指出具体节点,请停止并要求提供原始问题 JSON 或直接的 Figma 节点。
2. 当替换方案不明确时,进行本地兼容性检查
在备份或编辑画布前,先判断能否直接修复。
符合以下情况时,进行本地兼容性检查:
- 问题要求替换设计系统组件,但未指出具体组件
- 有多个库组件看起来都合适
- 覆盖行为或尺寸不明确
- 用户明确要求写入前进行额外调查
在兼容性检查得出以下结果之一之前,不要继续写入:
safe-to-applyblockedneeds-human-choice
兼容性检查应回答:
- 哪个具体组件或变体是首选候选项
- 是否支持文本、图标、状态和尺寸覆盖
- 替换后能否保留节点的布局约定
如果结果为 blocked,请停止并报告阻碍因素。
如果结果为 needs-human-choice,请停止并提出最简短的澄清问题,不要猜测。
3. 仅收集所需证据
写入前,使用尽可能少的读取操作检查目标:
- 使用
get_screenshot查看有问题的节点或最近的外围部分 - 使用
get_metadata获取结构上下文 - 如果问题涉及令牌、原始值、颜色、间距或排版,则使用
get_variable_defs - 如果问题表明存在已有的映射组件,则使用
get_code_connect_map - 仅当仍需查找替换基础组件时,才使用
search_design_system
除非问题明确指向重复模式,且必须了解该模式才能选择修复方案,否则不要重新审核整个画板。
4. 对修复进行分类
准确选择一种修复模式:
swap-instance:用正确的库组件或变体替换临时实例或错误实例compose-from-primitives:使用已发布的库部件重建本地自定义包装器bind-tokens:将原始值替换为变量或样式align-variant:将现有实例切换为正确的变体或属性状态blocked:目前无法通过库支持的方式进行有效修复
如果看起来有多种模式都适用,优先选择满足原始问题的最小改动。
5. 仅备份受影响区域
在进行破坏性编辑前,只复制有问题的节点,或范围最小的本地封装区域。
为备份起一个清晰的名称,例如:
Backup - Fix finding 1Backup - Custom nav
在单独的一次写入调用中创建备份,并返回所创建节点的 ID。
6. 逐步应用修复
不要重建整个屏幕。
按以下小步骤操作:
- 检查当前节点 ID 和组件关联
- 导入或找到所需的库组件或变量
- 仅替换、组合或重新绑定受影响区域的令牌
- 返回所有已创建和已修改的节点 ID
如果 swapComponent() 能保留节点的位置和有效覆盖项,优先使用它。
在以下情况下,优先在原节点旁重建:
- 当前节点是包含混合自定义结构的本地包装器
- 评审问题指向的是自定义组合,而非单个基元
- 需要在替换原节点前进行视觉对比
如果首次验证发现推荐组件导致布局、文本可见性、图标行为或宽度约束退化,请停止。应报告 blocked 或 needs-follow-up,而不是继续强行使用同一个基元。
7. 验证问题,而非整个屏幕
写入后:
- 对更改的节点或其直接所属区域截图
- 确认具体的评审问题已不再存在
- 如果目标是由库支持或绑定令牌,确认结果符合该目标
- 确认间距和文本覆盖仍然合理
只有在修复触及导航等全局模式时,才将验证范围扩展到本地所属区域之外。
决策启发式
- 如果问题指出某个基元被重新创建成了画框,倾向于使用
swap-instance。 - 如果问题指出应将重复的本地包装器合并为共享模式,除非任务明确要求在所有同级节点上应用修复,否则只修复一个代表性节点。
- 如果问题涉及原始值与已绑定令牌的同类元素并存,倾向于使用
bind-tokens。 - 如果问题涉及本地编辑过但尺寸或状态错误的实例,倾向于使用
align-variant。 - 如果库中缺少所需组件系列,或导入失败,应标记为
blocked,不要临时伪造关联。 - 如果设计系统组件存在,但无法保留节点的文本、图标或尺寸约束,应标记为
blocked或needs-human-choice,不要强行替换。
编写规则
- 写入范围应严格对应所选问题。
- 如果替换选项存在歧义,在获得
safe-to-apply兼容性结果前,不要写入。 - 修复一个问题后,不要声称整个屏幕都已“符合系统规范”。
- 优先使用确切的组件键和变量 ID,而不是名称。
- 不要因为发现了其他偏差,就继续处理无关的清理工作。
- 如果明显需要更大范围的重构,先完成针对性修复或报告阻碍,然后建议在下一轮使用
apply-design-system。
交付格式
结束任务时,请报告:
Finding fixed:更改内容及其所在节点Validation:如何确认原问题已解决Blocked或Follow-up:仅在问题无法完全解决时报告
报告应围绕单个问题展开。除非用户要求,否则避免总结整个屏幕。