分享好友 最新动态首页 最新动态分类 切换频道
B端体验设计专题-表格篇
2024-11-07 23:08

B端体验设计专题-表格篇

做To B的同行都知道,降本增效一直是企业中后台绕不开的热点话题,现任公司业务涵盖仓(WMS)、运(TMS)、配、人(HRM),所做项目虽功能各异,但是有一个共同点-大量使用表格。本文受有赞设计师@美芳的启发,将我日常工作通过优化表格来提效的思路整理成文章,一方面是对企业后台的数据表格作一个简单的阶段性总结,另一方面给部门做一个年终分享。

undefined

表格是展现数据最为清晰、高效的形式之一,它也是B端产品和设计师每天接触最多的组件,常和排序、搜索、筛选、分页等其他界面元素一起协同。在企业级中后台中,常应用于:

通常表格的组成元素以及相关元素会有多个部分,根据不同粒度的用户目标将其解构为三部分:

数据查看:表格的核心-显,用户用来阅览、对比和分析数据。

数据过滤:辅助作用,承载表格的查功能,将数据过滤,方便用户快速查询定位数据,一般位于表格上方。

数据操作:辅助作用,承载表格的增删改的功能,比如常见的“新增”、“删除”、“编辑”按钮。

undefined

首先,我们要明确,什么是一个好的表格?笔者认为好的数据表格可读性要强,应便于用户对信息进行快速的扫描、查询、过滤、分析等操作,以获取数据并快速准确地完成目标任务。一个结构清晰的布局能大大提升用户对信息的接收速度和理解程度,拆分到表格的设计目标就是:易读、易查找、易操作。

undefined

数据检索区可以看作表格的导航,按预定目标过滤出某种具有特定性质的数据,将操作者所关注的数据展示到前面,便于快速查看查看、对比、分析信息的操作过程。从用户角度出发,按不同粒度的数据检索方式分为3种方式,分别对应不同程度的用户。

搜索:当用户有相对明确的选择目标时,需定点查看,数据多且杂乱无规律;

筛选:用户目标相对比较模糊,游离于一个大概的范围时,通常用于一些有清晰分类的数据;

标签:查看无交集的数据内容,通常伴随时间、状态的流转。

undefined

搜索可以帮助用户在巨大的信息池中缩小目标范围,快速而准确的定位到目标数据,并速获取需要的信息。由于考虑到用户需要手动输入,很难保证精准搜索,原则上所有搜索均为模糊搜索,必要精准搜索的地方使用筛选功能,给用户提供筛选选项。通常上端搜索栏不被限定搜索范围,可以全部搜索。

1.1 模糊搜索

优点:减少精准搜索带来的记忆负担

缺点:容易把不相关的

1.2 带标签的搜索

优点:搜索匹配精准度高

缺点:不方便,每次只能对单一条件进行搜索

undefined

筛选可以帮助用户缩小数据范围,逐步找到想要的内容;或者当用户的目标就是查看某一范围的数据时,筛选将是一种十分快捷的方式。在企业级中后台产品中,筛选的使用场景通常是后一种。

优点:空间利用率高,起到了很好的收纳作用

缺点:无法直观看到所有筛选项

undefined

优点:操作效率高,筛选项一目了然,支持输入更多筛选条件

缺点:空间利用率低,不适合选项太多的情况undefined

优点:筛选当前列,更直观,一般情况下表单左侧数据筛选频次越高

缺点:筛选的内容仅限于特定、单次列的筛选,对于首次使用者来说陌生,交互形式需要学习

undefined

使用场景:标签切换一般用于和时间、状态的流转有关,且没有交集的数据内容。主要样式有基础、卡片、胶囊等。

优点:根据标签,可以很清楚知道划分,切换tab就可以筛选内容。

缺点:分类需覆盖选项,并且保证每一项没有交集,分类不能过多,超过7±2个选项可选择下拉筛选。

undefined

提升用户体验的一个小细节:默认用户最关注的选项,而非全部,这样可以缩短查询路径,同时给出条目,让用户清晰明了每个选项的数量,便于操作。undefined

在企业级中后台中,用户查看的数据往往属性较多且不唯一,通过简单的检索方式很难精确定位到目标数据,所以,在实际使用时,常会将大量非交叉关系的属性进行罗列,搜索、筛选、标签切换组合出现,形成多属性组合检索。这种检索更适合于专家用户,他们对于目标数据有明确的定位,知道可以通过哪些属性精确定位到自己想要的数据。

a. 平铺显示

选用对用户决策有意义、操作频次高的属性作为直接展示的组合检索条件,建议数量最好不超过5个(7±2法则)。

优点:大而全能最大限度避免检索条件疏漏的可用性问题

缺点:易用性不高。大而全可能为用户带来繁杂的第一印象,都是重点等于没有重点,增加用户的决策时间。undefined

b. 折叠展示

