C3.18.2Sibling yield animation设计研究
其余项的让位动画表达落点
别名: 让位动画 · 落点空隙 · drop gap
概念解释
排序拖动中,未被抓住的项应让出空隙(sibling yield / gap animation),把即将插入的序号做成一条可见的缝。落点不是松手后才揭晓的索引,而是拖动过程中由邻居位移持续预报的位置。没有让位,用户只能对着一条静止列表猜测“松开会插在哪两行之间”。
机制
命中测试把浮起项的中线或热区映射到一个插入下标;该下标两侧的项沿主轴平移,空出约等于被拖项高度的间隙。动画必须快到能跟上手指,又慢到不被当成闪烁。让位是空间预测,不是装饰:视觉系统用间隙当锚,比读数字序号更省工作记忆。若只有被拖项在动、邻居死锁,插入下标就变成不可见状态,错误投放会在松手瞬间才暴露。
怎么研究
记录目标下标与松手下标的偏差、中途修正次数、以及用户能否在松手前口头报出将插入的位置。自变量包括让位有无、动画时长、行高是否可变、以及是否显示插入线。眼动可看注视是落在间隙上还是落在被拖项上。不要只用最终顺序对错当指标——对了也可能是反复试错后的碰巧命中。
边界
网格排序的让位是二维的,空隙可能出现在行末折行处,不能沿用列表的“上下挤开”。跨分组拖动时,空组与满组的让位语义不同,需要额外的组级接收态。关闭动画时可用静态插入线代替位移。极短列表(三五项全在一屏)让位收益小,但仍比毫无预报好。让位不负责把屏幕外的目标滚进来。
怎么落地
- 用被拖项中线决定插入下标,让邻居在 100–200 ms 量级让出等高空隙;不要等松手再排。
- 可变高度行按实际高度留缝,避免矮项插入后看起来“卡住”高项中间。
- 测试时让用户拖到一半停住并指出将落下的位置,核对口头报告与真实下标;回放时找出空隙与手指不同步的帧。