第 02 章 眼睛不是相机：视知觉如何被设计利用
我先给你讲一件你大概率经历过的事。
你做了一份季度汇报的 PPT。深蓝的底，白色的字，标题用了很大字号，你觉得挺高级——在自己笔记本屏幕上看，确实挺高级，深色稳得住，白字清楚，还有点发布会的意思。
然后你进了会议室。投影一打上去，整个画面糊了。白字像被水泡过，蓝底不是深蓝，是一块发灰发脏的东西，标题那点”高级感”一点没剩。你站在那儿讲了二十分钟，后排的人一直在眯眼。
你回去改了。字号加大两号，字的颜色从灰白改成纯白。再投影，好了一点，还是不对。
“是不是我这个配色本身就不行？”
不是。你的配色在自己的屏幕上是成立的。它死在了会议室里，而死因不是颜色，是参照系变了。
我在这一章要跟你聊的，就是这件事背后那一整块东西：你的视觉系统从来不报告”外面有什么”，它报告的是”在当前的上下文里，我判断外面有什么”。它不测量，它推测。而设计——所有设计——本质上都是在这套推测机制上做的工程。
上一章我提过一句：你的视网膜只有中间一小块是高清晰的，眼球每秒跳三次把样本拼起来。那是素描。这一章要把这张素描画成结构图，看清那几个可以被设计直接利用的关节在哪。
先做个准备动作，二十秒就够，你自己能验证。
在你的电脑上新建两个方块，一个纯黑，一个纯白，紧挨着。然后在正中间放一个中灰的方块，从黑块一直延伸到白块——也就是说，同一个灰色，一半压在黑上，一半压在白上。
你看一眼。
同一个灰色，压在黑上的那一半明显更亮，压在白上的那一半明显更暗。
它们的数值一模一样。你用取色器点两下就知道。但你的眼睛告诉你，这是两个颜色。
这就是这一章的入口。你的眼睛在骗你，而且骗得非常稳定、非常有规律。稳定到什么程度？稳定到你可以把它当成工具来用。
一、会议室里的那块深蓝
回到那份 PPT。
我先问你一个看起来很蠢的问题：你的深蓝，在你的笔记本上，是”深”的还是”浅”的？
“当然是深的。但它在画面里是亮的——字是白的，底是蓝的，蓝比白暗，但在深色里算亮的。”
你说对了前半句，说错了后半句的关键。在会议室里，你的深蓝不再是”深色里算亮的”，它被重新解释成了”一块脏的灰”。
发生了什么？
在你的笔记本上，屏幕四周是黑色边框，屏幕上最亮的东西是你那块深蓝旁边的白字。你的视觉系统拿到这个画面，做的第一件事是估算：“这个环境里，什么算白？“它找到最亮的那片区域，把那里定为参照白，然后按这个参照去解释剩下所有东西。深蓝被解释成”比参照白暗很多的深色”——稳重、高级，符合你的意图。
会议室里，情况全变了。幕布周围是刷白的墙，天花板上的灯没关，你同事的白衬衫在你余光里晃。现在你的视觉系统拿到的参照白是整个房间的亮度水平，而不是你画面里那块白字。它按这个高得多的参照重新解释幕布上的一切：你那块深蓝，现在被判定为”一块反射率很低、而且不太干净的表面”。
同时，投影仪本身暗部下不去（它投不出真正的黑，最暗也就是幕布被环境光照亮的程度），你的深蓝被抬高了；白字因为幕布整体变亮反而不够跳。字和底的差距被两头夹击，一起塌了。
所以你改字号、改字的颜色，都是在对抗症状。真正的问题是：你在一个参照系里设计，作品在另一个参照系里被观看。
“那我是不是应该把颜色调得更准一点？”
这个想法是错的。不是错在”要准”，错在”有准这个东西存在”。
颜色没有脱离参照系的”准”。你能控制的从来不是”这块颜色是多少”，而是”它旁边是什么、整个画面最亮的是什么、观者所处的环境光是什么”。你以为你在调颜色，你其实在调关系。
这一章接下来讲的四个机制，讲的都是同一件事的不同侧面：
视觉系统对”绝对值”麻木，对”差值”敏感。
亮度恒常是在消除”照明强度”这个绝对值，提取物体反射率的差。侧抑制是在消除”均匀区域”这个绝对值，提取边界处的差。运动通路是直接报告时间上的差。而扫视系统，是在空间上做稀疏采样，只保留变化最大的那几个点。
四条通路，全是差分器。
明白这一点，你就明白为什么”往画面里加东西”几乎永远是错的第一步，也明白为什么你看自己的作品永远看不出问题。这两个结论我会在心法里展开。
先把四个机制一个一个说清楚。
二、你只在”点名”，不在”录像”
上一章我说过中央凹和扫视，那是粗线条。现在往里走。
先说分辨率的分布有多极端。
你视网膜上负责高清晰度视觉的感光细胞（视锥细胞）极度集中在中央凹，也就是视网膜正中心那个小坑。中央凹覆盖的视角大约只有一到两度。一度是什么概念？你伸直手臂，竖起拇指，指甲盖的宽度大约就是两度。
也就是说，在任何一个瞬间，你真正看清楚的，只有伸直手臂时一个指甲盖那么大。
离开中央凹，视敏度断崖式下跌。到中心五度以外，分辨细节的能力大概只剩一半；十度以外，掉到五分之一以下。视野最边缘那一圈，视锥细胞几乎没有，剩下的视杆细胞有三个特点：不分辨颜色、分辨率极低、但对运动和明暗变化极其敏感。
所以你现在”看到”的这一整屏文字，其实只有你正在读的那一两个字是清楚的。剩下的一切，是你以为自己看见了。
“不可能。我要是只看见一个指甲盖，我怎么知道整页在说什么？”
因为你的眼球一直在动。
再说扫视的真相。
眼球每隔大约两三百毫秒跳一次，一秒三次左右。每次跳跃持续几十毫秒，跳得极快。这种跳跃叫扫视（saccade），跳跃之间的停留叫注视（fixation）。
这里有个关键事实，上一章没讲：扫视过程中，你的视觉基本是被关掉的。
这个现象叫扫视遮蔽（saccadic masking）。如果扫视期间视觉不关闭，眼球高速转动会让整个画面在你眼里疯狂划过，你会晕。所以视觉系统在扫视开始的那一刻就把输入掐了，扫视结束后再打开。你感觉不到这个”黑屏”，因为大脑把这一段剪掉了，用后一段的画面填上去。
你可以自己验证：站在镜子前，距离半米，眼睛先看自己的左眼，再跳到右眼，来回跳。你能在镜子里看到自己的眼球转动吗？
看不到。你只能看到它在两个位置上，看不到中间的移动过程。
同理，你还可以验证一个更狠的：让人在你扫视的瞬间动一下你余光里的东西，你多半察觉不到。
所以，“我每秒都在看”是错的。你每秒只有三次采样机会，中间还有三段是瞎的。
那”世界是连续且清晰的”这个感觉从哪来？
从大脑的缝合来。它做一件事叫跨扫视整合：把上一次注视采到的东西和这一次采到的东西拼起来，缝成一个”稳定完整”的世界。这个缝合过程非常激进地丢弃细节——研究指出，跨扫视能稳定保留的主要是物体的位置和粗略的类别信息，精确的细节（比如具体是什么字形、什么纹理）基本不保留，大脑假定”没变”，直接沿用上一次的内容。
你看到的连续世界，是渲染出来的，不是拍下来的。 上一章这句话我在这里再说一遍，因为它值得被记住两次。
现在，把这个机制翻译成设计的四条硬约束。
约束一：你只有非常少的采样预算。
一个人看一张海报三秒，最多给你不到十次注视。这十次里，能被记住的大概三四个。
这就是为什么”一个画面只能有一个主角”不是审美教条，是生理账单。你想塞五个重点，不是”信息多一点”，是要求观众做五次采样、五次整合、五次缝合——他不会做的，他会直接跳过四个，或者整张放弃。
约束二：眼睛不会均匀扫过画面，它只落在”值得落”的地方。
什么值得落？对比突然变化的地方、边缘密集的地方、有字的地方、有人脸（尤其是眼睛）的地方。
反过来，大片均匀的区域会被直接跳过。
这直接判了一个流行做法的死刑：大面积的柔和渐变背景。渐变在视觉上是”无信息的平滑区域”，眼睛在上面没有落脚点。你以为你在做”干净”，你其实在做”视觉沙漠”——观众的目光从画面的一头直接跳到另一头，中间你精心放的东西全部被跳过。
约束三：动线不是一条线，是一串离散的点。
因为扫视是跳跃，不是滑动，点与点之间没有轨迹。所以设计师设计的从来不是”一条路径”，是”一组落点”。
这个认知有个很实际的后果：多一个装饰元素，不是多了一点点信息，是消耗掉一次注视预算。 你的每一次”这里加个小图标应该更好看”，都是从观众的总预算里扣钱。第 05 章讲视觉动线的时候，这套账会算得更细。
约束四：你控制不了观众看什么，只能影响他往哪跳。
你能做的是设置”着陆点”——让某些位置的局部对比显著高于周围。局部对比高的点会被优先选中，这是自下而上的过程，观众拦不住。
而这里有个反直觉的推论：降低某个地方的对比，和提高另一个地方的对比，效果是一样的。 你想让观众看 A，可以提亮 A，也可以压暗 B、C、D。后者往往更有效，因为提亮 A 会遇到天花板（已经是白的了没法更白），而压暗别人永远有空间。
把这四个约束拢在一起，你就得到了一个非常工程化的看法：
视觉系统是一个采样率极低、压缩极其激进的传感器。你拿到的数据是几个采样点，你”看到”的画面是解压后的结果，而解压算法的参数是你的经验和预期。
你写代码时能接受”把每个函数都优化一遍”这种性能方案吗？不能，你得先测量，找到那个差值最大的热点。设计里一模一样，区别只是你的”测量工具”不是 profiler，是我在后面给你的那几个破坏预期的手法。
三、白纸在阴影里还是白的：亮度恒常的账
现在说说那张白纸。
拿一张打印纸走到室外，一半放在阳光里，一半放在树荫下。反射到你眼睛里的光，这两半能差十几倍甚至几十倍。如果你用手机把相机调到手动、关掉自动处理去测，阴影那一半的灰度可能只有九十出头，阳光那一半接近两百五。
但你会毫不犹豫地说：这是同一张白纸。
相机不会这么说。相机会老老实实拍出一半白一半灰。于是你觉得”这相机不行，跟我肉眼看到的差太远了”。
相机没不行，相机只是没有你那套推测机制。
先说清楚这个问题在数学上有多难。
到达你视网膜的光，等于两样东西的乘积：
物理量 = 物体表面的反射率 × 照到它上面的光强
你测到的是乘积，你想知道的是反射率（“这张纸有多白”）。这是一个方程两个未知数，数学上叫欠定问题——你不可能只从到达眼睛的光量，反推出物体是什么颜色。
想解它，必须引入额外的假设。你的视觉系统引入了三个：
假设一：场景里通常存在反射率很高的东西。 白墙、纸、牙齿、眼白、瓷器。所以”整个场景里最亮的那一片”，大概率就是白的。拿它当参考白，其余的按比例折算。
假设二：照明的变化是平缓的、大范围的；物体表面的变化是突变的、有边界的。 所以视觉系统会把”大范围、缓慢的明暗起伏”归因为照明（“这里是阴影”），把”小范围、有清晰边界的明暗变化”归因为物体（“这里有个东西”）。
假设三：阴影的边界通常是软的，而且带一点颜色偏移（因为阴影里主要是天空的散射光，偏蓝）。
这三条加在一起，构成一个推测装置。它算出来的东西叫明度（lightness）——“这个物体被判定为有多白或多黑”，与当前照明无关。这套机制叫亮度恒常（lightness constancy）。
它的运作是可以被演示的。 有个很经典的演示：一张棋盘图，上面立着一个圆柱，圆柱在棋盘上投下一道阴影。棋盘上有两格，一格（A）在阴影外，一格（B）在阴影里。你会觉得 B 明显比 A 浅。实际上，两格的灰度数值完全相同。
为什么？因为你的视觉系统判断”B 上面有阴影，这里照度低”，于是把 B 的灰度数值往上解释一档——“照度低还这么亮，说明这块表面本身更白”。它把”它是白的”这个结论还给了你，把一个物理上不存在的事实还给了你。
还有个更简单的：把同一张灰卡纸剪成两块，一块放在白纸上，一块放在黑纸上。同一个灰，看起来是两个灰。放在白底上的那块显得深，放在黑底上的那块显得浅。
这就是本章开头那个小方块的原理。同一个数值，参照系一变，感知就变。
好，现在回答那个困扰很多人的问题。
这跟”屏幕上看和印出来不一样”到底什么关系？
关系大了。而且大部分人只理解了其中第一层，把真正的元凶漏了。
第一层：发光体和反射体。
屏幕是自己发光的，它的”白”是背光自己定的，与房间里的灯无关（至少在环境光不太强的时候）。纸不发光，纸的”白”是被环境光照亮的，取决于你在哪看它、那盏灯有多亮。
所以在绝大多数室内环境里，屏幕的最亮明显高于纸的最亮。你把一张在屏幕上看得很好的图印出来，整体的亮度区间被压缩到一个更窄、更暗的带里。所有的高光不再高，暗部不再黑，中间调全部挤在一起——你得到的那个”闷、脏、灰”的感觉，就是这么来的。
这一层大部分人知道。
第二层：参照系的范围不一样。 这一层才是真正要命的。
你在屏幕上看图时，那块屏幕往往占据你视野的中心，甚至占满。你的视觉系统估算”什么算白”的时候，参照范围基本就是这块屏幕本身——屏幕里最亮的那块就是白。你自己定义了参照系，而且定义得很干净。
你拿起一张印刷品时，情况完全不同。纸张周围是桌面、是墙壁、是你自己的手、是房间里的顶灯。这些东西全部进入了照明估算。你的视觉系统不是在”看这张纸”，它是在”看这个房间里的这张纸”。
结果是什么？
如果这张印刷品整体偏暗，大脑会判定”这张纸的反射率低”，于是整张图被解释成”一张曝光不足的照片”，而不是”一张有意的暗调作品”。
这就是为什么暗调作品印出来特别容易死，而亮调作品印出来通常还行。不是印刷厂偏心，是你的恒常机制在暗调上会连续犯错：它认定这里照度正常，然后把你精心压下去的中间调全部往下再压一档，你那点微妙的层次就全没了。
所以给印刷做的东西，几乎总需要至少一个真正的、接近纸白的高光，和一个真正的暗部。这两个点是锚，它们把整个恒常系统钉住，让它知道”这张图的白在这里、黑在那里”，中间的一切才有地方站。没有高光，锚就丢了，整幅画会往下漂。
第三层：颜色也有恒常，而且它骗得更隐蔽。
颜色恒常（color constancy）机制：你在暖黄灯下看一张白纸，你依然认为它是白的，因为你的视觉系统自动扣除了光源的那层黄。相机不会自动扣——这就是”白平衡”这个东西存在的理由，它是相机的颜色恒常模拟器。
设计上的后果非常具体，而且非常坑：
你在暖色屏幕上调的颜色，在你自己的屏幕上看着正好，发到别人冷屏上就偏了。
更坑的是，你调的时候根本意识不到自己偏了——因为你自己的大脑已经帮你把那层黄”扣掉”了。你是在一个被补偿过的感知里做判断，而你的判断会忠实反映那个补偿。等你换了台机器一看：“这怎么这么蓝？”
这不是你的眼睛变差了，是参照系换了。
第四层：两个旋钮。
从恒常机制里能直接推出一个非常实用的结论：
想让一个元素显得更亮，你不一定要把它调亮，你也可以把它周围压暗。反过来，想让一个元素不那么跳，不一定要压暗它，把它周围提亮同样有效。
大多数人只拧第一个旋钮（改元素本身），不知道第二个旋钮（改环境）存在。而第二个旋钮往往更好使，因为它没有天花板——你把元素本身提亮，最多提到纯白就没了；而你压暗周围，空间永远有。
这跟”留白”的道理表面相似，机制不同：留白是利用空白制造孤立，这里是利用恒常的参照系重估。两条路通向同一个地方，但如果你只知道”留白”这一条，你会错过大量用不了留白的场景（比如画面已经很满了）。
顺带勾连一句：第 01 章让你”眯起眼睛看骨架”，你眯眼之后看到的那几块明暗，就是这里说的明度结构。而第 08 章会告诉你为什么明度比色相重要——其中一个理由现在你已经知道了：亮度有恒常机制在背后给它撑腰，色相没有同等强度的对应机制。所以明度关系是稳定的，色相关系是漂的。
四、边界上那条并不存在的黑线：侧抑制与马赫带
接下来这个机制，是四个里最直接能变现的。
先看现象。
做一个从左到右、由深灰到浅灰的渐变。或者更简单：两个均匀的灰块紧挨着，左边中深灰，右边中浅灰。
盯着交界处看几秒。
你会看到：暗块靠近边界的那一条，比暗块的其他地方更暗；亮块靠近边界的那一条，比亮块的其他地方更亮。
渐变上更明显：你会在每个台阶处看到一条亮带和一条暗带，交替出现，像水面上的波纹。
物理上，这些带不存在。渐变是平滑的，灰块是均匀的。这些带是你的视觉系统造出来的。这个现象叫马赫带（Mach band），一百多年前就被注意到了，机制后来被搞清楚，叫侧抑制（lateral inhibition）。
原理是这样的。
视网膜里的神经节细胞，接收信号的方式不是”我这一小块有多亮”这么简单。它有一个叫”中心-周边拮抗”的结构：正中间那一小片感光细胞给它兴奋信号，而围绕这一小片的一圈感光细胞给它抑制信号。它上报的是”中心减去周边”。
现在看两种情形：
在均匀区域内部。 每个细胞的中心和它被照亮的程度一样，周边邻居也和它一样亮。所以每个细胞受到的抑制量完全相同，输出被均匀地拉低一截。但关键是——大家被拉低的量一样，彼此之间没有差别。你看到的还是均匀的。
在边界附近。 亮区里紧贴边界的那个细胞，它的”周边抑制圈”有一半落在暗区里。暗区的细胞活动弱，给它的抑制就少。于是它受到的抑制，比亮区内部那些同僚少——它的输出反而更高。看起来就更亮。
暗区里紧贴边界的那个细胞正相反：它的抑制圈有一半落在亮区，被那些强活动的邻居狠狠压制，输出更低，看起来更暗。
净效果：边界被”过冲”了。一边过冲到更亮，一边过冲到更暗。 这就是一个边缘增强滤波器。
为什么要这么设计？
因为对生存来说，“边界在哪”比”这里到底有多亮”重要得多。边界意味着物体的轮廓、意味着地形的起伏、意味着有个东西可以从背景里分出来。所以视觉系统主动牺牲了绝对亮度的准确性，换取边界的锐利。
这是一次明确的工程取舍，跟你在系统里做的取舍没区别：牺牲精度，换取对变化的响应。
由此得到本章的枢纽句：
你的视觉系统是一个边缘检测器，不是一个照度计。 它天生擅长”找出变化”，天生不擅长”测量数值”。
记住这句，第五节的变化检测是从它直接长出来的。
下面讲它在界面上的实际后果。这一节是本章最”能立刻用”的部分，我写细一点。
后果一：分隔线会自己变重。
你在两个浅色区域之间画一条 1 像素的中灰线。你量过它的色值，你觉得”已经很淡了”。
但它看起来比你预期的重。为什么？因为线的两侧同时发生了过冲——线的一侧被提亮，另一侧被压暗——这条线对视觉产生的”重量”，等于它本身的重量加上两侧的过冲。
所以界面里那种”这条线怎么看着这么硬、这么脏”的抱怨，根子往往不在线太黑，而在于线太窄而台阶太高，过冲全部挤在极小范围内。
处理方向有两个：把线调得比你以为的更浅（通常比你直觉的浅一半都不过分），或者干脆删掉线。
后果二：底色差为什么比线舒服。
现代界面大量用”白底配一个浅灰底”来分区，比如纯白卡片放在一个比白深百分之三的浅灰页面上。为什么不画条线？
因为侧抑制的过冲幅度，和台阶的高度正相关。台阶小，过冲就小。
一条 1 像素的深线，是一个”极窄但极高”的台阶——过冲被挤在一两个像素里，显得尖锐。而白到浅灰是一个”极宽但极低”的台阶——同样的过冲总量被摊到整片区域，就显得柔和干净。
所以：同样的视觉重量，铺开到更大范围就变柔和，挤压到一条线就变刺眼。 这一条能解释很多”我说不出哪里不对，就是觉得这个界面不够精致”的案例——多半是线太多了。
后果三：边框会吃掉内容。
一个深色描边框住一张卡片，卡片里紧贴边框的文字，靠边那一侧会被压暗一点点；同时边框本身又被过冲得更黑。两个效应叠加，结果是内容”贴边""发闷""挤”。
新手做的卡片经常字离边框太近，加上边框之后更挤，然后他会去调字的颜色——错的方向。正确的方向是把边框和内容之间的间距拉大，拉到比你直觉里”合适”的距离还要大一些。
后果四：渐变的条带。
你做一条大面积的线性渐变，理论上连续，实际在屏幕上看到一道一道的色带。
两个原因叠加：一是位深不够（每个通道八位只有 256 级，跨度一大必然出现台阶）；二是马赫带把这些台阶放大了。台阶本身只差一两级，肉眼本该完全看不见，但过冲让每个台阶处出现一条可辨的暗带和亮带，于是台阶变得可见。
推论：渐变的跨度越大、面积越大，越容易出条带；在很小范围内做很小的渐变反而安全。所以”全屏渐变背景”是条带事故的高发区——而且它同时还犯了第二节说的”视觉沙漠”的毛病。一个手法同时踩两个坑，也挺难得的。
后果五：阴影的脏边。
给元素加模糊阴影，阴影的边界同样会触发过冲，形成一圈比预期更明显的边。模糊半径越小、阴影越深，这条边越硬越脏。
所以想让阴影干净，需要足够大的模糊半径配上足够低的浓度，让台阶摊薄。小而硬的阴影最容易显脏——而新手最常做的恰恰是小而硬的阴影，因为他想要”明显的立体感”，于是把阴影调黑调实，然后得到一个脏边。
后果六：紧挨着的两个色，对比会被放大。
判断两个颜色的对比够不够，不能只看它们的色值差，还要看它们是不是紧挨着。
紧挨着的一对，有效对比大于数值对比（过冲在边界处帮你加了一把力）；中间隔开一段的一对，有效对比小于数值对比（中间插进了别的参照，而且没有过冲帮忙）。
所以经常出现这种情况：你把两个色调在一起看着挺分明，分开摆到画面两头就糊了。你以为是你记错了色值，其实是过冲没了，同时参照系也变了。
顺带说一个跨领域的漂亮例子。
摄影和图像处理里的”锐化”（USM，非锐化掩膜）在做什么？它在每个边界的两侧，人为地加一条更亮的线和一条更暗的线。
这不就是侧抑制在做的事吗？锐化滤波器是侧抑制的工程化模仿。
知道了这个，你就明白为什么锐化过度会在物体边缘出现一圈白边和一圈黑边——那就是人为过冲过头了。你也就明白为什么锐化过度的照片”看着很假”：假的不是清晰度，是那个过冲的模式超出了自然范围。
五、动的东西为什么必然抢戏：变化检测优先
第四个机制，讲的是时间上的差分。
先说两个现象。
第一个：你在一个很吵的聚会上跟人说话，视野边缘有个人抬了一下手。你不想看，但你瞟了一眼。你没有选择，那个动作把你拽过去了。
第二个：在一个完全黑暗的房间里，盯着一个静止的小光点看。看久了，那个光点会开始自己”漂移”。这个现象叫自主运动错觉（autokinetic effect）——其实动的是你的眼球（它在做微小的不自主颤动），但你的运动系统把这种整体位移误判成了”光点在动”。
第二个现象暴露了一个底层的东西：视觉系统对”静止”的处理能力其实很差，它对”变化”的处理能力极强。
为什么？
视觉通路从视网膜开始就分成了两条，各管一摊：
一条对细节和颜色敏感，分辨率高，但速度慢；另一条对运动和明暗变化敏感，反应极快，但对颜色基本没感觉、分辨率很低。
而你的周边视野，几乎完全由第二条覆盖。也就是说，你的余光看不见细节，但看得见”有东西变了”。
这个分工是进化压力压出来的。在草原上，一个静止的、颜色微妙的东西通常不重要；一个突然动了的，要么是食物，要么是危险。所以”变化”被赋予了最高优先级。
更狠的是最底层：视网膜里的神经节细胞，对”恒定不变的光”反应很弱，对”光强发生变化”反应极强。 也就是说，视觉系统从第一级就开始做差分——它上报的不是状态，是状态的一阶导数。
有个实验性的证据：如果用特殊装置把图像固定在视网膜上，让眼球怎么动图像都跟着动、保证落在视网膜的同一位置，那么整个画面会在几秒内褪成一片灰。恒定不变的输入，视觉系统是不上报的。
你的世界之所以是”有内容的”，前提是你的世界一直在动（眼球在动、你在动、光在变）。
这对设计意味着什么？
第一：动的东西必然抢注意力，这是生理级别的，不可协商。
所以界面里的动效不是”锦上添花”，是”直接插队”。一个自动轮播的横幅、一个跳动的红点、一个呼吸的按钮、一个缓缓飘过的装饰——它们会把观众从你精心安排的阅读顺序里硬拽出来。
这不意味着不能用动效。意味着你用动效之前必须先回答一个问题：这个会动的东西，值不值得挤掉它旁边的这些信息？ 大部分时候答案是不值得，而动效只是被加进去了，因为”加点动效显得有设计感”。
第二：静止的设计必须做补偿。
一张海报不会动，它凭什么在地铁通道里从二十张海报里抢到人？
答案是：它得制造”等效的变化”。三条路：
制造边界密度。 大量小尺度、高对比的边界，会在眼睛扫过时产生密集的变化信号。这就是为什么细密的条纹、网点、高对比的几何图形容易在远处抓住你——它们在用数量制造差分事件。
制造不协调。 一个违反常识的组合——熟悉的物体放在不合理的位置、一个不该有的比例、一个物体跨过了它不该跨过的边界——会在识别阶段制造”预测误差”。而预测误差是大脑最不能忽略的东西，它会强制把注意力调过去。这一点第 03 章讲格式塔的时候会接上：大脑非要补全，补不上就会一直盯着。
制造需要走近看的层次。 远看是一个强图形（大尺度、高对比，扫一眼就够），近看有精细层次（小尺度变化，给停下来的人）。这跟上一章说的”分层”是同一件事，只是现在你有了它的生理依据：远看对应低分辨率通路，近看对应高分辨率通路，两者要求的完全不同。
第三：静止设计的另一个补偿，是利用观众自己的运动。
你做不出会动的东西，但观众在动。他在地铁通道里走、在翻杂志、在滑动屏幕。
所以好的静态设计往往是为”扫视路径”设计的，不是为”凝视”设计的。一张海报要在人走过它的两秒内成立，它就不能依赖细节——因为两秒内观众只来得及投两三次注视。这又回到了第二节的采样预算。
第四：反过来，什么时候该”不动”？
一个需要长时间阅读的界面——后台系统、文档页、代码编辑器、数据表格——任何动效都是纯粹的负担。你要人盯着一个表格核对二十分钟，旁边有个东西在动，你就是在跟他抢资源，而且是抢他最稀缺的那种资源。
安静是一种设计决策，不是偷懒。
这里跟上一章心法里那句话是通的：每一个形式手段都有它对应的情绪代价，动效的代价是持续索取注意力。 你不是在选”对的做法”，你是在选愿意付哪种代价。
六、反例与误区
这一节集中说四个错误。它们都特别诱人，因为都”看起来很合理”。
误区一：我把颜色调准了，它在哪都该是对的。
前面已经说了：没有脱离参照系的准。你调的是关系，不是数值。
这个误区对程序员特别有杀伤力，因为色值看起来是客观的、可量化的，而你已经习惯了相信数字。但数字管的是物理端（屏幕发出多少光），感知管的是关系端（观众判断它是什么），中间隔着恒常和侧抑制两道加工，还有环境光这个巨大的变量。
正确的心态是：色值只是你的记账符号，不是作品的真相。 检验一个颜色对不对，唯一的办法是在接近真实的观看条件下看关系。
误区二：看不清就加粗、加黑、加边框。
三件事都在做同一件事：加重边界。
但边界一多，每个边界的分量就被稀释了——对比是相对的，你把什么都加重，等于什么都没加重。全画都是重点，等于没有重点。
更糟的是，过冲会让你加黑的东西比你预期的更重，于是你加过头，觉得”太重了”，往回调，来回震荡，一小时就没了。
正确的做法通常是反方向的：先做减法。把不该抢的东西压下去，看看还剩下什么。 大部分”发闷""发灰""重点不突出”的问题，答案不是加，是减。而且减没有天花板——你可以一直压暗到你想要的程度，而提亮到纯白就到头了。
误区三：渐变背景显得高级。
这个做法同时踩了三个坑：
它是无信息的平滑区域，眼睛在上面没有落点（第二节）；大面积渐变容易触发条带（第四节）；而且铺在主体后面的渐变会吃掉主体周围的局部对比，让主体发闷（第三节）。
渐变不是不能用。可以小范围、弱跨度地用，用在画面边缘、用在烘托气氛的地方，不要铺满，不要铺在主体正后方。
误区四：我盯着看觉得没问题，所以没问题。
这是四个里最危险的，因为它是你每天都在犯的那个。
你自己盯着自己的作品看的时候，你带着全部的前知识和预期。你知道它该是什么样，你知道那行字写的是什么，你知道那个按钮是干什么的——于是你的大脑直接把预期填进去了，你看到的其实是”你想看到的那张图”。
而这正是视觉系统的工作方式：它本来就是靠预测加填充在跑的。所以”自己盯着看”是最不可靠的检验方式，比随机找一个路人看还要不可靠。
可靠的检验方式，全部是围绕一个目的设计的：制造陌生感，破坏你对作品的预期。
眯眼，是破坏细节预期；倒过来看，是破坏识别预期；缩小到看不清，是破坏”我以为它层次丰富”的预期；隔一天再看，是破坏短期记忆；给别人看三秒然后问他记住了什么，是引入一个没有你那套预期的人。
上一章那三个看法，到这里有了机制上的解释：它们不是玄学技巧，是在人为地把你的视觉系统从”预测模式”切回”检测模式”。
七、跨场景：同一套机制，七个画面
我把这四个机制放进具体画面里，你感受一下它们的通用性。每个画面我都会写清楚里面有什么、放在哪、什么颜色、你的眼睛怎么走。
画面一：地铁通道里的一张电影海报。
画面上方三分之二，是一张巨大的侧脸，占满整个宽度。脸的亮部集中在上半部——额头和眼睛那一块，其余部分压到接近纯黑，下颌线以下是彻底的黑。片名是白色的粗体字，压在脸的下颌线附近，字号很大。底部一条窄窄的演职员名单，字号小到十米外完全看不清。
你从十米外走过来。眼睛落哪？落在那块亮的额头和眼睛上——它是全画对比最强的地方，也是唯一有细节的地方。你走到三米，第二眼落在白色片名上（白字压在暗底上，局部对比极强）。你走到跟前站定，才去看演职员名单。
这就是三层落点，对应三种观看距离。
注意它做了什么取舍：整张海报只有一个真正的高光，其余全是”无信息区”。 正是这些无信息区把高光托起来了。新手常犯的错是舍不得压暗——每个区域都留一点细节，结果高光不唯一，眼睛在画面上乱跳，三秒内什么都没记住。
画面二：一个后台管理系统的列表页。
页面里每行之间有一条 1 像素的浅灰分隔线，行高四十八。设计师量过线的色值，觉得已经很淡了。但产品反馈：“看着太密、太硬、有点脏。”
为什么？三十行就有三十条边界，每条边界都发生过冲，三十次过冲叠加，页面整体被”提重”了。单看一条线没事，三十条线一起就成了一片。
怎么办？把线调浅一点点没用——过冲还在，只是弱一点，三十条加起来还是重。两个有效方向：去掉线，改成隔行一个极浅的底色（比如比白深百分之三的灰），利用”宽而低的台阶”替代”窄而高的台阶”；或者干脆什么都不加，只靠行间距。后者最难做，但最干净，也是成熟度最高的界面最后都会走到的地方。
画面三：一件白衬衫在三家店里的颜色。
同一件白衬衫。A 店挂在冷白射灯下的不锈钢衣架上，B 店摆在暖黄灯下的木质货架上，C 店放在靠窗的自然光里。
在三家店里，你都觉得”这件是白的”。但你拍出来的三张照片颜色完全不同。
更要紧的是：如果你把 A 店那件和 B 店那件并排拿到同一个照明下，你会突然发现 B 店那件其实是米白的。你在 B 店完全没看出来——因为整个店的暖光、木货架的暖色，全都在给你提供”这是暖光”的参照，你的视觉系统老老实实地把那层黄扣掉了。
这解释了穿搭里一个很常见的坑：镜子前那盏灯，和办公室的日光灯，是两个参照系。 你在试衣间的暖光镜子里觉得这套很协调，第二天到办公室日光灯下一看，完全不是那么回事。不是衣服变了，是参照系变了。
也解释了为什么”单件看挺好，搭一起就怪”：一件衣服呈现出的颜色，取决于它周围有什么。这是恒常机制在服装上的直接后果。
画面四：PPT 里的”高级灰”到底死在哪。
一份 PPT：浅灰底、深灰字、一点点橙色点缀。在设计者的显示器上非常雅致。会议室一投，糊了。
三个原因叠加：
一，投影仪压缩了整体对比。它的暗部下不去（投不出真正的黑），亮部上不来（受环境光影响），浅灰底和深灰字的差距被两头挤压。
二，会议室开着灯，幕布周围是亮墙、白天花板、同事的白衬衫。参照系被整体拉高，你那块浅灰被重新解释成”更暗的灰”，字和底的差进一步缩小。
三，幕布本身反射率有限，整体亮度上限被压低，你的”高级灰”没有足够的动态范围来表现自己。
修法不是”把字加黑”。加黑是对抗症状，而且加黑之后在会议室里看着是好了，回到你自己的屏幕上就重得要命。
真正的做法是重建关系：把底色再压暗一档，让字底的差距大到连投影都吃不掉；同时把点缀色的面积加大——面积小的高饱和色在投影下会被压缩到几乎消失，你那点橙色在会议室里根本不存在。
一句原则带走：对比要在最差的观看条件下设计，不是在最好的条件下设计。
画面五：一张人像照片为什么”磨皮磨坏了”。
磨皮把皮肤的纹理抹平了。那些纹理是什么？是大量微小的明暗起伏。
这些微小起伏在视觉上提供的是”这是一个有质感的表面”的信息。抹平之后，脸变成一整块均匀的区域——眼睛在上面没有落点（回忆第二节：均匀区域会被跳过）。于是整张脸只剩下五官那几条边界。
更糟的是，五官的边界在这片均匀的”平原”上被过冲放大了（第四节），显得异常生硬。这就是为什么磨过度的照片，眼睛和嘴看起来像贴上去的剪纸。
所以脸看起来”平""假""塑料”，不是因为光滑本身不好看，是因为光滑把所有能证明”这是个立体的人脸”的差分信号都删掉了。
正确的做法不是不磨，是留下皮肤上那些不均匀的小变化——它们是材质的证据。第 25 章讲质感的时候会回到这一点。
画面六：超市货架上的一袋洗衣液。
整排货架，大部分包装是蓝白和浅绿，柔和、低对比、温和。中间有一袋，深蓝色底，上面一块高饱和的橙色区块，色块边界是硬边。
你从两米外扫过去，眼睛落哪？落在那袋上。
它抢到的不是”好看”，是”变化信号最强”：它的边界更硬、明暗和色相跨度更大。在一整排低对比邻居的衬托下，它是一个显著的差分事件。
这就是静止设计对”我不能动”的补偿（第五节）：用边界密度和跨度制造等效的变化。
反过来想这个画面：如果你的品牌必须用低饱和、柔和的调性（很多日化品牌确实需要传递”温和""不刺激”），那你就放弃了最强的注意力武器，得用别的手段补回来——独特的瓶型剪影（用形状制造差分）、货架的黄金层位（用位置补偿）、或者大面积重复的同一色块（用数量制造边界密度）。
每个形式手段都有代价，低饱和的代价是必须用别的手段把注意力买回来。这笔账你得自己算，不能假装不存在。
心法
这一章讲了四个机制，看起来是四件事，我把它们并排放一下你看看：
亮度恒常，是在消除”照明强度”这个绝对值，提取物体反射率的差。
侧抑制，是在消除”均匀区域”这个绝对值，提取边界处的差。
运动通路，是在消除”恒定状态”这个绝对值，提取时间上的差。
扫视采样，是在空间上做稀疏采样，只保留变化最大的那几个点。
四条通路，全是差分器。
你的视觉系统从来不报告”这是什么”，它报告”哪里变了、变了多少、变的排序是什么”。它对绝对值麻木，对差值敏感，而且这种麻木是主动的、结构性的——不是精度不够，是它压根不打算测。
这就是本章的元认知：视觉系统是一个差分器，不是记录器。所以设计的工作对象是”变化”，不是”内容”。
这句话能直接推出两个非常重要的结论。
第一个结论：加东西几乎永远是错的第一步。
往画面里加一个元素，做了什么？它增加了平均值。而平均值不携带任何信息——在一个差分器眼里，一个均匀的、没有变化的东西等于不存在。
你想让某个地方被看见，有效的做法是制造差值：把它周围的压下去，或者把它自己提上来。两种都是在制造差，而且前者往往空间更大。
这解释了为什么新手的作品总是”越改越乱”：他发现问题（重点不突出），他的第一反应是加（加个框、加个色块、加个图标），每一次加都让平均值上升一点、让差值摊薄一点，于是问题更严重，于是他继续加。这是一个正反馈的死循环。
第二个结论：你看自己的作品永远看不出问题，因为你在用错误的模式看它。
你自己看自己的作品时，你带着全部的预期。你知道那行字写的是什么，你知道那个按钮的用途，你知道那块空白下面原本是什么。于是你的大脑——这个靠预测加填充工作的机器——直接把预期填了进去。
你看到的不是你的作品，是你脑中那个作品的理想版本。
这就是为什么”自己盯着看”是最不可靠的检验方式，比找个路人看一眼还不靠谱。路人没有你的预期，他的差分器是开着的；你的差分器是关着的，你的预测器在替它工作。
所以所有可靠的检验手法，本质上都在做同一件事：制造陌生感，破坏预期，把差分器重新打开。
眯眼，破坏的是细节预期，逼你看大块的明暗结构。倒过来看，破坏的是识别预期，逼你看纯形式。缩小到指甲盖大小，破坏的是”我以为它层次丰富”的预期。打印出来拿远看，破坏的是”屏幕参照系”这个预期。隔一天再看，破坏的是短期记忆带来的预期。给别人看三秒问他记住了什么，是借用一个没有你那套预期的人的差分器。
你回头看这些手法，会发现它们的共同点不是”看得更仔细”，恰恰相反——是让你看得更不像作者。
这一层才是”看见”真正的难点。它不是注意力问题，是身份问题：你必须想办法摆脱”我知道这是什么”这个诅咒，才能第一次真正看见自己的作品。
最后一个跟你的老本行有关的类比，点到为止。
你排查一个性能问题的时候，不会把每个函数都优化一遍。你会先测量，找到那个差值最大、占比最高的热点，改那一处，然后重新测量。设计里的”测量工具”就是上面那些破坏预期的手法，而”热点”就是画面上差值最大的那个地方。
先测量，再动手。在没有测量之前做的修改，都叫试错，不叫设计。
而”试到不怪为止”之所以低效，是因为你连自己在测什么都不知道。
小结
这一章讲了四个机制：你的视网膜只有中心一小块是高清晰的，眼球每秒跳三次做稀疏采样，中间的空白由大脑缝合；亮度恒常让你把阴影里的白纸仍然判定为白纸，代价是你永远在按参照系解释颜色，屏幕和纸张的参照系完全不同；侧抑制在每一个明暗边界处制造过冲，让边界比它的物理值更重，这直接决定了界面里的线、边框、阴影和渐变该怎么处理；运动通路的优先级最高，变化会被无条件上报，恒定会被直接丢弃。
四条机制指向同一句话：视觉系统对绝对值麻木，对差值敏感。
所以你带走的一句话是：你设计的是关系，不是物件。 你手里真正的旋钮有两个——改元素本身，或者改它周围——而后者通常更宽敞、更有效。
还要带走一个动作：检验作品之前，先想办法让它变得陌生。眯眼、倒过来、缩小、打印出来拿远、隔一天、借别人的眼睛。这些不是玄学，是在手动把你的视觉系统从”预测模式”切回”检测模式”。
下一章我们往大脑那一侧再走一步。你的大脑不光会差分，它还非要补全——看到三个点就要连成三角形，看到一段断开的线就要接上。那套补全机制叫格式塔，它是”少即是多”这句话真正的出处。
【思考题】
-
找一个你常去的界面（外卖 App、公司后台、你手机里的任何应用），数一数它一屏之内有多少条分隔线、多少个边框、多少个描边。然后问自己：这些线里，有几条是”非有不可”的？如果把其中一半删掉，用间距或极浅的底色差代替，这个界面会更清爽还是更混乱？为什么？
-
你在自己的显示器上做了一张图，觉得灰蒙蒙的，于是把对比拉大了，看着舒服了。发给同事，同事说”对比太强了，眼睛疼”。你们的显示器可能差在哪？你该怎么做判断，而不是来回拉扯？
-
很多餐厅的菜单会把某个菜加一个方框、或者加个”招牌”角标，希望它更显眼。但结果常常是”加了等于没加”——整页看过去，那个框并不比别的地方更吸引你。用这一章的差分原理分析：这个做法为什么经常失效？什么东西才真的能让它跳出来？
-
找一个”暗调”的作品（一张夜景照片、一张黑色底的电影海报、一个深色模式的界面都行），分别在很亮的房间和关了灯的房间里看它。描述你两次看到的差别，然后用亮度恒常解释为什么会有这个差别。
-
你给一个元素加了阴影，觉得”发脏”。你可能做了哪几件错事？请至少列出三种不同的可能原因，并说明每一种的验证方法（怎么确认到底是哪一种）。
-
一个静止的页面想吸引注意力，有同学说”那就加个动效呗”。如果这个项目明确要求不能加动效（比如一张要印出来的海报、一个需要长时间阅读的后台页），你能给出哪几种”用静止制造变化”的替代方案？请具体到画面上该做什么。
【参考答案】
-
数线的过程本身比答案重要。你会发现的普遍情况是：一屏之内有二三十条边界，而真正”非有不可”的通常不超过五条。
判断一条线是否非有不可，标准是：去掉它之后，用户会不会分不清这两个区域是分开的？ 如果两个区域之间已经有足够的间距、或者内容本身在视觉上明显不同类（比如图和字），那这条线就是纯装饰，删掉它界面只会更清爽。
为什么删掉会更清爽而不是更混乱？回忆侧抑制：每一条线都在边界处制造过冲，一条线的过冲你感觉不到，三十条线的过冲叠加起来，整个页面就被”提重”了——你会觉得界面”硬""密""不够精致”，但你说不出是哪条线的问题，因为问题不在某一条线，在它们的总量。
替代方案有两个层级。低一级：把线换成极浅的底色差（比如白底配一个深百分之三的灰底），台阶变宽变低，过冲被摊薄，视觉重量下降而分区效果保留。高一级：什么都不加，只靠间距和内容的亲和关系分组——这是最难的，因为它要求你的间距系统本身是严谨的（间距必须有明确的倍数关系，不能随手拖），但做出来最干净。第 18 章讲亲密性原则时会回到这一点。
如果你的结论是”删掉一半会混乱”，那说明这个界面的分区其实是靠线在撑着的，一旦抽掉线，内容的组织关系就散了。这种情况下该改的不是线，是内容的组织。
-
可能差在三处，按可能性从高到低：
第一，显示器的亮度和对比设置不同。这是最常见的原因。同一张图在一台高亮度的屏上，暗部被抬起来了，整体显得”灰”；在一台正常亮度的屏上，暗部是暗的，你的”拉大对比”就过头了。
第二，色温不同。你的屏偏冷，同事的屏偏暖（或者反过来）。偏暖的屏会让暗部显得更闷，偏冷的屏会让中间调显得更”跳”。而且你注意不到自己的屏偏了——你的颜色恒常早就把那层偏色扣掉了，你是在一个被补偿过的感知里做判断的。
第三，环境光不同。你在暗房间里看，同事在明亮的开放办公区看。环境光会直接改变参照系（第三节第二层），同样的文件在两种环境下能被解释成两个东西。
怎么办？三件事，按重要性排序：
一，先校准参照物，不要校准感觉。 找一个双方都有的、已知正确的参照（比如同一个网站、同一张大家都认可的照片），各自打开看，把差异定位出来。如果连参照都差很远，那是硬件问题，先解决硬件。
二，在信息密集的地方留冗余。 关键的字底对比、关键的图底对比，要大到”在最差的观看条件下也成立”，而不是”在我的屏幕上正好”。这是第四节说的”按最差条件设计”。
三，接受一个事实：你不可能让所有人的观感一致，你只能保证在最差条件下依然可读。 设计的目标不是精确传达某个数值，是在一个范围里稳定成立。追求所有人看到一样的，是在追求一个不存在的东西。
-
加框失效的根本原因是：你加的是”绝对值”，而视觉系统只对”差值”敏感。
一个方框在视觉上是什么？是四条边界，四段过冲。它确实增加了这个菜名周围的边界数量。但问题是——如果整页菜单上每个菜名都是同样的字号、同样的行距、同样的排布，那么”加了框的那个”和”没加框的”之间的差值，只是四条线的过冲量。这个量在整页的噪声里太小了，尤其在菜单这种文字密集、边界本就密集的场景里，四条线的过冲被淹没在几十条文字边界的过冲里。
角标也是同样的道理：一个小角标增加的是一点点面积和一点点颜色，如果它周围的文字密度和它自己的”视觉重量”相当，它就完全不显眼。
什么才真的能让它跳出来？按差分原理，两条路：
一，压低别人。 让那个招牌菜的周围留出明显更大的空白（孤立），或者把它周围其他菜的灰度压低一档。这时候它不需要任何装饰就会跳出来——因为它周围的”平均亮度”降了，它的差值就上去了。这也是为什么高级菜单很少用框，用的是留白和字号差。
二，加大跨度，而不是加装饰。 如果一定要用手段，用”字号加大一档 + 行距加大”比用”加个框”有效得多，因为字号改变的是这个元素本身的能量级，而框只是加了几条边界。如果能再配一个与整页完全不同的、而且只出现一次的颜色（注意：只出现一次，出现三次就成了装饰），效果最好。
一句话：装饰是加法，突出是减法。 你想让某个东西显眼，先看看能不能把别的东西压下去。
-
如果你真的在两个环境里各看了一次，你会观察到这样的差别：
在关了灯（或者只留一盏很暗的灯）的房间里看，暗调作品会显得层次丰富、暗部有细节、整体氛围到位，你会觉得”这才是我想要的效果”。
在很亮的房间里看，同一张作品会显得一团黑、暗部糊成一片、中间调发灰发脏，你甚至会怀疑自己当时是不是调错了。
原因正是亮度恒常。在暗房间里，你的视觉系统估算出”当前环境照度低”，于是它把画面里的暗部往上解释一档——“照度这么低还能看出东西，说明这块表面其实没那么黑”。这个补偿帮你把暗部细节”还原”了出来。
在亮房间里，环境照度高，参照系被整体拉高，视觉系统的估算变成”这里照度足够，那这块就是真的黑”。于是暗部不再被补偿，全部压成死黑，中间调相对参照系也被拉低，显得脏。
这个观察有非常直接的实际后果，而且很多人栽在上面：
做暗调作品的人，习惯在暗房间里工作，然后交付一件只有在暗房间里才成立的作品。 用户在地铁上、在明亮的办公室里看它，看到的是一坨黑。
所以检验的规矩是：在你的作品最可能被观看的那个环境里检验它。 如果你的作品大概率会在明亮环境里被看，那你就要么把整体提亮一点，要么给画面留一两个真正的高光当锚（第三节说的锚点），让恒常系统有地方钉住。
顺便说一句，这也是为什么很多”深色模式”的界面在户外阳光下一片糊——同样的机制，只是它发生在系统级而不是你的一张图上。
-
“阴影发脏”至少有三种不同的成因，它们的验证方法和解法完全不同，混在一起调就会来回震荡：
成因一：模糊半径太小、浓度太高。 台阶太陡，过冲集中在一两个像素里，形成一圈清晰可见的脏边。验证方法：把阴影的模糊半径加大到原来的三倍，浓度减半，看脏边是否消失。如果消失了，就是这个原因。解法：大半径、低浓度、并且让阴影的偏移量小一些（大偏移会让阴影”脱离”物体，产生悬浮感，那又是另一种假）。
成因二：阴影的边界正好处在另一个高对比边界上。 比如你的卡片是白的，页面背景是白的，但阴影的边缘刚好压在了一条深色分隔线旁边——两个边界靠在一起，过冲叠加，就出现了脏边。验证方法：把那个元素挪开几十像素，看脏边是否消失。解法：拉开距离，或者把下面的东西改掉。
成因三：阴影的颜色是纯黑，而且是”物理正确”的。 现实世界里，很少有阴影是纯黑的——阴影里通常有环境光、有天空的散射光，所以真实的阴影是偏冷、偏灰、带一点环境色的。一个纯黑的阴影放在一个有颜色的背景上，会显得”贴上去的一块脏东西”。验证方法：把阴影的颜色从纯黑改成背景色的深色版本（比如背景是暖米色，阴影就用偏暖的深褐灰），看是否变干净。解法：阴影永远不要直接用纯黑，让它带一点环境的颜色。这个点第 24 章讲光影时会展开。
还有一个容易漏的：成因四，阴影叠在了纹理或噪点上。 半透明的阴影叠在带纹理的背景上，两者相乘会产生难看的斑驳。验证方法：把背景换成纯色，看斑驳是否消失。
这道题真正要给你的不是答案，是一个习惯：“发脏”是一种感受，不是一个原因。 遇到感受类的反馈，第一步永远是穷举可能的成因，然后设计能区分它们的验证动作。这跟你排查线上问题的思路完全一致。
-
不能用动效，就必须用”静止制造变化”。具体到画面上，有这些可做的：
一，制造边界密度。 在你想抢注意力的区域，使用小尺度、高对比的重复元素——细密的条纹、网点、密集的短线条。它们在眼睛扫过时会产生密集的差分信号，等效于”这里在动”。注意尺度：太粗的条纹不产生密度，太细的会在远处糊成一片灰，需要按观看距离调。
二，制造不协调。 让某个元素违反它”应该”的样子：把一个熟悉的物体放到不合理的位置，用明显超出常规的比例，让一个元素跨过它本不该跨过的边界（比如一张人像的手伸出画框）。识别阶段的预测误差会强制吸引注意力，这个机制比任何装饰都强。
三，制造唯一性。 全场只有一个高饱和色、只有一个圆角、只有一处不对称。唯一性是差值的一种——它不需要元素本身多强，只需要”全场的其他东西都不这样”。反过来说，这也是为什么”到处都是重点”等于没重点。
四，制造方向性冲突。 眼睛对”与周围趋势不一致”极其敏感。一排横排的文字里放一个竖排的元素，一片水平线里插一条斜线——它会被立刻捕获。
五，用”尺度跳跃”制造层次。 远看是一个巨大的强图形（大尺度对比，扫一眼就够），近看有精细层次（小尺度变化，给停下来的人）。这等于给不同距离的观众各准备了一次”新变化”，让作品在走近的过程中持续给出差分事件。
六，也是最容易被忽略的一条：利用观看者的运动。 海报贴在地铁通道里，观众是走着的——那么它的”强钩子”必须能在两秒内成立，也就是在两三次注视内被捕获。这就要求钩子足够大、足够简单、位置足够靠前（在观众的行进方向上游）。这不是把海报做得更花，恰恰相反，是把它在远距离下的信息量砍到只剩一个。
【动手练习】
-
同一个灰，四个参照系（二十分钟）
在任何能画矩形的软件里（演示文稿、系统自带的画图工具、网页编辑器都行），做这样一个东西：一个大矩形，从左到右分成三格，左边纯黑，中间深灰，右边纯白。然后画一个竖长的中灰矩形，从上到下贯穿全部三格——也就是说，同一个灰色，同时压在黑、深灰、白三个底上。
盯着看三十秒，然后回答：这三条中灰，看起来是同一个颜色吗？哪一段显得最深？哪一段显得最浅？
接着做第二步：把中间那条中灰的色值分别调成三段不同的值，调到它们”看起来一样深”为止。然后记下这三个数值，算一下深浅两段的差距有多大。
自评标准：如果你调出来的三个数值差距超过百分之十五（比如黑底上那段是 120，白底上那段是 95），说明你认真看了。如果三段数值几乎一样，说明你是在按”我知道它们是同一个颜色”来判断的，不是在按看到的判断——重做，这次强迫自己只看交界处附近，不要看整条。做完之后你应该能回答：想让一个元素显得更亮，除了调亮它，还有什么办法？
-
线 vs 底色差：一个界面的 A/B 对照（四十分钟）
找一张你手头有的界面截图（或者临摹一个你常用的列表页）。做两个版本：
版本 A：用 1 像素的中灰线分隔每一行。 版本 B：删掉所有线，改成隔行一个极浅的底色（选一个你觉得”几乎看不出来”的浅灰）。
把两个版本都缩小到原来四分之一大小（看不清字的程度），并排放在一起，退后两步看。
自评标准：合格的判断要说出具体差别，而不是”第二个好看一些”。你应该能指出：版本 A 在缩小后整体是否显得”更重""更密""有横向的条纹感”？版本 B 是否分区还在、但整体更整？如果你把两个版本缩到指甲盖大小之后看起来差不多，说明你的底色差选得太重了——调浅，浅到你觉得”这能看出来吗”的程度，再看一次。这个练习的收获应该是：你直觉里”够用”的对比，通常比实际需要的重两三倍。
-
找一个”被环境杀掉”的作品，并救活它（六十分钟）
找一张你以前做过的、或者你喜欢的暗调作品（夜景照片、黑底海报、深色界面截图）。做三件事：
一，在关灯或只开一盏小台灯的房间里看，写下你看到的层次（“暗部能看出云的轮廓""左下角那块是有细节的”）。
二，把它拿到最亮的地方看——最好是白天靠窗，或者开着全部灯。再写下你看到的层次。
三，做一个修改让它”在最亮的地方也成立”。可选的方向：给画面加一个真正的高光锚点（一小块接近纯白的区域）；把整体的中间调提亮一档；把最暗的地方稍微抬起来一点点（不是加黑）。
自评标准：把修改后的版本再拿回暗房间看。如果它在暗房间里变得”太亮了、氛围没了”，说明你改过头了——继续调，找到那个”在两种环境下都还行”的中间值。如果它在两种环境下都还行，你就完成了一次真正的”按最差条件设计”。最后写一句话记录：这次修改，你动的是元素本身，还是它周围？如果是元素本身，试着再做一个只改周围的版本，比较一下哪个更省力气。