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

访客4年前黑客文章1132

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

相关文章

GTD经验分享:一个产品负责人的效率工作流

GTD经验分享:一个产品负责人的效率工作流

GTD,Getting Things Done,是一套协助完成任务的方法论,核心点是收集、整理、组织、回顾、执行。那我们要如何使用GTD呢? 你有没有遇到过这种情况? 要做什么都是靠大脑来记忆,有空...

市场环境剧变,母婴营销如何突破重围

市场环境剧变,母婴营销如何突破重围

编辑导语:重新生儿来临到一个家庭的那天起,家庭消费的“风向标”就已经开始转向了母婴产物。母婴行业固然前景可期,可是要想取得市场的嘉奖却也并非易事。假如说本年品牌营销普遍难做的话,那么母婴品牌的营销就是...

关于语音交互,你了解多少?

关于语音交互,你了解多少?

编辑导读:跟着智能音箱、智能家居等智能硬件的普及,语音交互热度也不绝飙升。本文从交互模式的成长出发,梳理阐明白语音交互的优势、存在的问题和设计要点,并展望了语音交互的将来成长,但愿通过此文可以或许加深...

5个要点,持续提升产品经理的核心竞争力

5个要点,持续提升产品经理的核心竞争力

随着产品经验的持续积累,你会发现产品最重要的核心的竞争力其实是判断力。高阶产品有意识的进行密集项目实践,持续输入对用户的客观洞察,来迭代自己的判断力。 一、为什么产品最重要的核心竞争力是判断力? 在...

品牌做好怀旧营销正当时

品牌做好怀旧营销正当时

如果怀旧是人类的底色,那么品牌可以顺势做些什么?品牌做好怀旧营销正当时,那么该如何做好怀旧营销呢?本文笔者结合案例给出了分析。 这个世界越残酷,我们就越难舍弃‘怀旧’这副玫瑰色的眼镜。 尽管这个世...

利用 Google Firebase 建立数据收集与分析系统

利用 Google Firebase 建立数据收集与分析系统

编辑导语:Firebase是一家及时后端数据库创业公司,它能辅佐开拓者很快的写出Web端和移动端的应用,让你的App从零到一。那么,如何操作 Google Firebase 成立一个数据收集与阐明系统...