把模糊的感觉
练成能说出口的判断

今天，先练一组眼

每天一组对比。先别急着选——用五问法逐条把两张的差别说出口，再揭晓要点、打卡。眼力是天天练出来的，不是看一遍就会的。

先把焦虑卸掉

真相是：你心里早有判断力。你能感觉到一个页面"廉价""吵""单薄"——这些都是判断。问题只在于：感觉停在嘴边，说不成具体的词，于是没法要求 AI、没法验收产出。

所以训练的核心不是"培养品味"，而是建立词汇和建立判断的标准。一旦你能说出"这里字太细、强调色铺太满、没层级"，你就已经在做设计师做的事了。

好设计拆开看，只有五个维度

字体、颜色、间距与布局、层次、质感与氛围。每一维都给你：原理 → 可套用硬规则 → "平庸 vs 讲究"对比 → 词汇 → 你的偏好标注。

① 字体 Typography

字体是页面的"语气"。同样一句话，粗衬线在喊，细黑体在低语。新手最容易栽在两处：用了通用字体（Inter/Arial） 和 字号字重没拉开层级。

• 最多两款字体——一款有性格的标题 + 一款干净的正文（Hobday）。
• 正文 ≥16px，行长约 70 字符，太宽难读（Hobday）。
• 大字收紧字距行高，小字放开（Hobday）。
• 层级靠"大小 / 字重 / 颜色"三杠杆，让人不读完也能扫懂结构（Refactoring UI）。

② 颜色 Color

最容易暴露"AI 味"的就是颜色——紫渐变 + 高饱和铺底是头号嫌疑。讲究的配色往往很"省"：大面积低饱和打底，一抹高饱和点睛。

• 近黑近白，别用纯黑纯白（Hobday 规则 1）。
• 60 / 30 / 10：主色 60% + 辅色 30% + 点睛 10%；亮色只配当那 10%。
• 先灰度设计，最后才上色——逼你用层级而不是颜色撑场（Refactoring UI）。
• 中性色也微微染色（暖或冷，别又暖又冷），调色板各色亮度要拉开（Hobday）。

③ 间距与布局 Spacing

留白不是"没东西"，是高级感最便宜的来源。布局的真功夫是用间距表达关系：相关的靠近、无关的拉开。

• 用约束尺度：4 / 8 / 16 / 24 / 32 / 48 / 64，别随手敲 13px、27px（Refactoring UI）。
• 相关元素更近：标签离它的输入框，要比离上一组更近（Refactoring UI）。
• 外边距 ≥ 内边距；按钮水平内边距约为垂直的两倍（Hobday）。
• 所有东西都要和别的东西对齐，用 12 列栅格（Hobday）。

④ 层次 Hierarchy

层次 = 让眼睛知道"先看哪、再看哪"。当一切都在抢注意，就没有重点。刻意压低次要内容，主内容才显出来。

• 三杠杆：大小、字重、颜色——组合出层级（Refactoring UI）。
• 按视觉重量排序，重的先、轻的后（Hobday）。
• 刻意 de-emphasize 次要内容：把它变小、变灰、变轻。
• 高对比留给重要元素，次要的降低对比（Hobday）。

⑤ 质感与氛围 Texture

纯白平铺会显单薄；但"加氛围"≠"加渐变"。可以靠近白底色、有存在感的边框、克制的阴影、纸感纹理来给深度——你正好不喜欢渐变，那就走边框+阴影这条路。

• 容器边框要同时和容器、背景都有对比（Hobday）。
• 阴影模糊值 ≈ 距离值的两倍；暗色界面里别用阴影（Hobday）。
• 别混用多种"深度技法"（阴影+描边+渐变堆一起会脏）（Hobday）。
• 简单放复杂上、或复杂放简单上——背景与前景要有繁简差（Hobday）。

亲手感受：每个变量怎么改变气质

练眼最快的方法是控制变量——只动一个旋钮，看气质怎么变。拖动滑块，盯右边那张卡片的感觉变化。

两个里挑更讲究的那个

30 道对比题，按五维分类。凭第一直觉点一个，答完看解析——重点不是答对，是知道为什么。下面用标签只练某一维，底部「练眼档案」会累计统计、告诉你最该补哪一维。

Refactoring UI 的名招：先灰度，最后上色

如果一个设计在纯灰度下层级依然清楚，它的结构就是扎实的；如果灰度下就糊成一团，说明它在用颜色掩盖层级缺陷。点按钮抽掉颜色试试——好设计经得起这一关。

抽掉颜色 →

去网上"喂眼睛"：高信噪比的好设计在这

关键不是被动收藏，是主动拆解：每看一个，用第 02 节的五问法问一遍"它好在哪条规则上"。

拿不准时，先套这些"安全规则"

来自 Anthony Hobday，本地化中文。它们不是必须遵守，而是"安全默认"——没把握时照做不会错，懂了之后可以打破。

展开 28 条可安全套用的视觉规则

1. 用近黑近白，别用纯黑纯白。
2. 给中性色微微染色（暖或冷）。
3. 重要元素用高对比。
4. 设计里每个选择都要是有意的。
5. 视觉对齐常优于数学对齐。
6. 大字收紧字距行高，小字放开。
7. 容器边框要同时和容器、背景对比。
8. 所有东西都要和别的东西对齐。
9. 调色板里各色亮度要拉开。
10. 染色中性色时只用暖或只用冷，别混。
11. 各种尺寸之间应有数学关系。
12. 元素按视觉重量排序。
13. 用横向栅格就用12 列。
14. 间距应放在高对比的交界处。
15. 更近的元素应更浅。
16. 投影模糊值 ≈ 距离值的两倍。
17. 简单放复杂上，或复杂放简单上。
18. 容器颜色保持在亮度范围内。
19. 外内边距 ≥ 内内边距。
20. 正文≥16px。
21. 行长约70 字符。
22. 按钮水平内边距 ≈ 垂直的两倍。
23. 最多两款字体。
24. 圆角要正确嵌套（外大内小）。
25. 别把两条硬分割线并排。
26. 暗色界面里别用阴影。
27. 别混用多种深度技法。
28. 和文字搭配的图标降低对比。

你的个人标尺（常驻）

这是从我们对话里提炼的你本人的偏好，跟 02_我的审美档案.md 同源。判断任何产出，先拿它对一遍。