五条
永恒原则
这五条原则是设计系统的「宪法」。无论未来采用什么视觉风格,它们都不可违背。
一条有效的原则必须满足三个标准:
它必须排除某些做法,而不是"什么都好"
面对具体设计稿,能明确判断是否符合
它在两个都有道理的方向之间选了边
内容驱动形式
所有视觉决策都服务于信息传达。装饰元素必须能用功能来证明自己的存在——如果一个元素移除后信息传达不受影响,它就不应该存在。
判定方法:遮住这个元素,信息还能完整传达吗?如果能——删掉它。
数学般的秩序
设计不应该是随机的。尺寸、间距、字号、比例,都应该建立在可推导的数学关系上。
"目测差不多" 不是 对齐。
"感觉还行" 不是 间距。
"看着舒服" 不是 字号。
数学关系在用户的潜意识中建立信任感。你说不出来为什么某个页面看着"专业"——往往是因为它的所有数值都落在网格上。
判定方法:页面上的任何一个数值,能否用基数的整数倍来解释?如果不能——它需要被修正。
一致性高于创意
在同一产品内,同一语义的元素永远保持一致的视觉表达和交互行为。创意的空间在于"系统允许的范围内"——先遵守规则,再在规则之内寻找表达。
一致性不是追求"到处长得一样"。
一致性是: 同一语义 → 同一表达。不同语义 → 不同表达。
一致性维度
一致性的三个敌人
"这次特殊"综合征
每一个例外都以"特殊情况"出现。三个月后回头看,全是"特殊情况",没有规则。
渐变漂移
不是一次大改,是每次"微调一点"。1px 的偏差不伤大雅,50 次 1px 就是 50px。
隐性分叉
每个人心里都有一个"差不多"的标准,但这些标准互不相同。
判定方法:把两个同类页面并排放——它们像同一个产品吗?
可访问性是底线,不是额外工作
WCAG 2.1 AA 级不是"追求无障碍的加分项",而是"让正常视力的用户在阳光下也能看清"的最低标准。
这些不是在设计完成后"检查一下"的事情,而是在设计开始时就必须内置的约束。
判定方法:用对比度检测工具扫一遍。不达标的,不上线。
约束即自由
这是最反直觉的一条,也是最重要的一条。
限制选项不会扼杀创意——它会催生创意。当你只有 3 种字号、5 种间距、1 个强调色可用时,你被迫在这些约束之内想出解决方案。而这些解决方案往往比"什么都能用"时想出来的更精炼、更优雅。
设计系统提供的不是牢笼,
而是边界清晰的游乐场。
判定方法:你是否在规则之内找到了解决方案?如果必须打破规则才能解决——先质疑需求,再质疑规则。