7 种方法,帮你设计高效好用的表单(一)

2019 年 12 月 30 日

7 种方法,帮你设计高效好用的表单(一)

缺乏同理心的 Web 表单是怎么样的?设计师又能做些什么呢?


当我想到表单的时候,我记得那些让我颤抖的比走路时更厉害的。好的表单和不好的表单,这两者之间有一个主要区别,好的表单就像是用人类语言跟我简单的说话,而不好的表单,困难的似乎是我填了一张火星上买地的表单。


更令人沮丧的是,即使在数字世界中,这些表单仍然困扰着我们。在数字时代,生活不是应该变得更轻松吗?那么,怎样才能把世界从糟糕的表单中拯救出来呢?


移情设计。


可用性专家和用户体验研究人员发现了设计师在设计表单时所犯的常见错误。所以,球现在在我们的球场上。我们,表单的创建者,必须确保任何表单都不会破坏用户的体验。


在我开始之前,我想让你去你的设计作品库,找到到你今天设计的所有表单。看看它们然后帮我回答下面的问题:


你现在读的时候,有什么问题听起来很困惑的吗?


你是否要求用户提供太多不相关的信息?


在多项选择题中,你有给用户足够的选择吗?如果没有一个选项匹配答案,是否有一个字段可以让他们写下回复?


你是否有提供说明,以帮助用户理解表单及其用途?


你是否在表单中添加了如何将此信息用于/不用于其他目的的免责声明?


你是否有要求用户提供个人信息?比如血型、婚姻状况


通过这个练习,我希望你能站在用户的立场上回答这个问题——如果有人要求你填写这个表格,你会有什么感觉?无聊,恐慌,烦躁,满足,快乐?


无论你的回答是什么,它都将帮助你找出错误并设计出更好的 Web 表单。但是首先,让我们看看现在看到的常见问题是什么:


它们缺乏人际交流


大多数 Web 表单在与用户交谈时缺乏同情心。他们提出的问题令人困惑,冗长或繁琐。但它不一定是那样的。与其他任何通信方式一样,表单应易于流动。它们应该清晰、简洁,有时候是巧妙的,而且始终是互相协作的。考虑下如下的例子:


该问题假设填写此表单的用户至少有一个孩子。但是却增加了“没有孩子”的选择。


有一个更好的方法去提出这个问题,即“你有多少个孩子?”,后面是一个文本字段,用户可以在其中根据自身情况添加数字。


它们要求太多无关的信息。


我们都喜欢数据,但不喜欢填表单,因为它们问的问题太多了。用户害怕填写要求过多个人信息的表单。


这样想吧——你在度假时遇到一个陌生人。你沉溺于一些闲聊,但在那之后,陌生人开始问一些你的个人问题,比如婚姻状况、爱好和你的收入来源。你害怕吗?当然!


Web 表单和那个奇怪的陌生人非常相似。以下是 Web 版本:


除非你建立联系,否则没有人愿意填写他们的个人信息。因此,与用户建立可信赖的关系并为表单添加人性化是非常重要的。


他们缺乏连贯性和个性


Nick Babich 说“表单是一种对话。和任何对话一样,它应该由两方之间的逻辑通信组成:用户和应用程序。”


登录到您表单上的用户将在此开始对话。但是,当输入字段、对齐方式、间距、文本颜色、标签等小东西不一致并且看起来视觉上混乱时,它们会失去吸引力。这就会造成混乱,用户要么跳过它,要么填写错误的信息。


从这里我们可以得出的唯一结论是,糟糕的表单无处不在——一种是注册表单,一种是新闻通讯的表单,还有一种是更大更复杂的结帐流程表。


所以,现在的心理模型是这样的,当用户在与网站交互时遇到三到四种不好的表单时,他们会认为这是在浪费时间和精力。他们甚至不喜欢“填表单”的想法。这是设计表单的主要障碍:如何设计表单以使人们想要填写它?