如果多属性组合检索中的一部分检索条件不是高频率使用的,但又是必须存在的;则可通过折叠的方式将这部分检索条件隐藏起来,将高频率使用的、数据覆盖面广的1-3个属性直接展示出来。undefined

在设置组合检索项时,应考虑每一项检索甚至是多属性组合检索是否有必要。需从实际场景出发,根据用户对各个检索项的使用频率及组合检索项的数量,来决定组合检索项是直接展示还是折叠展示;以及哪些属性直接展示,哪些属性折叠展示,为各检索项安排合理的展示方式。

产品现状:前言中提过,我司业务涵盖WMS、TMS、HRM,业务极其复杂,数据种类字段众多,使用的检索方式为组合筛选平铺展示,一半以上的页面筛选项超过了9个(不符合7±2原则),大而全的检索方式一方面占据首屏大部分空间,导致首屏屏效低;另一方面用户在寻找具体筛选条件时,仿佛大海捞针,增加了用户决策时间。因后台数据涉密,将下图-招聘中可公开的页面作为案例来可大家分享。

undefined

设计优化方向:

最新文章
《南方周末》2024新年献词金句摘抄|守住不惑的底线,选择做最值得的自己
守住不惑的底线选择做最值得的自己1.穿越惑与不惑的边界,求索东方古国现代文明进步的答案,内蕴于我们的基因与使命。2.我们追求真、歌颂善、呈现美,我们抗拒假、斗争恶、暴露丑;我们持续见证、诉说并努力参与那场壮丽的春天的故事,又从
2022跨年祝福语 虎年新年祝福文案大全
  告别2021年,步入,我们又迎来了崭新的一年,新的一年,新的气象,在这新的一年,我们大部分的人都会给身边的亲朋好友,发一些,希望他们在新的一年,身体健康,万事顺利,财源广进,那么我们可以参考一下以下的文案,来送上自己的祝福
公务员考试题库及答案4000题百度网盘资源免费下载地址哪里找资料整理了夸克网盘
公务员考试题库及答案4000题百度网盘资源免费下载地址哪里找资料整理了夸克网盘链接:https://pan.quark.cn/s/64f643af3ac8提示(建议复制后浏览器搜索打开即可,手机用户长按复制打开)资源完全免费,收集与互联网公开分享。说到公务员考试
充满阳光的正能量句子
充满阳光的正能量句子大全  在学习、工作或生活中,大家肯定对各类句子都很熟悉吧,句子由词或词组部分和语调所表示的语气部分组成。究竟什么样的句子才是好的句子呢?以下是小编整理的充满阳光的正能量句子大全,仅供参考,大家一起来看
0门槛0成本15天加满5000微信好友的实操秘籍!
过完年,又要开始寻找目标客户了。客户是什么,客户就是流量,流量在哪里,一个是线下,一个是互联网上。尤其对于微商来说,微信好友就是钱脉,但更多人都无法突破一个微信号,也就是5000人。所以,我想,正因为你需要流量,你才会关注微电
AnyTXT Searcher中文免费版 v1.3.1205
AnyTXT Searcher中文免费版是一款简单好用的文件快速检索工具,用户可以在AnyTXT Searcher中文免费版快速的进行各种文档的检索,适用于各种文档、文本的检索,页面简单轻松功能强大,检索效率高,可以很快的帮助用户找到自己需要的内容,感
分析世界新闻:通过谷歌查询系统探索GDELT项目
用全球新闻报道去分析、观察乃至预测人类社会是一种什么样的情况?由谷歌理念所倡导的GDELT项目旨在创建一个实时、开放的世界新媒体资料索引库,与全世界一同分享以编码形式存在的源数据。GDELT库是世界上最大的关于全球化社会的开放数据集
2022年活跃用户画像趋势报告(小红书平台)
随着用户体量壮大和平台多元化发展,小红书用户的兴趣点,早已从美妆独大变为渗透生活领域的各个方面。那么2022年,小红书不同行业下的用户呈现出什么样的差异化特征?又有哪些发展趋势值得关注?千瓜数据独家推出《2022年千瓜活跃用户画像
今日头条下载安装 app介绍
● 拍照权限允许访问摄像头进行拍照● 使用蓝牙允许程序连接配对过的蓝牙设备● 使用振动允许振动● 使用闪光灯允许访问闪光灯● 录音录制声音通过手机或耳机的麦克● 获取WiFi状态获取当前WiFi接入的状态以及WLAN热点的信息● 改变WiFi状
1年烧光70亿,上海“巨无霸”项目爆冷!烂尾20年3次易主,凉了?
作者:曾有为坐落于上海黄浦老城厢的东北部,临近上海外滩的上海城隍庙与上海豫园,是外地游客“魔都打卡必选”的经典之一,同样也是上海人休闲娱乐的好去处。沿着这片区域的老街漫步,会发现见证上海历史变迁的老式建筑随处可见,风格独特
相关文章
推荐文章
发表评论
0评