it-swarm.cn

如何可视化拖放的可能性?

我的Web应用程序包含一个元素列表,可以通过拖放进行排序。该功能应如何直观地呈现给用户?

56
Witek

我在东西上使用了一些“可抓握”的纹理来表明它是可拖动的。这是Gmail的纹理:

enter image description here

37
Ken Mohnkern

几年前,我从 Netflix 看了Sean Kane的演示,他在其中介绍了DVD队列的工作方式。如果可以的话(如果您有帐户或认识的人),您应该进行研究。

需要注意的几点:

  • 他说默认的移动光标测试得不是很好,所以他们按照 GoodEnough 的建议切换到grab cursor

  • 拖放操作是一种渐进式增强。您仍然可以通过在列表顺序列中的文本框中进行填充来进行排序。许多用户从未注意到拖放功能是可用的。

  • 没有拖动句柄。您可以在行中的任何位置使用鼠标向下拖动来开始拖动(除非另一个对象(例如链接)在前景中)。

27
Patrick McElhaney

三个水平线之间有一个标准图标,一个水平线位于另一个水平线上方,表示可以拖放项目。

它表示“摩擦”或“句柄”,有点类似于允许调整其大小的窗口或文本框右下角的对角线。

14
Dan Barak

移动光标通常与Web应用程序中的可拖动项一起使用。

cSS:

cursor:move;
11
Sruly

我建议您使用小的抓手(在悬停时打开,在拖动时关闭)。具有某种抓握图标(手柄),看起来像可以抓住的东西(在Gmail中,它是一对点列(每列4个点)。

我还建议您添加一些动画来向新用户(或现有用户,如果是一项新功能)展示行为,只是不要每次用户在您的应用程序中都不断显示动画。

6
mbillard

拖动是一种阻力。在最近完成了几个拖放UI的改进之后,我实际上得出的结论是,下次我将它们更改为某种“单击和放置”的形式。单击的每个项目上都有一个小部件以选择要移动的小部件。然后,单击想要的位置。到目前为止,这似乎在测试中进展顺利。

5
Robert Fisher

将光标移到可拖动对象上时,应将其变成张开的手。抓住物体时,应将其变成抓手。在抓取对象时,可以从其他背景(即通过阴影或着色)强调允许的拖放区域。

1
txwikinger

通用漩涡符号可能是?。

我使用的桌面应用程序允许将应用程序外部的文件拖入其中。某些允许拖放的应用程序通常具有放置区域或内容窗格。就像音乐播放器中的播放列表一样。拖放式可用性是一种渐进的公开方式,但是某些用户永远不会直观地了解它。在这种情况下,我想想做的广告投放区域最好的就是漩涡背景。

0
Vishnu Prasanth

我自己是通过桌面应用程序来解决这个问题的。目前,我能想到的最好的解决方案是在悬停时有一个箭头,该箭头仅指向可以将对象拖动到的位置,并带有一些文本,例如拖放或类似内容。

0
James Ludlow