当需要通过视觉属性跨距离表达同类关系时…

元素不一定相邻时，用共享视觉属性让用户把它们自动感知为同一类别，并保持编码一致。

适用场景

解决思路

1. 在设计视觉语言时应用相似性原则：用共享的颜色、形状、大小和风格来标示元素属于同一类别或群组。
2. 保持相似性编码一致，让同一视觉属性始终表达同一关系，避免信号失去意义。
3. 利用大脑会自动按相似性分组且无需说明的机制：让需要被感知为同类的元素共享视觉特征，即使它们在空间上不相邻。
4. 用颜色承载相似性：相同填充色表示相同类别、角色或状态。
5. 用形状承载相似性：让图标采用同一风格（描边、填充或圆角）以被读作一套。
6. 用大小承载相似性：相等大小读作同级；用大小差异表示层级。
7. 用风格承载相似性：保持相同插画粗细、相同字体处理、相同圆角半径、相同描边宽度。
8. 让相近元素使用相同颜色，以同时强化邻近性和相似性，形成最强分组信号。
9. 让相距较远的元素使用相同颜色，以用相似性跨越距离完成分组。
10. 当相近元素需要分成子组时，让它们使用不同颜色，使颜色把邻近元素拉入不同子组。
11. 当相近元素集合内部需要子组时，让它们保持邻近但使用不同风格，使邻近先成组、风格差异在组内创建子组。
12. 当需要让相似性覆盖邻近性时，故意让某元素在颜色或风格上与周围组不同（例如在蓝色组中放红色元素），使其即使空间相邻也读作独立，以标示类别边界。
13. 交互状态 signaling：让所有可交互元素共享某个非交互元素没有的视觉属性（颜色、下划线处理、光标提示），无需说明即可告诉用户哪些可操作；该相似性集合定义可交互类别。
14. 类别与角色编码：导航项作为一组，所有导航项使用一致字体处理。
15. 破坏性操作：只在该类别内使用一种独特颜色；集合内的相似性表示“这些操作都带同样风险”。
16. 状态指示器：一致应用颜色到含义的映射（绿色=成功，琥珀色=警告，红色=错误）。
17. 当任何元素无目的地偏离已建立的相似性集合时，把这种偏离视为有意义，像该元素属于另一类别；因此不要无意造成偏离。
18. 设计系统与组件一致性：所有按钮变体使用相同按钮形状。
19. 设计系统与组件一致性：所有表单元素使用相同输入高度和边框处理。
20. 设计系统与组件一致性：所有图标使用相同描边粗细和风格。
21. 把非预期的相似性破坏（例如本应同类型但圆角半径略有不同的两个按钮）读作类别差异，并当作 bug 处理。
22. 数据可视化：同一颜色表示报告内所有图表中的同一数据系列。
23. 数据可视化：同一标记形状表示跨图表类型的同一变量。
24. 数据可视化：在多系列可视化中，按相似性（颜色、形状）分组优先于空间邻近性，并将此作为标准做法。
25. 在设计 token 中定义相似性词汇表：明确哪些视觉属性编码哪些关系类型。
26. 把非预期视觉差异当作 bug：如果两个元素应读作同一类型，它们必须看起来完全一致。
27. 对关键类别信号使用冗余编码（形状+颜色，而非仅颜色），使信息在色盲观看和单色渲染下仍可辨。
28. 在不使用颜色的情况下测试相似性分组：仅凭形状和大小，元素是否仍读作相关？
29. 检查密集布局中由相似性与邻近性交互产生的非预期子分组。
30. 避免无意中破坏相似性：本应统一的一组中出现轻微视觉不一致，会暗示设计者未意图的差异。
31. 避免过度使用单一属性：用同一种颜色编码过多不同类别，会使该属性作为信号失去意义。
32. 避免仅依赖颜色相似性：色盲用户无法区分仅靠色相编码的组；始终使用冗余编码。

适用边界 · 注意事项

• 主要目标是按空间位置分组时，不应依赖相似性，应改用 law-of-proximity。
• 类别过多且只能使用同一视觉属性（如仅颜色）时，不应依赖相似性单独编码，否则该属性不再有区分意义。
• 关键分类信息需要在色盲观看或单色渲染下仍可读时，不应只依赖颜色相似性，必须使用冗余编码（如形状+颜色）。