F5.11.3Visual budget设计
一屏内的强调点数量需要预算
别名: 强调预算 · 一屏一点 · chromatic budget
概念解释
首页同时有:主按钮橙、未读橙点、促销条橙、新功能角标橙。四件事在各自的稿子里都是「这一屏的重点」。用户进门只带一次扫视,颜色名额只有那么几个。一屏的强调点要有预算——先定能花几处,再让任务来抢,而不是每个模块自说自话。
稀缺解释它为什么有效,泛滥解释它怎样坏掉;预算是当下这一屏还允许几处活着。
机制
一次注视能优先处理的异常色块很少,通常按一到两处来设计才稳。预算是空间上的硬约束:同一视口里的每一处强调都在竞价那一两次优先加工。模块级评审看不见总和——四个模块各带一处,合成四。所以预算必须在视口级计数,而不是在组件级声明「我这是强调」。
数字没有魔法。一处最稳;两处要分主次(一处动作、一处状态);三处开始互相取消。预算用完之后,新来的强调只能替换,不能叠加。
边界
- 超长页要按「一屏」而不是「一页」计。折线以下的第二屏可以有自己的预算,但滚动途中两屏交叠时仍可能一起被看见。
- 桌面多栏会把几个视口拼在一起,预算要按同时可见的区域加总。
- 系统通知从屏幕边缘进来,会临时占用一处,应用内预算要留出这个可能。
怎么落地
- 给关键模板写死上限,例如工作台主视口强调点 ≤ 2,并写明何谓一点(一块连续的强调色,不是一枚像素)。
- 评审用打印稿或灰度后再只上强调色,现场数点;超了就让产品决定删哪一处,不让设计再「调和一下」。
- 角标、未读点、主按钮、促销条列入同一张预算表,禁止各走各的「例外」。
- 验证办法:截一屏,圈出所有非中性色块,数个数;超过预算的截图不能过,除非有一处被明确标成替换而非新增。