用一套设计令牌统一后台与前台
本文目录
后台和前台由不同人维护时,最容易出现的问题是同一套颜色被复制成两份。改版时前台换了主色,后台还停留在旧值。设计令牌的作用,是把这些决定收拢到一处,再用统一的名称分发出去。
从命名开始统一
令牌不该按具体颜色命名,而应按用途命名。比如用文字主色、页面底色、危险操作色,而不是蓝色五百、灰色一百。这样换主题或调整明度时,使用方不需要跟着改。层级也要控制,基础值、语义值、组件值三层足够。
令牌不是样式表的分组,而是团队对设计决定的共同语言。
- 先盘点重复出现的值。
- 用语义命名代替色号。
- 保留少量例外并注明原因。
- 变更走版本与审查。
落地时先选一个范围小的页面试点,确认前后台的映射关系,再逐步替换。不要一次性重写全部样式,否则很难判断问题来自令牌还是组件。每次替换后做一次视觉回归,重点看间距、边框和状态色。
文档同样重要。每个令牌写清用途、可用的替代项和不建议使用的场景。半年后新同事加入,文档比口头约定更可靠。令牌体系不需要庞大,清楚、稳定、有人维护,就已经能达到目的。
最后,别把令牌当成一次性项目。新页面仍可能写出新的颜色和间距,审查时要把它们收回到体系里,而不是放任例外增长。一个能被持续维护的小体系,比一份完整却无人更新的规范更有用。