normalize

概览

什么是 normalize 技能？

normalize 技能旨在审计并调整用户界面特性，使其严格遵循您的设计系统标准。它专注于识别和纠正间距、设计令牌和 UI 模式中的不一致。该技能对于希望在前端项目中保持视觉和功能一致性的团队至关重要。

谁应该使用 normalize？

normalize 非常适合需要解决设计偏差、样式不匹配或希望将功能恢复到既定系统规范的 UI 设计师、前端开发者和设计系统维护者。

解决的问题

• 发现并纠正偏离设计系统标准的情况
• 确保令牌、间距和模式的统一使用
• 帮助防止和修正不断扩展代码库中的设计偏差

使用方法

安装步骤

1. 使用以下命令安装 normalize 技能：

   npx skills add https://github.com/pbakaus/impeccable --skill normalize

2. 首先查看 SKILL.md 文件，了解详细的工作流程和需求。

3. 浏览支持文件，如 README.md、AGENTS.md 和 metadata.json，获取更多背景信息。如有 rules/、resources/、references/ 或 scripts/ 文件夹，也请一并查看。

工作流程概览

• 准备阶段： 调用 $frontend-design 代理以收集设计原则和上下文。如果尚无设计上下文，先运行 $teach-impeccable。
• 规划阶段： 研究设计系统文档、UI 指南和组件库，识别核心原则、令牌和模式。
• 分析阶段： 审计当前 UI 功能，查找与设计系统不一致或偏离的地方。
• 执行阶段： 进行针对性调整，使功能重新符合设计系统标准。
• 收尾阶段： 审查并完成更新，确保所有更改一致且有据可查。

何时使用 normalize

• 发现 UI 不一致或设计偏差时
• 重大功能开发或重构后
• 设计系统采用或迁移期间

常见问题

normalize 技能具体做什么？

normalize 会审计您的 UI 组件和功能，然后提供方案，将它们调整回符合设计系统在间距、令牌和模式上的标准。

normalize 只适用于大型设计系统吗？

不是，normalize 适用于任何重视 UI 一致性和设计原则遵循的项目，无论团队规模大小。

我应该先查看哪些文件？

从 SKILL.md 开始，了解主要工作流程。支持文件如 README.md 和 AGENTS.md 提供额外指导。

normalize 能自动修复所有 UI 问题吗？

normalize 提供结构化流程和指导，但仍需人工审查和调整，确保与设计系统完美契合。

哪里可以找到更多细节或脚本？

请查看仓库的 Files 标签，里面有嵌套引用、辅助脚本和更多文档。