CRAP 是 Robin Williams 在《写给大家看的设计书》（1994 年首版）中提出的四条基础设计原则：对比（Contrast）、重复（Repetition）、对齐（Alignment）、亲密性（Proximity）。它把复杂的设计原理压缩为四条可检查的规则，适用于海报、文档、PPT、UI 等一切排版场景。

四原则概览

原则	英文	核心含义	一句话自查
对比	Contrast	重要元素与次要元素拉开明确差异	一眼能看出哪里最重要吗？
重复	Repetition	同角色元素复用一致的视觉特征	同类功能看起来像同类吗？
对齐	Alignment	每个元素都与画面中其他元素有视觉联系	有没有"随手一放"的元素？
亲密性	Proximity	相关元素靠近成组，无关元素分开	信息分组一眼可读吗？

对比（Contrast）

定义：让重要元素与其他元素产生明显差异（大小、颜色、字重、形状），从而建立视觉焦点。

操作要点：

• 对比要"足够不同"：要么形成清晰差异，要么干脆不做——两种相近的灰色、两个相近的字号只会让版面显得犹豫不决。
• 常用对比维度：字号、字重、颜色（互补色/强调色见 色彩理论-基础与色轮）、留白量。
• 一个版面只保留 1-2 个最强焦点，其余元素服从层级。

重复（Repetition）

定义：让承担相同功能的元素共享一致的视觉特征（颜色、字体、间距、图标风格、线宽），形成统一与连贯。

操作要点：

• 同一级标题用同一种样式、按钮用同一套配色、图标用同一线宽，用户会自然把这些元素归为同类。
• 跨页面（PPT、网站、手册）时，重复让用户识别"这还是同一个产品"。
• 重复不等于单调：可以有意识地在统一中制造少量例外，例外即强调。

对齐（Alignment）

定义：页面上每个元素都应与另一个元素存在某种视觉连接，避免随意摆放。

操作要点：

• 左对齐最易读、最常用；居中用于少量装饰性文本或标题；避免同一版面混用多种对齐方式。
• 善用隐藏的"对齐线"（网格），让版面看起来干净、精致、有条理。
• 检查方法：眯眼观察，看是否存在"差一点对齐"的游离元素。

亲密性（Proximity）

定义：逻辑相关的元素在物理上靠近，组合成一个视觉单元；无关元素拉开距离。

操作要点：

• 亲密性直接传递信息结构：标题与正文靠近、按钮与说明靠近、图注与图片靠近。
• 与格式塔"接近性"原理一致（详见 设计原则-视觉层级与留白）：靠得近 = 有关系。
• 不要为了填满版面而把无关信息硬凑在一起。

综合使用顺序

1. 先按内容逻辑分组 → 排亲密性。
2. 用对齐把各个分组"钉"在网格上。
3. 用重复统一同层级元素的样式。
4. 最后用对比把最重要的信息突出出来。
5. 完成一版后，用上表四句自查逐一检查。

常见误区

• 全都要突出：处处对比等于没有对比，最终只保留一个最强焦点。
• 差不多对齐：视觉上"差一点"比完全不对齐更难受。
• 重复不足：页面之间风格漂移，用户认不出是同一体系。
• 亲密性失效：把无关信息硬凑一起，或把相关组拆散到页面各处。

一句话总结

CRAP 四原则的落地顺序是亲密性→对齐→重复→对比；最大误区是处处突出，一个版面只保留 1-2 个最强焦点。

关联概念

• 进阶阅读：设计原则-视觉层级与留白（F/Z 阅读模式、格式塔、负空间）
• 配色支撑：色彩理论-基础与色轮（对比的色相维度）
• 生成式设计中的应用：提示词工程-基础与框架（描述版面结构时同样遵循 CRAP）