层级：一屏只有一个主角
什么都想强调等于什么都没强调。字号、字重、颜色三根杠杆怎么分配注意力，A/B 找茬揪出抢戏的界面
本页解决的问题
先给结论「层级：一屏只有一个主角」要解决的关键问题是什么？
什么都想强调等于什么都没强调。字号、字重、颜色三根杠杆怎么分配注意力，A/B 找茬揪出抢戏的界面
把品味变成产品可重复的行为。 有用的结果不是一句“我觉得更好”。它应该是一条看得见的规则、一个小例子，以及判断体验何时低于标准的方法。
记录一个前后对比，让别人不用听解释也能看懂质量线。
表面更精致了，却没有减少用户的不确定感。
注意力是稀缺资源，界面上每个元素都在抢。加粗、标红、放大，单独看每一下都有道理，叠在一起就互相抵消：五个主角同台，观众谁都记不住。层级的做法反过来，先选出一个主角，再让其余角色按重要程度递减。手里的杠杆就三根：
| 杠杆 | 怎么用 | 常见翻车 |
|---|---|---|
| 字号 | 主角比配角大一到两档就够，档位拉开、数量克制 | 三个元素都用最大号，大字互相打架 |
| 字重 | 正文 400、强调 700，两档打天下 | 满屏加粗，粗就失去了「更重要」的含义 |
| 颜色 | 强调色只给一个动作或一个数字 | 标红三处，读者不知道哪个红才是真警报 |
《About Face 4：交互设计精髓》第 17 章讲视觉层级，开头就把用户看界面的第一反应拆成两个下意识的问题：「这里什么重要」，紧接着「这些东西有什么关联」。Cooper 的结论：界面要靠建立层级和关系来回答这两个问题。层级答得好，用户几乎不会留意到它的存在；答得糟，混乱立刻跳出来。
这两个问题就是本节的验收口诀。下面每个案例，你都可以先自问一遍：主角三秒内找得到吗？哪些元素一眼能看出是一伙的？
下面是一张商品卡，三根杠杆都交给你：主标题字号、次要信息颜色、强调色数量。拉动它们，观察卡片的「主角」怎么变。
新手立层级爱走加法：主角不够醒目？加大、加粗、上底色。Cooper 给的建议正好相反：两个元素抢注意力时，调低次要的那个，胜过调高重要的那个。调低给主角腾出了空间；调高只会掀起军备竞赛，这一版标题加大，下一版按钮跟着加大。原书的比方：满屏每个字都是红色粗体时，哪个字凸显得出来？
层级要靠视觉变量传出来，但变量分两种脾气。《About Face 4》沿用 Bertin《图形符号学》的分析：大小和色值（明度）是有序变量，人眼会自动把「更大」「更深」读成「更重要」；色调（红、蓝、绿）没有天然顺序，读者排不出红和蓝谁先谁后，还会往颜色里猜含义。传层级，优先用有顺序的那两根杠杆。
检验层级有个零成本的办法，图形设计师叫它眯眼测试：眯起眼看屏幕，细节糊掉之后，看哪些元素还突出、哪些自动缩成一组。《About Face 4》把它列为检查层级和关系的常规手段，换个角度看，总能发现之前没发现的布局问题。下面两块界面，按住按钮模拟眯眼，自己比一比。
一屏只有一个主角。读者扫一眼就在问「什么重要」「什么相关」，先选出主角，其余按关系递减，两个问题才有答案。
三根杠杆各拉一档就够：字号大一到两档、字重两档、强调色一处。传层级优先用大小和明度这两个有顺序的变量，色调留给分类。
想强调，先做减法。调低配角比调高主角管用；砍戏份从离核心决策最远的元素下手。
交付前眯一次眼。模糊之后还分得出主次，层级才算立住；分不出，回去重拉杠杆。
内容来源：newwebplay AI「审美工程」专题原创；部分设计原则整理自《About Face 4：交互设计精髓》第 17 章（Alan Cooper 等著）。
从「什么都想强调，等于什么都没强调」把感觉变成判断
「注意力是稀缺资源，界面上每个元素都在抢。加粗、标红、放大，单独看每一下都有道理，叠在一起就互相抵消： 五个主角同台，观众谁都记不住 。层级的做法反过来，先选出一个主角，再让其余角色按重要程度递减。手里的杠杆就三根」指出，AI 降低了做出“能用”成品的门槛，读者真正需要练的是看出哪里不对，并把感觉说成可以执行的要求。
观察用户的下一步，而不是只看表面
「《About Face 4：交互设计精髓》第 17 章讲视觉层级，开头就把用户看界面的第一反应拆成两个下意识的问题： 「这里什么重要」 ，紧接着 「这些东西有什么关联」 。Cooper 的结论：界面要靠建立层级和关系来回答这两个问题。层级答得好，用户几乎不会留意到它的存在；答得糟，混乱立刻跳出来」可以转成几个可观察的问题：用户是否知道现在发生了什么，是否知道下一步做什么，出错或空白时能否恢复，以及信息层级是否让重要内容先被看见。
漂亮不等于容易用
把「交付前眯一次眼。」用在第二个页面或流程上，记录一个具体犹豫点和一个改动后的用户动作；能被观察到的变化，才是体验改善。
从「什么都想强调，等于什么都没强调」走到「读者扫一眼，心里在问两个问题」
「什么都想强调，等于什么都没强调」先把问题落在「注意力是稀缺资源，界面上每个元素都在抢。加粗、标红、放大，单独看每一下都有道理，叠在一起就互相抵消： 五个主角同台，观众谁都记不住 。层级的做法反过来，先选出一个主角，再让其余角色按重要程度递减。手里的杠杆就三根」上；到了「读者扫一眼，心里在问两个问题」，讨论继续推进到「《About Face 4：交互设计精髓》第 17 章讲视觉层级，开头就把用户看界面的第一反应拆成两个下意识的问题： 「这里什么重要」 ，紧接着 「这些东西有什么关联」 。Cooper 的结论：界面要靠建立层级和关系来回答这两个问题。层级答得好，用户几乎不会留意到它的存在；答得糟，混乱立刻跳出来」。两段连起来，重点就不只是记住一个结论，而是看清它成立所依赖的条件。
把这条判断带到下一个场景
评估体验时，把抽象的“好看”或“顺手”换成用户动作：他是否看懂状态、找到了下一步、能从错误中恢复，并且愿意继续使用。
- 「什么都想强调，等于什么都没强调」：注意力是稀缺资源，界面上每个元素都在抢。加粗、标红、放大，单独看每一下都有道理，叠在一起就互相抵消： 五个主角同台，观众谁都记不住 。层级的做法反过来，先选出一个主角，再让其余角色按重要程度递减。手里的杠杆就三根
- 「读者扫一眼，心里在问两个问题」：《About Face 4：交互设计精髓》第 17 章讲视觉层级，开头就把用户看界面的第一反应拆成两个下意识的问题： 「这里什么重要」 ，紧接着 「这些东西有什么关联」 。Cooper 的结论：界面要靠建立层级和关系来回答这两个问题。层级答得好，用户几乎不会留意到它的存在；答得糟，混乱立刻跳出来
- 「最后的要点」：这两个问题就是本节的验收口诀。下面每个案例，你都可以先自问一遍：主角三秒内找得到吗？哪些元素一眼能看出是一伙的
最后的「最后的要点」把讨论落到「这两个问题就是本节的验收口诀。下面每个案例，你都可以先自问一遍：主角三秒内找得到吗？哪些元素一眼能看出是一伙的」。回看这条线索时，最值得保留的是：当输入、规模或风险改变，哪些判断需要重新做一遍。
我把这篇文章里的一个判断改写成了今天可以验证的小实验。比记住结论更有用的是，知道下一步要观察什么。
读完以后我先回头找它成立的条件，而不是直接把方法搬进项目。这个顺序让后面的取舍清楚很多。
如果把这个判断放到真实工作里，最先需要补的约束是什么？我想知道从阅读到第一次实践之间，哪一步最值得先做。
还没有这篇文章的讨论。