读后总结(第9篇 - 列表设计的一些思路)

列表算是一个非常基础的设计元素,无非是一排一排的数据内容,加上一些基本的操作。但是,再简单的东西,也有很多的细节需要思考。


表格中的操作设计

大多数情况下,列表中的每一排是一个条目,每一个条目都会有一些基本的操作,例如删除,编辑,查看详情。网上有各种各样的设计列表样稿,但是总体来说,有以下几种比较典型的操作设计方案。在真实的产品设计中,也常会有以下几种方案的结合体出现。

方案一:每一排都显示具体的操作

这种方案一般比较适合各种各样比较简单直观的操作设计,支持各种用户不需要查看条目详情,直接就可以根据列表上的信息做出快速的判断并且高频发生的操作。


优点:

  • 操作的可视性很高,对于新用户来说,所有操作一目了然

  • 对于高频操作,用户只需要一次点击就可以完成具体的操作

缺点:

  • 按钮因为视觉特征比较明显,造成了不必要的困扰

  • 扩展性不强,毕竟列表长度有限


方案二:只有在鼠标悬浮, 或者点击某个具体按钮之后现实操作

这种方案将操作隐藏起来,比较适用于一些操作风险较高,操作非常多而导致无法在列表上完全显示,或者操作不常发生的情况。


优点:

  • 信息密度低,可以帮助页面突出更加重要的信息,例如条目名称,条目阶段。待用户发现需要进行操作时,再显示操作选项

  • 对于风险比较高的操作,例如停止一个正在运行的服务,这样的做法提高了操作门槛

缺点:

  • 增加用户的点击次数

  • 操作的可视性较低,用户需要鼠标移到表格的某一行上,或者需要点击一个右侧的icon,才可以看到全部可行的操作,新用户可能需要学习一段时间


方案三:支持批量操作,并且在列表上方进行统一操作

这种方案适用于用户经常需要多个文件进行同时管理的情况。


优点:

  • 对于用户经常需要批量管理的列表有帮助

缺点:

  • 如果不同的项目,可以支持的操作不同,逻辑会比较复杂


注意细节:在设计的时候同时要对点击区域做考虑,要把简单好用的设计留给用户行为。


表格中的信息设计

分页设计和卷轴设计

分页设计:分页来展现全部的列表项目。

优点:

  • 分页是一种非常符合用户认知逻辑的归类方式。它可以帮助用户从一个很长的列表中定位某个特定的项目

缺点:

  • 每次到达页面底端时,用户需要点击之后才能到下一页,对于一些浏览性的表格来说,点击显得比较多余

卷轴设计用户触底之后,页面自动显示“加载更多”,然后呈现出更多信息。(一般来讲,卷轴设计在列表中适用的情况较少)

优点:

  • 适用于一些浏览性的列表,用户更多得在获取信息,例如花瓣网的信息流(不过这个也不能算列表),用户可以不需要点击就获取更多的内容

缺点:

  • 对于一个列表来说,用户常常会不知道自己还有多少没有看完,导致在精神上比较有负担。

  • 一般比较难定位一个具体的项目位置。


原文地址:zhuanlan.zhihu

评论
热度(9)

© 木木 | Powered by LOFTER