复杂表单设计提效思路

复杂表单设计提效思路

一、引言

信息管理系统(IMS):负责各类业务数据的增删改查(CURD),在管理数据的时候,往往会有大量的表单页面,这些表单页面上存在大量需要系统使用者填写、上传、选择的字段,功能本身不存在过于复杂的处理逻辑或者算法,但是系统使用却很复杂,会消耗大量的人力来管理和维护。

以下是目前政务系统中常见的表单填写界面,这个界面是系统升级优化的效果,可能原有的系统更复杂。[图片上传失败...(image-10dc3e-1673167236821)]

后端管理系统配置界面:


6baec0a72a4e1999.png

4d386f3397d6f083.png

二、提效思路

在设计数据管理的复杂表单功能时,常常需要大量的用户操作,而这些操作又是业务必须的,B端产品往往也会存在大量的表单数据需要填写和管理,这是B端产品经理都要面对的问题。基于我在过去产品设计中遇到的问题和解决方案,我提供几个思路,可以用来提升系统使用者的效率:

  1. 默认值:必填值提供良好的默认值

  2. 微批:微型批量操作(Mini-Batch)

  3. 热键:使用键盘快捷键

  4. 工作台:一站式工作台(Workbench)

  5. 批量操作:提供丰富的批量操作功能

1. 默认值(Default Value)

复杂业务表单里面,往往存在大量必填信息,这些信息,不管是需要打字输入,还是通过下拉选择,又或是单选、复选,都是需要消耗大量时间来处理的工作。

而默认值是一个非常好用的方法,通过对必填字段提供最佳默认值,可以让复杂表单中真正需要用户填写的信息大幅度缩减。

A. 案例介绍

  • 常见的问答机器人产品中,未知话术配置,给出了默认未知回复的话术
    1d49e9c257775880.png
  • 外呼机器人产品中,外呼任务创建,任务类型、发音方式、外显规则等都给出了默认值
    12112eb89a6fbe26.png

B. 实现方式

  • 默认值尽可能最佳选择:不能随便给一个默认值,比如外显规则的默认值,是随机规则用的最多还是其他规则最多,给出这个默认值后,要考虑如果用户采用默认规则是不是能达到预期的最佳效果。

  • 通过暗提示提供默认值:对无法给出最佳值的情况,可以通过暗提示的方式给出默认值,这样可以给出正向引导,确保用户输入的内容符合最希望的值。

  • 隐藏非必要必填字段:对非重要的字段,通过隐藏折叠加默认值,实现表单轻量化。

2. 批量操作(Batch)

对于数据管理较多的功能,一般都要提供丰富的批量操作功能,我们常见的功能是批量删除功能,而批量新增功能一般都是通过Excel导入的方式实现。批量修改功能相对要更难做一些,一般是针对共性受控字段做批量更新,比如状态、类型、有效时期、分类等。

A. 案例介绍

问答机器人产品中的FAQ批量操作功能:导入、导出、删除、批量编辑

27017335b7c76b18.png

4795ad9c5525f0a5.png

56d76630c61a1cb1.png

B. 注意事项

  • 新增和删除功能必须配套:一旦有批量新增功能(导入),就必须要批量删除功能,这两个功能必须配套,批量新增带来的更多是错误数据,需要提供用户自己能纠正错误的便捷功能

  • 批量修改应用在可控属性上:可控性字段指的是有枚举值、引用其他数据的字段,常见的有分类、类型、状态、标签等。对开放性字段,一般不提供批量编辑的功能,原因是开放性字段很少有到多条数据有相同值的场景,做批量编辑意义不大。

  • 批量新增需要做好错误校验:导入功能如果没有做好错误校验,往往会启到负作用,带来一堆垃圾数据。目前文本机器人的导入方式是对错误数据提供错误文件下载的功能,将错误记录在数据的最后一列,方便二编导入,也能做到单条数据错误不影响其他正常数据导入。

  • 批量删除需要提供翻页勾选能力:对于列表数据,一旦需要批量删除时,需要提供良好的翻页勾选能力,保证可以跨页删除。

  • 关联数据同时导入:对某一个业务数据导入时,需要考虑到该数据关联的其他业务数据能方便的一次性导入。

3. 微批(Mini-Batch)

微批是指在一些表单输入的时候,有一些非常方便的微型批量操作的能力,而不是单个数据单个操作。

