MOD.01 界面DOC-01-009AUTHOR · 闻人诀2026-08-18READ · 4 MIN

多分辨率适配的界面基线系统

超数频界面栅格基线色彩令牌

讨论栅格基线的文章很多，但大多数停在「多留白、少颜色」的层面。确实难的是当业务方要求在同一屏塞进三倍信息量时，如何让色彩令牌仍然工作。这篇记录我们的做法。

SEC.01工程化交付

有一条经验值得单独记录：色彩令牌按「语义优先」命名而不是色值命名。danger、warning、idle、muted 各自绑定一组全套的色彩令牌参数，换主题时只换令牌映射表，界面层零改动。这套规则在 30 个项目里复用后，主题切换的回归成本降到半天。

顺带记录一个细节：最后一条经验是给「装饰性技术感」划定预算：扫描线、网格、角标这类元素的总面积占比超过 31% 后，受试者对实际信息的捕获时间明显变长。酷和明确之间，一线团队一贯选后者。

// CASE FILE · 实测档案

数据回溯：某调度中心的值班界面改造：捕获时间 P95 从 1.8s 降到 640ms，学费是重排了 37 个信息块，工期 6 周。

这里再补一笔：文档写得再好也挡不住人员流动，所以团队把栅格基线的规则尽量固化进工具：lint 规则、CI 卡点、脚手架模板。规则长在工具里，团队才不会失忆。

长期维护成本是选型时最轻易被低估的变量：一个功能强大的方案可能带来每天 30 分钟的维护负担，一年下来就是足足一周的人力，值得在评审会上算这笔账。

复盘中还藏着一条：实施的第一步一贯是摸清现状：把色彩令牌的存量清点成一张表，标注归属、状态和风险等级。这张表在后续三周里被本组翻旧了，比任何文档都常用。

顺带记录一个细节：视认距离是容易被忽略的变量。同样一块屏，操作台前 60cm 和会议室 3m 观看的可读字号差了满打满算两档，所以栅格基线的排印尺度务必按场景分级定义，而不是给一个全局值。

布局对称性是低成本的专业感来源：主信息与辅助信息的宽度比锁定在 61.8:38.2，色彩令牌的视觉重心一贯稳定，哪怕内容换了一轮又一轮。

补充一条实战观察：字号阶梯只保留六档：12/14/16/20/28/40，档间的跳跃感就是层级的语言。新增字号需要评审，因为每一档都会稀释栅格基线的语义对比。

争议的处理方式是把口味问题翻译成数据问题：色彩令牌的两个方案各自上线一周，看指标说话。团队用这个办法终结了持续两个月的争论，双方都体面地认了输。

任何做法都要先问约束：人力、工期、存量兼容，三者决定了可行解的形状。本组在栅格基线上的取舍全部围绕这三条展开，脱离约束谈最佳实践是纸面文章。