复杂表单设计提效思路
一、引言
信息管理系统(IMS):负责各类业务数据的增删改查(CURD),在管理数据的时候,往往会有大量的表单页面,这些表单页面上存在大量需要系统使用者填写、上传、选择的字段,功能本身不存在过于复杂的处理逻辑或者算法,但是系统使用却很复杂,会消耗大量的人力来管理和维护。
以下是目前政务系统中常见的表单填写界面,这个界面是系统升级优化的效果,可能原有的系统更复杂。[图片上传失败...(image-10dc3e-1673167236821)]
后端管理系统配置界面:
![](https://img.haomeiwen.com/i8945890/11399686759128e4.png)
![](https://img.haomeiwen.com/i8945890/152ec3f24669ba16.png)
二、提效思路
在设计数据管理的复杂表单功能时,常常需要大量的用户操作,而这些操作又是业务必须的,B端产品往往也会存在大量的表单数据需要填写和管理,这是B端产品经理都要面对的问题。基于我在过去产品设计中遇到的问题和解决方案,我提供几个思路,可以用来提升系统使用者的效率:
-
默认值:必填值提供良好的默认值
-
微批:微型批量操作(Mini-Batch)
-
热键:使用键盘快捷键
-
工作台:一站式工作台(Workbench)
-
批量操作:提供丰富的批量操作功能
1. 默认值(Default Value)
复杂业务表单里面,往往存在大量必填信息,这些信息,不管是需要打字输入,还是通过下拉选择,又或是单选、复选,都是需要消耗大量时间来处理的工作。
而默认值是一个非常好用的方法,通过对必填字段提供最佳默认值,可以让复杂表单中真正需要用户填写的信息大幅度缩减。
A. 案例介绍
-
常见的问答机器人产品中,未知话术配置,给出了默认未知回复的话术
1d49e9c257775880.png
-
外呼机器人产品中,外呼任务创建,任务类型、发音方式、外显规则等都给出了默认值
12112eb89a6fbe26.png
B. 实现方式
-
默认值尽可能最佳选择:不能随便给一个默认值,比如外显规则的默认值,是随机规则用的最多还是其他规则最多,给出这个默认值后,要考虑如果用户采用默认规则是不是能达到预期的最佳效果。
-
通过暗提示提供默认值:对无法给出最佳值的情况,可以通过暗提示的方式给出默认值,这样可以给出正向引导,确保用户输入的内容符合最希望的值。
-
隐藏非必要必填字段:对非重要的字段,通过隐藏折叠加默认值,实现表单轻量化。
2. 批量操作(Batch)
对于数据管理较多的功能,一般都要提供丰富的批量操作功能,我们常见的功能是批量删除功能,而批量新增功能一般都是通过Excel导入的方式实现。批量修改功能相对要更难做一些,一般是针对共性受控字段做批量更新,比如状态、类型、有效时期、分类等。
A. 案例介绍
问答机器人产品中的FAQ批量操作功能:导入、导出、删除、批量编辑
![](https://img.haomeiwen.com/i8945890/b66991fca4bfeb6a.png)
![](https://img.haomeiwen.com/i8945890/d096ad647d869f44.png)
![](https://img.haomeiwen.com/i8945890/5658d912d8bf4812.png)
B. 注意事项
-
新增和删除功能必须配套:一旦有批量新增功能(导入),就必须要批量删除功能,这两个功能必须配套,批量新增带来的更多是错误数据,需要提供用户自己能纠正错误的便捷功能
-
批量修改应用在可控属性上:可控性字段指的是有枚举值、引用其他数据的字段,常见的有分类、类型、状态、标签等。对开放性字段,一般不提供批量编辑的功能,原因是开放性字段很少有到多条数据有相同值的场景,做批量编辑意义不大。
-
批量新增需要做好错误校验:导入功能如果没有做好错误校验,往往会启到负作用,带来一堆垃圾数据。目前文本机器人的导入方式是对错误数据提供错误文件下载的功能,将错误记录在数据的最后一列,方便二编导入,也能做到单条数据错误不影响其他正常数据导入。
-
批量删除需要提供翻页勾选能力:对于列表数据,一旦需要批量删除时,需要提供良好的翻页勾选能力,保证可以跨页删除。
-
关联数据同时导入:对某一个业务数据导入时,需要考虑到该数据关联的其他业务数据能方便的一次性导入。
3. 微批(Mini-Batch)
微批是指在一些表单输入的时候,有一些非常方便的微型批量操作的能力,而不是单个数据单个操作。
最典型的例子就是在添加专业名词、枚举词时,能同一时间输入多个词,多个词之间用逗号或者顿号分割,系统自己切割成多个词快速加入到系统中。
A. 案例介绍
问答机器人多轮配置中的分支答法添加方式:
![](https://img.haomeiwen.com/i8945890/723b40c221920579.png)
B. 注意事项
-
数据量较小时适合使用:当我们添加100以内的数据是使用这种方式比较合适,当数据量较大时就会遇到新的问题
-
需要支持多种分割方式:我们常见的数据,可能来自Excel、CSV、文本文件,每一种数据可能的分割方式不同,Excel中用制表符+换行符,CSV用逗号分割,文本文件用换行符分割,因此需要多种考虑支持。
-
需要综合考虑新增、编辑、删除模式的功能:我们提供了微批的新增,也需要考虑如何快速的编辑和删除,微批也时批量操作的一种,因此所有的功能都要配套。
4. 热键(Hot-Key)
在桌面应用中,热键(快捷键)和右键菜单是很常见的交互方式,但是放到网页上,这两个中交互方式对用户来说都比较隐蔽,培训成本较高,一般很少使用。
在网页应用中,热键对需要做大量数据录入的表单来说,是一个提效利器,常见的热键有Enter、Delete、Ctrl+C、Ctrl+V、Ctrl+X、Ctrl+Z、Tab
A. 案例介绍
-
**百度的Enter触发搜索,这个功能在所有需要查询的页面,都是非常实用和常见的功能。
9fe06bc2bbb894d4.png
- 携程对输入联想词Enter触发选择,这个功能更多用在带搜索功能的下拉列表或有输入联系的搜索框中。
![](https://img.haomeiwen.com/i8945890/45667b9b11cd95f1.png)
-
Tab切换到下一个需要输入内容的表单中
ac075c7c8a30cc7c.png
B. 注意事项
-
热键通过使用指引的方式引导用户:因为网页应用对热键的普及度不高,因此对存在热键操作的表单和功能需要通过Tip提示、暗文字等方式告知客户。
-
长表单善用Tab、上下方向键:通过这些键可以快速定位需要编辑的表单,提供数据录入的效率
-
对确定需要复制的文本内容提供双击或单击复制功能:比如我们常见的系统对接所用的密钥、地址等信息,主动提供点击复制的功能,这样用户不用刻意的选中文本后再复制
-
对文本内容提供选中复制能力:在界面上展示的文本内容,除开特殊字段,均需要考虑提供可以复制的能力,减少用户的输入。
-
对画布类的功能提供撤销功能:对画布类的产品功能,提供撤销功能,可以方便用户减少误操作带来的返工。
5. 工作台(Workbench)
这个是指在一个页面可以完成特定业务数据的所有操作,而不用切换到其他页面或系统来组合完成工作。
我们常见的工作台主要是客服的工作台,是因为客服往往需要查询多个系统来完成工作,所以才有工作台的概念,好让客服能在一个界面完成所有数据查询、工单流转、信息确认等工作。
这个概念也可以用在其他功能的设计上。比如我们新增多轮会话:
-
需要用到意图,那在画布里面,直接可以添加意图
-
需要用到变量,可以直接添加变量,添加变量需要绑定抽取器,则直接可以添加抽取器
-
抽取器需要绑定语料,则可以直接新增语料,语料需要挂到意图上,也可以直接添加意图
A. 案例介绍
-
问答机器人产品多轮配置中,节点上需要收集器,可以直接添加对话变量,而对话变量里面可以直接新增正则类型的变量。
507ea63e06819267.png
-
问答机器人产品多轮配置中,节点需要增加分支,分支中可以直接添加关键词。
7970bd03875c2d00.png
B. 注意事项
- 弹框不能超过三层:工作台的理念中,关联对象一个界面完成添加,往往需要多极弹窗的方式完成,这个需要有效控制弹框的数量,最多不能超过三层。其中抽屉交互也是一层弹框。
- 贴片式交互实现关联对象添加:信息量较少的关联数据,可以通过贴片式的交互完成添加,比如标签、分类等
以上就是我整理的关于在设计复杂表达功能时几个可以用来提效的方案。
网友评论