本文转载自 Think 体验设计公众号。


原文链接:https://mp.weixin.qq.com/s/wcxNBmZf70b8udrrkca8rA


2019 年 12 月 30 日 18:0487

评论

发布
暂无评论
发现更多内容

HTTPDNS开源 Android SDK,赋能更多开发者参与共建

应用研发平台EMAS

android 阿里云 开源 httpdns 移动研发平台

区块链有了几个新“标准”!

CECBC区块链专委会

区块链 版权保护

Flutter Bloc模式

码爷

flutter ios 程序员

亲测三遍!8步搭建一个属于自己的网站

华为云开发者社区

MySQL Linux 开发者 网站 华为云

作为一名Java程序员,技术栈的广度深度都不够还想要高薪?请先把这些技术掌握再说。

Java成神之路

Java 程序员 架构 面试 编程语言

JVM真香系列:方法区、堆、栈之间到底有什么关系

田维常

Java JVM 堆栈 方法区 Java虚拟机

【Swift实现代码】iOS架构模式之MVP

码爷

ios swift 架构

阿里P8架构师“墙裂”推荐:Java程序员必读的架构进阶热门书籍,值得学习!

Java成神之路

Java 程序员 架构 面试 编程语言

2 w字长文带你深入理解线程池

Java架构师迁哥

轻松云上揽胜中华,靠的就是这份聪明的“地图”!

华为云开发者社区

MySQL 数据库 postgresql AI 地图

java-File对象

Isuodut

握草!美团P8整理的280页超详细Docker实战文档简直太香了,让你对如日中天的Docker有更深入的了解。

Java架构之路

Java 程序员 架构 面试 编程语言

一位Java大牛结合自己的业务和平台多年来在Netty实践中积累的经验总结《Netty进阶之路:跟着案例学Netty》。

Java成神之路

Java 程序员 架构 面试 编程语言

DeFi质押挖矿系统开发技术

薇電13242772558

区块链 defi

接口文档生成详细教程

测试人生路

接口文档

IMC总决赛精彩对战应接不暇,英特尔酷睿极致性能燃爆比赛现场!

intel001

Teambition 网盘 VS 阿里云盘:阿里这个浓眉大眼的也开始玩赛马了?

郭旭东

阿里云 阿里云网盘

加快脑动脉瘤检测,AI来了

华为云开发者社区

人工智能 学习 算法 华为云 医疗AI

云图说|多模态AI开发套件HiLens Kit:超强算力彰显云上实力

华为云开发者社区

人工智能 开发者 物联网 机器人 华为云

阿里大牛说:你凭什么搞不懂SpringBoot,Cloud,Nginx与Docker

小Q

Java 学习 编程 架构 面试

高交会科技盛宴:“科技改变生活,创新驱动发展”

WX13823153201

高交会

《精通Tomcat:Java Web应用开发、框架分析与案例实战》.pdf

田维常

tomcat

数字投票时代即将到来

CECBC区块链专委会

数字投票

AliP9整理出微服务笔记:Spring微服务不止架构和设计

周老师

Java 编程 程序员 架构 面试

手把手教你本地 k8s 集群搭建云原生 Tekton CICD 流水线

比伯

Java 大数据 编程 架构 计算机

文科妹子都会用 GitHub,你这个工科生还等什么

沉默王二

GitHub

数据结构与算法系列之递归(GO)

书旅

go 数据结构与算法

企业级软件的核心价值

Philips

敏捷开发 企业应用

LeetCode题解:剑指 Offer 22. 链表中倒数第k个节点,双指针,JavaScript,详细注释

Lee Chen

算法 LeetCode 前端进阶训练营

双11购物节国外剁手党同狂欢 阿里云视频云电商直播实时字幕

阿里云视频云

云直播 直播 直播带货 语音识别

美国区块链政策大盘点

CECBC区块链专委会

区块链 政策 货币

7 种方法,帮你设计高效好用的表单(一)-InfoQ