15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 列表设计

列表设计

时间:2023-09-29 13:12:01 | 来源:网站运营

时间:2023-09-29 13:12:01 来源:网站运营

列表设计:在大家的理解范围之内,列表设计是最常用的交互样式根据前段框架或者通用的模版。往往会忽略列表的交互设计的重要性。

但列表对于整个系统来说是最重要的组成部分,尤其是对整理数据或者看报表的用户来说是最重要的,这里的用户多指领导层,只有领导才会更多的关注报表和数据。所以好的列表设计可以让整个系统更好的得到领导的肯定。




对于列表设计,我们主要先了解一下,列表的主要功能是什么?

是数据统计、数据预览、数据对比、数据管理。




数据统计、数据预览、数据对比,是用户最主要的需求,也是列表的主要功能。数据管理,是为了更好的让数据的功能满足不同用户的需求。

这里我们的列表设计主要是以数据管理的角度去设计列表。

数据管理包含数据筛选、数据操作、数据展示




一、数据筛选

1、条件搜索(模糊搜索、精确搜索、高级搜索)

1.1、条件搜索,就是把列表的重要关键字段作为条件,进行数据搜索。常见的放置位置在是在列表的上方区域,条件搜索分为模糊搜索和精确搜索,模糊搜索,属于包含关系,如,输入“A”,搜索出所有包含"A“的数据;精确搜索,属于等于关系,如,输入”A“,搜索出只有"A"的数据。除了模糊搜索和精确搜索以外还有高级搜索,高级搜索包含了除包含关系和等于关系的其他所有关系,如,不能为空,等于零等。

1.2、条件搜索样式,一般根据场景设置,一种数据量大,以查询浏览为主的列表,尽量把所有的搜索条件都展开,一种是以浏览管理为主的列表,尽量把搜索条件折起来,展示最主要的查询条件

2、列表表头搜索

列表表头搜索,最常见的一种就是每个表头字段下面一个筛选框;另一种比较特殊的表头搜索主要是根据数据根据查询条件,列表表头字段改变,改变后的列表字段查询,

3、列表表头排序

列表表头排序,多用于时间排序,

二、数据操作

1、批量操作(操作功功区)

批量操作也叫一对多的操作,就是对列表里面的数据可以多个批量操作,比如删除、停用等。这类操作都会放在列表上方区域。新建、导入、导出。

2、单个操作(操作拦位置)

单个操作也叫一对一的操作,对列表中的数据一对一的操作。比如,详情、编辑等。这类的操一般会放在列表操作栏中,操作栏一般放在列表的左边或者右边,如果列表宽度超过一屏,右边的操作栏会采用浮动的样式,操作栏功能按钮一般不超过3个,如果超过采用隐藏的形式。

三、数据展示

1、字段配置

字段配置主要用于一个列表满足不同用户的需求时,对不同用户所关注的数据字段不一样,进行人性化的配置。有字段配置的列表,初始状态有两中表现形式,一种是,默认基本字段,用户增加所需要的字段(做加法);一种是,所有字段都展示,用户减去自己不想要的字段(做减法)。字段配置按钮一般放置在列表右上方。

2、字段展示

字段展示只列表中的每个字段展示的规则,首先字段的宽度,一般分为固定和自适应宽度。固定宽度指每个字段宽度都时一个固定的值(如果字段过少,不满一屏可等分),自适应宽度,就是字段的宽度根据字段的大小变化而变化,但也哟最大值,一般最大值为15个字符,超过15个字符用...代替。一般不建议数据换行。

3、分页设置

分页设置时为了减少加载数据,增加打开页面速度。默认分页根据电脑屏幕的显示最大数据量显示,一般为25、50、100、200等。分页需要显示当前页,总共页数,跳转到相应页面,数据总计等。

四、写在最后

因为最近一直在做后台系统的交互设计,接触了很多列表页面设计,和许多奇奇怪怪的场景,但总体来说,列表的主要目的是一样的:数据统计、数据预览、数据对比、数据管理。也是基于最基础的列表结构来扩展,满足不同的场景需求。这里简单的对列表结构进行了简单的总结,希望在工作中对大家有锁帮助,也希望大家可以多多交流。

关键词:设计

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