在移动设备中,由于屏幕展示空间有限,所以通常不会给用户一些需要输入很多内容的任务,但是也会有些特殊的情况,使得大量的信息录入称为一个刚性需求,例如招聘类app的简历信息录入,以及生活服务类app中的发布二手房/车等等,这些信息如何能够更加便捷的呈现给用户使得输入的过程变得连贯和便捷,使得用户在一定的心理预期下顺利完成这些复杂的任务。
首先在做此类设计之前,最基本的核心设计方法是要确立的,就算字段再多再复杂,也有一个主次之分,先把主要内容进行提炼,这类内容如何区分可以和产品一起确定。例如在一个上传简历的任务中,姓名、电话等就是主要内容,获奖经历为次要内容。再例如填写快递单上,姓名,地址、电话为重要内容,货物价值等为次要内容。再区分好主次之后,就是“藏”的问题。移动设备中,界面一屏展示内容有限,大量信息的录入,往往重要信息已经占满了一屏,那剩下的次要信息如何在“寸土寸金的”移动端保留下来呢?
一,下拉式隐藏
字段1、2、3为主要字段,4、5为次要字段,所以以下拉的方式进行隐藏。并且在隐藏栏对内容进行提示,以便用户对展开后的内容有个有心理预期,以及可以选择不进行展开。展开后可以进行隐藏也可以不隐藏,根据隐藏的字段数量和内容决定。
利:用户对自己需要填写的内容可以有效控制,并且可以有直观的预期,交互方式简单容易接受。
弊:如果次要信息过多,全部展开的方式会把所有字段不加挑选的全部显示。
二,添加式隐藏
右上角的添加按钮可以把隐藏的字段全都放进去,但是点击加号之后所出现的内容确可以有好几种方式,来应对不同的需求。
1.弹出键盘直接填写
这种方式适合一两个字段的添加,尤其是数字输入效果会更好,只需要点击2步就可以完成输入保存后内容会连带输入结果一起展示在列表项中。
2,弹出浮层选择
这种方式适合一次添加多个字段信息,可以对需要填写的字段内容进行选择,保存后,选中的字段会出现在输入列表项中。当然也可以选择如下图中的单项选择器,可以少点击一次保存,但是如有很多字段的时候需要重复点击添加按钮进行选择,就看你如何权衡了。
3.气泡窗的方式
在字段不是很多的情况下,气泡窗也是一个很直观的方式,能更快的得到反馈,但是对字段的数量上有一些控制,不适合三个以上字段的隐藏。
利:可以有效控制页面内容,只选取自己需要的。
弊:对新用户来说添加的方式可能需要一个引导。
三.定制式隐藏
这种方式需要一个前置条件,就是用户需要经常使用大量信息录入的场景。而不是类似于个人信息或者简历,用户只需要一次填完,之后就是修改的任务了。这种经常性录入的场景可以存在于二手物品发布,物流行业内的开单等。用户可能有需求去定制一个自己的输入内容,根据自己的实际情况进行调整,灵活程度很高。
首先有一个配置的入口
在当前页面弹出选择弹窗,一次性可以添加不同分类的各项次要内容,可以多选,点击确定后字段添加至填写列表中。可以把添加的字段保存为模版,下次再打开此功能模块时,自动展示上次保存过的字段内容。再次点击配置可以进行重新设置。
利:可以一次添加全部列表字段,并且保存为固定模版,针对需要多次进行操作的需求来说,优势还是很明显的。
弊:对于展开内容没有预期,因为统一的配置,用户可能对该字段的展开位置困惑,如果再较长的表单中,很有可能找不到自己刚刚添加的内容。当然,如果可以做适当区分的话会更好。
四,跳转式隐藏
以上的方式都是在当前页面完成添加的,这类方式的利处是添加方便,直观,但是如果信息过多,会出现页面滚动,信息爆炸的情况下甚至会出现滚动2屏的情况。这是用户非常不愿意见到的。所以我们还需要一种方式。
以此为例,点击列表左侧则会跳转至下一个界面进行填写具体内容
此类方式目前存在于多数需要填写大量信息的产品中,但是我用的较少,这也是和我目前的产品需求有关,这样的设计注定对于填写的速度要求不是很高,可以慢慢的填写,写一部分保存一部分。但是对于提高填写的效率来说,不是很方便。这也要看具体的项目如何权衡了,在此我只在这一处用了这样的方式,因为可以在第一级直接选择通讯录进行选择。少量情况需要点击进入下一级。
以上就是我分享的四种移动端需要大量填写的表单类的交互方式,希望可以多交流。