有连线的元素被感知为相关
别名: 连接性原则 · connectedness · 连线分组
概念解释
两个元素之间只要画一条线、一根引线,或者共用一段边缘,人就会把它们看成相关的一对——哪怕它们颜色不同、形状不同、离得也不算近。这条知觉线索叫连接性(uniform connectedness)。
它和"箭头表示方向"是两回事:连接性只负责"这两个东西有关系",至于关系是先后、从属还是并列,得靠线本身的样式(箭头、虚实、粗细)另外表达,连线只是分组,不自带方向含义。
机制
接近性、相似性都要求视觉系统先分别识别出两个独立的元素,再去比较它们之间的距离或外观是否一致;连接性不需要走这两步比较,因为一条实际连着两端的线段,在最早期的图形处理里就已经是一整块连续的视觉区域——线和它两端连着的东西,在被识别出各自是什么之前,已经被当成同一整体的一部分处理了。
正因为这个"是不是同一整体"的判断发生得比逐个识别元素还要早,连接性给出的分组结果会盖过后续基于间距或外观做出的比较,除非线本身很弱(很细、很淡、被其他线条干扰)。
怎么研究
经典范式是把连线和接近性、相似性放在直接冲突的位置:三个元素里,用一条细线把距离较远、颜色不同的两个连起来,同时让第三个元素离其中一个更近或颜色更像。让被试报告"哪两个是一组",看结果跟着连线走还是跟着间距、颜色走。这类实验反复发现,只要连线本身清晰可辨,报告结果几乎全部跟着连线走,间距和颜色的差异几乎不起作用。
这套操纵只改变"是否画线"和"线连向哪两个元素",其余间距、颜色保持不变,从而把分组结果的变化单独归因于连线本身,而不是画面整体复杂度的变化。
边界
连接性依赖的是线本身能不能被清楚看出"连着两端"——线过细、被其他元素遮挡、或者和背景对比度过低,效果会明显减弱;一段被截断看起来像是独立标记而不是连线的图形元素,也不会触发这条线索。
当画面里同时有多条连线交叉或并行时,某条线到底连向哪两端本身可能变得含糊,这时连接性能不能可靠地传达"这两个是一组"要单独确认,不能假设连线一定清楚。
怎么落地
- 需要明确表示"这两个控件是关联的",比如一个筛选条件和它作用的结果区域,画一条可见的连线(哪怕很细)比单纯拉近间距或统一配色更可靠,尤其当间距和配色因为其他布局约束无法调整时。
- 连线的粗细和对比度要保证在最终配色(含深色模式)下依然清晰可辨,不能只在设计稿默认背景下勉强看出。
- 验证办法:把连线去掉,只保留元素本身的间距和外观,看用户是否还能猜出哪两个有关系;如果猜不出,说明连线确实在独立承担传达关系的功能,去掉它这层信息就丢了。