如何设计出“让用户高效使用”的表单?

访客4年前黑客文章1140

笔者针对差异范例的表单做了可用性测试与阐明后,获得了有助于用户高效利用的表单设计要点,但愿内容对你有所开导。

如何设计出“让用户高效利用”的表单?

我们一直想研究表单中标签如何安排才气让用户带来好的体验,所以我们借助眼动仪对差异种类的表单举办了可用性测试与阐明,期间我们发明白许多有趣的数据,以下是我们对数据的具体阐明。

在各人具体阅读前,我们先说明下此次测试搭建的情况是一个有别于真实环境的、姑且的,因为我们需要正确的测试视觉跳动的进程、跳动的次数,我们需要消除测试中其他的滋扰因子,用户纯粹聚焦在表单的填写上。

卢克在我们测试筹备前和阐明数据的时候都给了又代价的看法和反馈,我们将他的一些理论纳入了可用性测试中,并通过数值数据来饱满和举证。

在构建我们要测试的表单的进程中,我们尊重卢克的两点发起,首先是思量标签位置和名目配置之间的干系,其次是表单填写内容熟悉数据与生疏数据之间的干系。

因此,您将在我们测试的每个页面上找到两种范例的数据。为了添加一些真实的环境,我们将用户熟知的数据输入字段与其他难的表单位素(如下拉列表框)配对。这样做也有助于我们确认我们以前对表格的发明。

我们的测试工具既包罗专家用户(主要是设计师和措施员),也包罗一些可用性专家和新手用户。我们要求用户填写我们提交给他们的所有表格。一旦用户点击提交按钮,我们的注视路径记录就完成了。

测试1:标签在输入框左边,标签左对齐

如何设计出“让用户高效利用”的表单?

这个是我们测试的之一个案例,是我们在日常糊口中常见的利用表单。毫无疑问,我们的两类用户在填写的进程中,对付标签和输入框的关联性的识别做的很是好。我们发明所有的用户在每个标签和输入框中都有一个单一的视觉跳动,这说明用户照旧很容易感知前后的接洽。同时我们也发明,典范的中等视觉跳动的一连时长是500毫秒,这个数值相对付其他环境长许多,这表白用户有较强的认知负荷。

标签及其输入框之间的空缺在视觉上很好地引导用户,让用户顺势去查察输入框。但同时也有一个问题,标签和输入框之间的留白是不牢靠,一些标签和它们的输入字段之间的间隔过大,迫利用户耗费更多的时间与表单举办可视化交互。

因为我们在表单中加了一个下拉列表框,所以我们也有时机确认我们之前关于它的发明:它们是最引人注目标表单位素。对面临一个白色页面上的简朴表单时,所有用户之一眼城市牢靠在下拉列表框上。这个表单位素清楚地转达了它的寄义以及用户该如何与之交互,在用户的大脑中赋予它更高的重要性。

另外,在我们的之一个测试表单中,在下拉列表中选择的项目仅显示一个数字,没有反复标签转达的寄义。我们发明,大大都测试工具,包罗专家用户,都被迫从头查抄标签,以提醒本身下拉列表中包括的数字的寄义。

测试2:标签在输入框左边,标签右对齐

如何设计出“让用户高效利用”的表单?

测试2比起测试1,标签在输入框左侧的环境与前面的测试完全沟通,但标签的右对齐将视觉停驻点的总数量淘汰了近一半,表白这种机关大大淘汰了用户完成任务所需的认知负荷。另外,表格填写时长也淘汰了近一半。

标签和它们对应的输入框之间险些没有视觉跳动,这表白用户很快领略了输入字段的寄义,同时也是因为眼睛在短距的侧眼移动上较量擅长。

固然我们利用左对齐标签淹灭了500毫秒用做扫视,但在右对齐标签上专家用户在标签和输入框之间的扫视时间仅为170毫秒,新手用户也仅仅淹灭了240毫秒。

我对这类表单最初担忧是用户眼睛在前一个输入框与下一个标签的开头之间的转换会较量坚苦,因为它的位置是不行预测的,泛起了锯齿状。可是功效证明,我的记挂是多余的。用户眼睛的斜视眼动很是快,在阅读第二行的时候,眼睛不需要调解核心和视距。

我们可以看到测试2与测试1对比,尽量视觉跳动次数有所下降,可是大大都用户(专家和新手)照旧需要从头查抄输入框的相应标签。

测试3:标签在输入框上方紧贴,标签左对齐

如何设计出“让用户高效利用”的表单?

相关文章

盲盒背后的上瘾密码——盲盒经济学

盲盒背后的上瘾密码——盲盒经济学

编辑导读:近几年,开盲盒溘然又火热了起来。不只呈现了各类百般的品牌,开盲盒的方法也八门五花。盲盒为何会让这么多人上瘾?开盲盒的人是什么样的心理?本文对盲盒令人上瘾的背后暗码举办了阐明接头,一起来看看~...

一个公式,把营销从玄学变回科学

一个公式,把营销从玄学变回科学

编辑导读:不知道从什么时候开始,各人都把玄学挂在嘴边。市场营销或许是互联网行业中最玄学的部门,用户的爱好基础无法琢磨。本文作者提出“习惯回路”这一公式,以更科学的方法举办市场营销,但愿对你有辅佐。...

美团“省钱化”升级,偷袭谁的珍珠港?

美团“省钱化”升级,偷袭谁的珍珠港?

编辑导语:这几天美团的“七编辑审核四个字”火了一把,贾玲沈腾成为美团的全新代言人;美团的板块很是的多元,除了外卖之外,尚有美食、美团优选、订旅馆等等,并且还开启了美团月付的一些成果;本文作者分享了关于...

TikTok 在美国就这么死掉,太可惜

TikTok 在美国就这么死掉,太可惜

编辑导语:前一阵,TikTok要被美国收购在网上闹得沸沸扬扬,不少网民对此发出了一些阻挡意见;可是实际上,TikTok作为中国产物出海,做到了让外国人成立起本身的平台,长短常不容易的;本文作者对此事举...

赛别人的马,挣自己的钱

赛别人的马,挣自己的钱

编辑导语:竞价排名是一种按结果付费的网络推广方法,由百度在海内率先推出;企业在颠末购置此项处过后,可通过一些要害词把本身的内容放在前置,这就使一些违规的告白通过此手段到达目标;本文作者阐明白今天头条在...

孔夫子没做到的事情,为什么多抓鱼可以?

孔夫子没做到的事情,为什么多抓鱼可以?

编辑导读:对付喜欢购置二手图书的人来说,多抓鱼是必备APP。既可以在上面出售本身不需要的图书,也可以淘到本身心仪的二手书。本文将从五个方面临多抓鱼展开阐明,但愿对你有辅佐。 一、媒介 在多抓鱼,当你...