web列表设计总结

作者: 产品汪August | 来源:发表于2018-12-18 20:48 被阅读47次

无论是B端产品还是C端产品,都会有显示列表的情况。表格的设计体现在可视化(可读性)和易操作两个方面,用户主要对列表信息进行快速的查看、查询、筛选、分析等操作。

下图为微信商户平台的订单列表页面:

列表的显示

表头:

表头是固定的还是可滑动的?按照“7±2原则”,范围之内(表格字段较少的情况)可以固定显示,范围之外可设置横向或纵向滚动条。若表格左侧有关键字段或右侧有操作按钮,可以固定左侧或右侧。主要是方便信息查看和对比。

表头是否需要根据查询条件或者用户个性化设置自动生成?

分页:

是否需要分页?大部分情况,报表数据一般比较多,因此是需要分页的。分页每页显示多少行?当前数据总共分为几页?是否可以直接跳转到某页?

单元格:

内容超过单元格长度如何显示?显示....或者折行显示。

空白单元格:显示为空?显示“无”?显示“0”?还是显示--。

数据权限:是否会根据不同权限的用户,对特殊字段做隐藏和显示

点击:是否需要支持查看详情或者进行跳转?跳转回到列表,定位还原位置还是第一行?

列表的操作

导入(导出):

导入的文档是什么类型?Excel或者Txt?表头是否可修改?模板中是否需要表明各字段的要求?是否需要示例?是否支持图片?

一次最多导入多少条数据?若数据有时间范围,则需要规定一次最多导入多长时间范围内的数据?

导入后有没有预览?导入中有错误,如何反馈给用户?若导入后有预览,可直接标记出错误数据,导入则忽略错误数据,或预览页面支持修改错误数据。

导入数据量大,导致时间缓慢,是否需要显示给用户当前导入进度?比如当前256/600,表示总共600条数据,现已导入256条。或80%表示已完成80%数据的导入。

查询:

查询条件有哪些?比如时间查询:时间指的是什么时间?创建时间还是修改时间?是否需要精确到时分秒?

搜索输入框是模糊搜索还是精确搜索?是否需要支持清除?

查询结果为空时,页面如何显示?

筛选:

筛选的条件有哪些?支持单选还是多选?筛选是否支持搜索?

“实时筛选”还是“点击查询按钮触发筛选”?一般情况下,筛选条件存在交叉时使用触发筛选,不存在交叉时使实时筛选;条件少时用实时筛选,条件多时用触发筛选。

筛选结果为空时,页面如何显示?

排序:

列表默认按照什么排序?若按照时间排序,则需要明确是什么时间

是否支持升序和降序?上箭头为升序,下箭头为降序。

是否有多种排序方式?排序方式较多时应采用下拉选择,因为这样信息展示最直接有效,且能减少反复操作的次数。

是否支持用户自定义排序方式?

打印:

打印的内容有哪些?列表中的内容是否需要全部打印出来?用户是否可以自定义?

打印机、打印纸张的设置?打印的排版?1次打印多少份?

相关文章

  • web列表设计总结

    列表是最常见一种界面元素。之前我用「元素+操作」的方式记录了列表设计的注意点,发现这种总结方式不适合向别人分享。因...

  • web列表设计总结

    无论是B端产品还是C端产品,都会有显示列表的情况。表格的设计体现在可视化(可读性)和易操作两个方面,用户主要对列表...

  • web列表设计详解

    进行后端产品设计时,关于表单的设计十分常见,但是很多产品的列表项十分冗长并不能快速解决用户的实际需求,那么在表单设...

  • B端产品常用web列表设计模式总结

    从事B端产品交互设计工作的半年时间里,笔者有幸接触了面向开发和运维人员的B端业务类列表交互设计工作。为了方便后续在...

  • 目录索引

    开发总结1、Java · 后端开发相关总结2、Web应用系统设计开发经验总结3、常规问题定位不完全手册 系统设计1...

  • 最新十大web安全隐患-四年之后_OWASP发布新版本OWASP

    OWASP Top10是什么? OWASP项目最具权威的就是其”十大安全漏洞列表”。这个列表总结了Web应用程序最...

  • 最新十大web安全隐患-四年之后_OWASP发布新版本OWASP

    OWASP Top10是什么? OWASP项目最具权威的就是其”十大安全漏洞列表”。这个列表总结了Web应用程序最...

  • 我的Web开发实战总结(二)

    写在前面 这篇是继我的Web开发实战总结(一)的第二篇文章,在此篇里,我主要总结一下如何把Web页面上的报表或列表...

  • Java高并发秒杀系统API(三)之Web层开发

    本篇文章总结自己开发秒杀系统Web层的过程,主要介绍前端交互设计、Restful:url满足Restful设计规范...

  • Restful API 和RPC API

    总结一下 RESTful 是目前最流行的 API 设计规范,用于 Web 数据接口的设计。(感觉比较适合大型项目、...

网友评论

    本文标题:web列表设计总结

    本文链接:https://www.haomeiwen.com/subject/nhlrkqtx.html