跳到主要内容
设计

用一套设计令牌统一后台与前台

后台和前台由不同人维护时,最容易出现的问题是同一套颜色被复制成两份。改版时前台换了主色,后台还停留在旧值。设计令牌的作用,是把这些决定收拢到一处,再用统一的名称分发出去。

从命名开始统一

令牌不该按具体颜色命名,而应按用途命名。比如用文字主色、页面底色、危险操作色,而不是蓝色五百、灰色一百。这样换主题或调整明度时,使用方不需要跟着改。层级也要控制,基础值、语义值、组件值三层足够。

令牌不是样式表的分组,而是团队对设计决定的共同语言。

  • 先盘点重复出现的值。
  • 用语义命名代替色号。
  • 保留少量例外并注明原因。
  • 变更走版本与审查。

落地时先选一个范围小的页面试点,确认前后台的映射关系,再逐步替换。不要一次性重写全部样式,否则很难判断问题来自令牌还是组件。每次替换后做一次视觉回归,重点看间距、边框和状态色。

文档同样重要。每个令牌写清用途、可用的替代项和不建议使用的场景。半年后新同事加入,文档比口头约定更可靠。令牌体系不需要庞大,清楚、稳定、有人维护,就已经能达到目的。

最后,别把令牌当成一次性项目。新页面仍可能写出新的颜色和间距,审查时要把它们收回到体系里,而不是放任例外增长。一个能被持续维护的小体系,比一份完整却无人更新的规范更有用。

admin

站长 / 作者

记录技术、产品与生活,偶尔写点长文。

发表评论

邮箱不会公开,带 * 的为必填项。

把想法写下来,让它在互联网上生长

这里记录技术、产品与生活。订阅 RSS,更新会第一时间送达。

RSS 订阅