F2.06.1in-group gap vs between-group gap设计研究
组内间距必须显著小于组间间距
别名: 邻近性原则 · proximity · 组内组间
概念解释
一组开关内部隔 8 px,组和组之间也隔 8 px,邻近性给不出答案:哪几个是一伙的?组内间距必须显著小于组间间距——不是「记得留空」,而是要有一眼能感到的对比。16 对 20 不够显著;8 对 24、12 对 32 才开始像两条不同的缝。
留白那一组讲空能不能当分组工具、空太少或太多会怎样。这里只锁这一条不等式。
机制
格式塔的邻近性是比较:更近的归一组,更远的分边。绝对像素不分组,比值(至少是可辨的差值)才分组。差值低于阈,两个间隙被看成同一档,「组」这个范畴不会出现。
「显著」大约要跨过间距标度上的一到两档,而不是微调。人眼对空间差的分辨粗,设计里觉得「已经拉开了 4 px」在知觉上等于没拉。没有这条不等式,边框和底色会被迫上场去冒充分组,那是后话。
怎么研究
经典做法是给被试一堆点或色块,系统变化组内距离与组间距离,让他们报告看到几组、或圈出同组。自变量是两个距离及其比;因变量是报告的组数、与实验者设定的符合率、反应时。界面版可以把点换成设置行、表单字段,看用户在卡片上画的圈是否等于设计意图。
点阵刺激的阈不能直接当 padding 规范:界面还有标题、线、色。比值规则仍然适用,具体数字要在真组件上重测。
边界
有强边框或强底色的对象,邻近性被共同区域盖过,即使组内组间一样,盒子仍能成组——但盒子贵,而且一多就失效。动画展开时的瞬时间距不必满足不等式。极密的数据格用线分格,空被留给数字本身。
从右到左、竖排,比较的是对应方向上的距离,不等式方向不变。
怎么落地
- 给每种组写两档:组内一档、组间至少跳一档(更好跳两档)。页面上禁止用同一档同时当组内和组间。
- 先改间距再加线。线是备份,不是不等式的替代。
- 验证:在五个真实组上量组内最短缝和组间最短缝,算组间/组内。低于约 1.5 的组,在截图上用两种颜色标出这两条缝,把组间加到比值跨过 2,再请没看过稿的人圈组。圈错的地方继续加对比,不要先画线。