设计师如何真正训练自己的审美
🎯 审美不是“看过多少好设计”，而是能看出细微差别、说清它为什么成立、并在自己的作品里重新做出来。训练方式也很具体：每天认真拆一个作品，量出它的数据，临摹骨架，做几个变体，再逼自己解释选择。
很多设计师卡在同一个地方：Behance 看了不少，Pinterest 收藏几千张，Awwwards 天天刷。看到别人的作品能判断“这个好看”，轮到自己做，又回到大标题、渐变、圆角卡片、阴影、玻璃效果。
原因不复杂：你训练的是“看过多少设计”，没有训练“为什么这样设计”。
审美真的提高之后，你看到同一个页面，脑子里的反应会明显不一样：
| 阶段 | 看到页面时的反应 |
|---|---|
| 起步 | 这个页面好高级。 |
| 中间 | 第一视觉落点是产品，标题承担第二层信息；正文宽度压得很窄；几乎没有装饰色；图片占了六成，所以整页很安静。 |
| 成熟 | 标题再放大会抢产品；按钮换成品牌色能让 CTA 更明显，但页面的安静感会被破坏。 |
走到第三行，你就从“喜欢设计”变成了“会判断设计”。
一、审美可以训练，练的是视觉分辨率
1. 人对视觉差异的敏感度是可以被练出来的
视觉知觉研究里有个概念叫视觉知觉学习（Visual Perceptual Learning），指的是人经过持续训练后，会越来越容易发现以前注意不到的视觉差异和模式。
这种变化在成年人身上同样会发生。研究发现，视觉训练可以改善从简单特征判断到复杂场景分析的能力；专家和新手的一个明显区别，是专家更快找到真正有用的信息，并忽略无关信息。(PubMed Central (PMC))
2. 新手和熟手看的其实不是同一张页面
两个刚学设计的人对着两版网页，大概只能说出：
A 更好看。
练过几年的设计师看到的是另一组信息：
A 的标题、正文、CTA 有清楚的三级关系；
左右边距统一；
图片和文字形成稳定比例；
正文行长没有过宽；
主色只出现在需要注意的位置。
看到的东西变多，判断自然会变准。所以训练审美最核心的一件事，就是不断提高自己的“视觉分辨率”。
二、为什么“刷设计网站”算不上训练
1. 有效练习需要目标、弱点和反馈
看优秀作品当然有用，但单纯重复一件事情不等于有效练习。美国心理学会在整理刻意练习研究时强调：有效练习需要明确目标、针对弱点、反复练习和反馈，重复自己已经会做的事情，提升很有限。(美国心理学会)
2. 高手练弱项，中等水平的人练强项
有一项研究让不同水平的人自己挑训练内容。结果高手更倾向练自己较弱的项目，中等水平的人更愿意练自己已经擅长的部分；最后高手在薄弱项上的提升也更稳定。(美国心理学会)
放到设计上是一模一样的：你喜欢配色，于是天天收藏配色；排版很差，却从不练排版。半年后，收藏夹变大了，设计水平没怎么动。
⚠️ 最常见的假训练：无目的地刷灵感网站、只收藏不拆解、只练自己本来就擅长的部分。这三件事都不会让判断力变准。
3. 把训练看成一个循环
有效的设计训练是这样一条链：
看 → 拆 → 仿 → 改 → 评 → 再做。
少了后面四步，前面两步基本白做。
三、先确定你要练的是哪一项能力
“审美”这个词太大，落到设计上可以拆成下面这些具体能力。先找出自己最弱的一两项，再决定练什么。
| 能力 | 你要观察什么 | 新手常见问题 |
|---|---|---|
| 视觉层级 | 第一眼、第二眼、第三眼看到什么 | 什么都想突出 |
| 布局 | 网格、边距、对齐、比例 | 元素像随手摆进去 |
| 留白 | 元素之间为什么空这么多 | 害怕空，所以一直塞 |
| 字体 | 字体、字号、字重、行距、行长 | 字体很多，层级很乱 |
| 颜色 | 主色、辅助色、背景色、强调色 | 到处都是颜色 |
| 图片 | 裁切、比例、构图、色调 | 找一张“差不多”的图就放 |
| 节奏 | 大小、疏密、重复、变化 | 每个模块长得一样 |
| 风格 | 哪些元素共同形成了这种感觉 | 只会套“高级感” |
| 信息表达 | 用户先知道什么，再知道什么 | 页面漂亮但看不懂 |
以字体为例。Apple 的设计指南提到，可以用字号、字重、颜色建立信息层级，而字体种类过多会削弱层级和一致性。(Apple Developer)
所以看到一个好页面，别停在“这是什么字体”，继续往下问：
H1 多大？正文多大？两者差多少？
行距是多少？标题和正文之间空多少？
为什么这里用粗体？
这些能被量出来的答案，才是你真正能带走的东西。
四、核心方法：用六步拆一个设计
以后每遇到一个你喜欢的作品，都走完这六步。
1. 先看 10 秒，不做分析
只记第一反应，然后马上写下：第一眼看到什么？第二眼？第三眼？
比如：
第一眼：鞋
第二眼：AIR MAX
第三眼：Buy Now
这就是页面的视觉顺序。如果你根本说不出来，说明这个页面的层级本身就不清楚。
2. 把页面简化成几个大块
暂时忘掉 Logo、文案和图片内容，只看形状：这里是一个大矩形，这里是一块文字，这里是一张图，这里有一大片空白。
这样看下来会发现，很多“高级设计”结构其实很简单。真正难的是比例。
3. 放进 Figma 量数据
不要只靠感觉，把它量出来：页面多宽、左右 Margin 多大、Grid 几列、图片占页面多少、标题多大、模块间距多少。
量过几十个优秀作品之后，你心里会形成一个“正常范围”，做自己的设计时就有参照。
4. 临摹骨架，先不做颜色
这是很多人最不愿意做、又最有效的一步。不用完整还原，第一遍甚至可以全部用灰色方块，只还原大小、比例、对齐、留白、字号。骨架对了，再补颜色和字体。
5. 做三个变体
临摹之后别停。比如原版是“左边文字，右边产品”，你再做三版：
版本 A：图片占 50%
版本 B：图片占 70%
版本 C：图片铺满
然后横向比较。单看一个方案，你很难说清它好在哪；审美很多时候是在比较里长出来的。
6. 逼自己解释选择
最后问一句：为什么这一版最好？禁止用“比较高级”“比较舒服”“比较有设计感”这类回答，必须具体到元素：
B 更好，因为图片占比提高后产品成了第一视觉焦点；标题退到第二层，但 CTA 仍然能被快速发现。
Stanford d.school 在设计反馈训练中也强调，评价应该回到作品的目标：哪些设计元素在服务这个目标，它们有没有真正达到。(Stanford d.school)
这一步练的是一种很关键的能力：给自己的设计找得出理由。
五、每天 40 到 60 分钟怎么安排
不用每天学两小时。每天 40～60 分钟坚持两个月，比周末一口气刷五小时 Behance 有用得多。
| 时间 | 做什么 |
|---|---|
| 10 分钟 | 看 10 个作品，只挑 1 个 |
| 10 分钟 | 分析视觉层级、布局、字体、颜色 |
| 20 分钟 | 在 Figma 临摹骨架 |
| 10 分钟 | 做一个自己的变体 |
| 5 分钟 | 写下 3 条观察结果 |
最后那三条要写得能复用，比如：
大图片不一定乱，只要文字区域足够克制。
标题和正文的层级主要来自字号，不一定需要换字体。
CTA 周围留白越大，越容易被看到。
💡 每天三条，一个月就是约 90 条属于自己的判断依据。这比收藏 900 张图有价值得多。
六、把设计网站按用途分开使用
别把所有网站都当“灵感网站”，每个站承担不同任务。
| 网站 | 用来练什么 | 怎么看 |
|---|---|---|
| SiteInspire | 网页布局 | 按 Grid、Typography、Minimal 等分类做定向训练 |
| Mobbin | UI、产品设计 | 看真实 App 怎么做 Login、Checkout、Settings |
| Awwwards | 创意网页、动效 | 看大胆方案，少直接照搬 |
| Fonts In Use | 字体 | 看字体在真实项目里怎么用 |
| Typewolf | Web Typography | 研究字体搭配和网页字体 |
| Brand New | 品牌判断 | 看别人为什么批评或认可一个品牌设计 |
| Cosmos | 建视觉资料库 | 跨摄影、建筑、平面、时尚找参考 |
SiteInspire 支持按 Typographic、Minimal、Grid Layout 等风格筛选，适合专项练布局。(Siteinspire)Mobbin 收录的是大量真实产品界面和用户流程，而不是为展示做的概念稿，所以更适合练产品设计。(Mobbin)Fonts In Use 收录字体在真实项目中的使用案例，研究字体时比盯着字体样张有效。(fontsinuse.com)
Brand New 的价值有点特殊：它会评论 Logo、品牌识别和改版项目，要看的是它“怎么评价”，而不只是案例本身。(UnderConsideration)Cosmos 则可以按颜色和视觉相似度继续找图，并整理成 Collection，适合长期积累视觉库。(Cosmos)
七、建自己的审美库，按“设计原因”分类
最没用的收藏夹长这样：好看的 UI、好看的海报、好看的网页、高级感。这种分类以后你什么都搜不到。
按设计原因分类才有用：
| 分类 | 里面放什么 |
|---|---|
| 极端留白 | 大面积空白仍然成立的作品 |
| 强 Typography | 字体承担主要视觉表现 |
| 单色设计 | 只有一个强调色 |
| 图片主导 | 图片面积超过 50% |
| 非对称 Grid | 明显不对称但仍然稳定 |
| 数据密集 | 信息很多但不乱 |
| 强第一视觉 | 3 秒内注意力非常明确 |
| 克制 CTA | 按钮不抢眼，但很好找 |
| 高级产品图 | 产品图构图特别好的案例 |
每存一个案例，顺手写一句“我为什么保存它”，比如“喜欢 Hero 里产品和文字 7:3 的比例”，或者“喜欢 Serif 标题配 Sans Serif 正文的反差”。以后你能直接搜“7:3 Hero”，而不是漫无目的地搜“高级网页设计”。
八、两个最容易掉进去的坑：颜色和“高级感”
1. 先做黑白灰，再加颜色
新手提高设计质量最快的一招其实很粗暴：**先把颜色拿掉。**黑白灰状态下层级清楚、布局舒服、内容好读，再考虑上色。
Apple 的设计指南也建议谨慎用色，让颜色承担信息、状态、品牌等明确作用，并保持含义一致。(Apple Developer)
2. 好看不能牺牲可读性
WCAG 2.2 建议普通文本对比度至少 4.5:1，大文本至少 3:1。(W3C)
所以“浅灰字配浅灰背景”可能看起来很高级，用户看不清，那就是差设计。
3. “高级感”不是通用答案
高级感常被简化成一套固定配方：大留白、小字、Serif、米白、黑色、大图、很慢的动画。于是一批网站长得一模一样。
成熟的判断应该先问：**这个设计适不适合它要解决的问题？**儿童产品可以很热闹，游戏网站可以很夸张，工业设备网站需要更清楚，奢侈品牌可以大量留白，而数据 Dashboard 不能为了留白把信息藏起来。
4. 漂亮会让人误判好用
NN/g 讲过一个现象叫 Aesthetic-Usability Effect：用户往往觉得漂亮的产品更好用，甚至会暂时忽略实际使用中的问题。(Nielsen Norman Group)
设计师要防的是反过来的那句话：“好看，所以它一定设计得好。”不一定。
九、用打分表找弱项，再按周补
1. 每完成一个作品，先打分
别问“好不好看”，这个问题太模糊。改成逐项打分：
| 项目 | 问题 | 1～5 分 |
|---|---|---|
| 第一视觉 | 第一眼是否知道看哪里 | |
| 层级 | 重要程度能不能一眼看出来 | |
| 对齐 | 有没有莫名其妙的偏移 | |
| 留白 | 哪些地方太挤或太空 | |
| Typography | 字号、字重、行距是否稳定 | |
| 颜色 | 每种颜色有没有明确作用 | |
| 图片 | 裁切、比例、色调是否合适 | |
| 一致性 | 同类元素是否使用相同规则 | |
| 功能 | 用户是否知道下一步做什么 | |
| 个性 | 有没有一个真正有记忆点的地方 |
找出分数最低的一项，下一次专门练它。
2. 一套 8 周训练顺序
| 周数 | 只练什么 | 作业 |
|---|---|---|
| 第 1 周 | 视觉层级 | 每天拆 3 个页面 |
| 第 2 周 | Grid + 留白 | 临摹 5 个网页骨架 |
| 第 3 周 | Typography | 临摹 10 套文字排版 |
| 第 4 周 | 配色 | 同一个页面做 5 套配色 |
| 第 5 周 | 图片 | 研究裁切、大小、位置 |
| 第 6 周 | UI Pattern | 在 Mobbin 拆 5 个真实流程 |
| 第 7 周 | 风格 | 同一内容做 3 种完全不同的风格 |
| 第 8 周 | 完整设计 | 独立完成一个网站或品牌项目 |
✅ 前四周先别追求创意，把比例、层级、对齐、文字、颜色练稳定。很多人的设计“差一点”，缺的通常不是创意，是基本功。
十、怎么判断审美真的提高了
变化会体现在你评价设计的方式上：
| 阶段 | 你会说的话 |
|---|---|
| 起步 | 漂亮。 |
| 进步 | 漂亮，因为…… |
| 更进一步 | 漂亮，但这个地方有问题。 |
| 成熟 | 这版看起来没有另一版惊艳，但更适合这个项目。 |
能说出最后一句，你已经有了自己的判断标准。
审美不是知道什么东西好看，而是能发现细微差异、说清它为什么成立、并在自己的作品里重新做出来。所以以后别再问“今天我要看多少好设计”，换成：**今天我要看懂一个什么设计？**一天真正看懂一个，一年就是三百多个，这个量足够把一个人的判断力往前推很远。