U4.06.3Semantic and categorical colour need separate territories in one interface设计
同一界面中语义色与分类色需划定各自的使用范围
别名: 色彩治理 · 色彩分区
概念解释
一个产品里同时存在两套颜色系统:语义色负责状态与动作(红黄绿、成功/警告/失败),数据色板负责量值与类别。两套系统如果不划边界,同一页面上同一种颜色会承担两种含义——红色既是"失败"又是"华东区",读者无法知道眼前这个红该按哪套读。划界不是不让两套颜色共存,而是规定每种色相的"户籍":它被允许出现在哪里、承担什么。
机制
颜色含义的解读是语境驱动的,而读者无法在每次扫视时重建语境:同一屏上仪表盘状态灯的绿与图表里类别三的绿,在 100 毫秒的注视里不经过图例就会被关联起来。划界的本质是消除"跨系统撞色"——语义色被限制在组件层(状态点、告警条、按钮),数据色板被限制在图表层,两者色相集合不相交或仅在数据语义同向时相交。边界明确了,语境就不需要读者自己重建:看到红黄绿就想状态,看到图表色板就想量值,两套通路互不串扰。
边界
划界的成本是色相预算变紧:语义色占用红绿黄蓝后,数据色板可用的色相变少,类别多时会更早触到可辨上限——这是用可选色换解读确定性,值得但有限度。完全不相交有时做不到(品牌色同时出现在两侧、状态色必须进图表标注),此时的妥协是允许"同色相、异明度"而不是"同色同明度",并用位置与形态辅助区分。划界规则需要写成文档并进设计走查,否则每次新增图表都会重新侵蚀边界。
怎么落地
- 建立色彩户籍表:列出语义色的全部色值与允许出现的位置,数据色板的全部色值与允许出现的组件类型,两张表都不许越界。
- 新增图表组件时对照户籍表审色:撞色即换色或调明度,并在表里记录例外及理由。
- 验证:截取同一界面上的状态区与图表区,把两者的颜色清单并排对比;出现同色值且含义不同的对子即违规,逐个整改。