it-swarm.cn

用户界面设计,用于订购列表中的商品

您将使用哪种组件/ UI设计来订购列表(带有上/下移动按钮的表格)中的项目?

6
padis

拖放项目可能是大多数UI的最佳选择。不幸的是,很难使此功能可被发现。每个项目附近的“抓取器”区域会有所帮助。在良好的拖放排序UI中,拖动时的视觉反馈以及将项目拖动到Edge时的自动滚动都是必需的。

最好提供move upmove down按钮,以及拖放操作。没有普遍公认的“抓取器”图标/样式。对于不常用的界面,使用稍微笨拙的按钮所花费的时间可能少于用户发现更有效的拖放功能所花费的时间。

此外,通过拖放操作,如果操作不正确(例如自动滚动),许多细微的细节会让用户感到沮丧。按钮在频繁使用时效率低下,但显而易见,易于使用且易于编写代码。

5
dbkk

拖放可以被认为是“直接操作”,直接在列表上单击会产生效果,而“间接操作”则是您具有单独的按钮或其他对列表起作用的操作。

根据您列表中的内容,两者可能都合适。

无论您做什么,都请记住 Jakob Nielsen的十大应用程序设计错误 的明智建议:

当不清楚是否可以拖动某些物体或将某些物体放下时,拖放设计通常是最严重的违规行为。 (或者,如果您拖放,将会发生什么情况。)相比之下,简单的复选框和命令按钮通常会使您可以轻松点击一下。

因此,如果您提供对列表的直接操作能力,请提供视觉提示,例如:

  1. 可视化的“抓取器”区域(点或线系列),表示“抓取性”
  2. 鼠标变换
  3. 移动时反馈。请参阅 此演示 ,尽管请注意不支持我的观点(1),因此这些列表是否可排序并不明显。
4
Julian H

我同意直接操作元素现在可能是首选。

尽管有人指责37 Signals有点傲慢,但它们的Basecamp是一个非常有用的应用程序。该应用程序中的几乎所有列表都允许通过拖放来对元素进行重新排序。

首先,您必须单击以通过上角的文本链接进入重新排序模式。然后有一个小图像清楚地表明“可抓取性”,您单击并按住它然后操纵以移动该项目。见附件。

alt text

2
jameswanless

向上/向下按钮可以,但是趋势是直接对数据进行操作,即能够单击(或点击)项目然后将其移动。一个著名的例子是Netflix队列。即使在列表中选择多个项目也可以使用。

0
Hisham

我的偏好是将拖放与鼠标悬停时显示的清晰拖动选择器一起使用。在我们的应用程序中,我们使用向上/向下双向箭头来显示该商品可以重新排序。

对于技术精通的人群来说,只需更改光标就足够了,但是对于通用应用程序,您想要更明显的东西。

0
Sam