最典型的例子就是在添加专业名词、枚举词时,能同一时间输入多个词,多个词之间用逗号或者顿号分割,系统自己切割成多个词快速加入到系统中。

A. 案例介绍

问答机器人多轮配置中的分支答法添加方式:

c0fc661bdd3941a3.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触发选择,这个功能更多用在带搜索功能的下拉列表或有输入联系的搜索框中。
图片
  • Tab切换到下一个需要输入内容的表单中
    ac075c7c8a30cc7c.png

B. 注意事项

  • 热键通过使用指引的方式引导用户:因为网页应用对热键的普及度不高,因此对存在热键操作的表单和功能需要通过Tip提示、暗文字等方式告知客户。

  • 长表单善用Tab、上下方向键:通过这些键可以快速定位需要编辑的表单,提供数据录入的效率

  • 对确定需要复制的文本内容提供双击或单击复制功能:比如我们常见的系统对接所用的密钥、地址等信息,主动提供点击复制的功能,这样用户不用刻意的选中文本后再复制

  • 对文本内容提供选中复制能力:在界面上展示的文本内容,除开特殊字段,均需要考虑提供可以复制的能力,减少用户的输入。

  • 对画布类的功能提供撤销功能:对画布类的产品功能,提供撤销功能,可以方便用户减少误操作带来的返工。

5. 工作台(Workbench)

这个是指在一个页面可以完成特定业务数据的所有操作,而不用切换到其他页面或系统来组合完成工作。

我们常见的工作台主要是客服的工作台,是因为客服往往需要查询多个系统来完成工作,所以才有工作台的概念,好让客服能在一个界面完成所有数据查询、工单流转、信息确认等工作。

这个概念也可以用在其他功能的设计上。比如我们新增多轮会话:

  • 需要用到意图,那在画布里面,直接可以添加意图

  • 需要用到变量,可以直接添加变量,添加变量需要绑定抽取器,则直接可以添加抽取器

  • 抽取器需要绑定语料,则可以直接新增语料,语料需要挂到意图上,也可以直接添加意图

A. 案例介绍

  • 问答机器人产品多轮配置中,节点上需要收集器,可以直接添加对话变量,而对话变量里面可以直接新增正则类型的变量。
    507ea63e06819267.png
  • 问答机器人产品多轮配置中,节点需要增加分支,分支中可以直接添加关键词。
    7970bd03875c2d00.png

B. 注意事项

  • 弹框不能超过三层:工作台的理念中,关联对象一个界面完成添加,往往需要多极弹窗的方式完成,这个需要有效控制弹框的数量,最多不能超过三层。其中抽屉交互也是一层弹框。
  • 贴片式交互实现关联对象添加:信息量较少的关联数据,可以通过贴片式的交互完成添加,比如标签、分类等

以上就是我整理的关于在设计复杂表达功能时几个可以用来提效的方案。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 221,635评论 6 515
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 94,543评论 3 399
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 168,083评论 0 360
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,640评论 1 296
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,640评论 6 397
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 52,262评论 1 308
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,833评论 3 421
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,736评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,280评论 1 319
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,369评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,503评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,185评论 5 350
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,870评论 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,340评论 0 24
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,460评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,909评论 3 376
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,512评论 2 359

推荐阅读更多精彩内容

  • 本文基于面向基本公共卫生的业务系统设计经验,抽象出一套适合大型ERP系统的表单业务数据模型,目标是最大限度保留系统...
    燃烧的鱼丸阅读 1,734评论 2 14
  • 背景:最近在做一个项目,有大量的表单,200张左右。需求变化不定,表单字段经常变化。每个表单的字段很多(30-80...
    tony_f507阅读 2,505评论 2 2
  • 表单的作用 对于商业网站,支付信息表单是不可回避的问题。 对于生产力网站,表单有利于内容的创建和管理。 表单是什么...
    Miduol阅读 8,736评论 10 90
  • 任何互联网公司的产品看似都是由简单的设计组建构成,表单是大家经常能看到的基本的设计元素;表单对于公司网站的重要性是...
    几个字的思考阅读 1,601评论 0 10
  • 表单是什么? 表单是一个包含表单元素的区域,使用表单标签( )定义。 表单元素是允许用户在表单中输入信息的元素,主...
    Meowmaid阅读 1,425评论 1 7