F1.03.1Gestalt proximity设计研究

相关元素的空间距离即认知距离

别名: 邻近即相关 · proximity compatibility · 认知距离

概念解释

价格贴着商品名,人把它读成这件东西的价格;价格跑到页脚的「小结」里,同一串数字要先被认领,才进得了比较。格式塔邻近(Gestalt proximity)把空间距离当成「是不是一回事」的第一证据:近就是相关,远就是别人的。

标签和输入框、图例和它所注的那根线、头像和用户名,都靠这段距离被编成一个对象。拆开之后不是「难看」,是工作记忆里多了一个待认领的碎片。

机制

视皮层对距离极敏感,分组在识别字义之前就完成了。邻近是廉价线索,比边框、底色、标题都先到达。Wickens 的邻近相容性把它说成一条加工原则:需要被合在一起用的信息源,空间上也该合在一起;需要被分开处理的,就该拉开。距离于是不再是审美余量,而是认知上的粘合剂或隔离带。

中间一旦插进与这段关系无关的元素,粘合剂会被那个闯入者抢走——输入框和它的错误文案之间夹了一条推荐,错误就会被读成推荐的一部分。

怎么研究

用分组判断任务:给同一套元素两到三种间距方案,问「哪些是一回事」,或让人完成必须把两端合在一起用的任务(对照标签填值、对照图例读数)。

自变量:组内间距与组间间距的比值、有无闯入元素、有无边框等补偿线索。 因变量:分组正确率、把无关项并入本组的次数、完成整合任务的时间。

眼动可以看两端是否被当成一次注视簇;但行为上的认领错误更接近真实代价。

边界

需要被比较的两项(两个套餐价)如果贴得过近,会被合成「一个价」,比较所需的分离被邻近吃掉。表格靠网格对齐工作,单元格之间的近不能再被读成「同一字段」。阅读方向相反的界面里,「近」的默认侧会翻面,左贴标签的习惯会把关系送到错误的一侧。屏幕阅读器按源顺序而不是像素距离来分组,视觉上的邻近帮不到它,要靠标签关联。

怎么落地

  • 先列必须被合在一起理解的对:标签–字段、名–价、图例–系列,让每一对的间距显著小于它到下一对的间距。
  • 错误说明贴着出错的那一个字段,不要汇总到表单底。
  • 需要拿来比较的两项,拉开到不会被读成同一对象,再在它们之间做对齐。
  • 验证:打乱文案内容只留位置,让人圈「哪些属于同一个东西」。圈错的每一组,都是距离在说谎。

延伸

  • 同组F1.03.2 每次视线跳转都有重新定位成本 · F1.03.3 高频组合操作应聚拢布置
  • 相邻F1.01 操作点与作用对象的距离 · F2.06 邻近性分组
  • 站内检索Gestalt proximity · proximity compatibility · cognitive distance

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/F1.03.1