H8.03.1drag pickup and drop feedback设计研究

拾起与落下需要明确反馈

别名: 拖拽抓取反馈 · drop target · lift and drop

概念解释

用拖拽改变内容顺序时,手要完成两步:拾起某条,再落下到新位置。每一步都需要当场能看见的反馈——被抓起的项离开原位、插入线或空隙出现在将要落下的地方、松手后项落在新槽而不是弹回。它只谈排序手势里抓与放的可见性。列表很长时视口要不要跟着滚、键盘或按钮能不能代替拖拽,分别是另外两件事。

机制

拖拽把对象从「点过」变成「正被拿着」。若拾起没有抬升、阴影或原位占位,人不确定手势已经开始,会继续按、或以为点选失败。落下依赖插入预览:一条线或一条空隙告诉运动系统「松手会发生在这里」。没有预览时,人只能猜相邻两项的中点,松手后项飞到意外槽位,只能再拖一次。排序还要求原位在拖动中保持空洞或收拢,否则列表密度不变,眼睛找不到新槽。松手后若项瞬移而无短暂停留,人来不及核对「是不是我想要的位置」,下一次就会更不敢松手。

怎么研究

给一份可排序列表,任务是把指定项移到指定邻居之间。比较无拾起态、有拾起无插入线、两者都有。

自变量:被拖项是否视觉上脱离、插入预览的形式(线 / 空隙 / 整项让位)、松手后是否有归位动画。 因变量:首次落下是否落在目标槽、中途松开重抓的次数、对「现在会插到哪」的口头报告是否正确。

实验室列表短、目标事先指出,成功率会被抬高。加入干扰项(看起来也能接收拖放的分组头)才能测出落下预览有没有把合法槽标出来。触屏没有悬停,拾起阈值(长按还是立即跟手)会和滚动手势冲突,要分开记录「没拾起」和「拾起了但插错」。

边界

只有两三条的列表,拖拽的拾起成本可能高于上移下移按钮,反馈再清楚也不如换交互。网格和自由画布的落下是二维放置,不是线性插入线,预览应是占位矩形而不是行间线。跨容器拖放(从列表拖进文件夹)的落下反馈还要标明容器会不会接收,那已经超出「同一列表内排序」。只读查看者没有排序权限时,不应出现可拾起的外观。

怎么落地

  • 拾起后该项抬升并半透明,原位留下空洞或收拢后的缝;在合法插入处画线或把邻项让开。
  • 非法落点(分组头、只读区)用禁止光标或项弹回,不要静默落在最近的合法槽。
  • 松手后项进入新槽并短暂停住,让人能看见最终顺序再去抓下一条。
  • 验证:请人把第三条拖到第一条之前,录屏看拾起瞬间是否脱离、拖过第二条时插入预览是否出现在目标槽、松手后是否落在口头描述的位置。任何一步只能靠猜,反馈就不够。

延伸

  • 同组H8.03.2 长列表需要自动滚动 · H8.03.3 必须提供非拖拽的替代方式
  • 相邻C3.18 长按拖动排序 · C1.08 拖放 · J3.07 拖拽的替代
  • 站内检索drag feedback · drop preview · reorder

同组卡片

快捷操作

分享

分享当前页面

ios_share

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