目录
即时验证减少提交后的崩溃

在为用户提供表单填写前,我们通常已经做了大量工作,以避免填写错误的发生。我们会严格设定标签的问题,以此来让问题表述更加清晰,我们还会通过合理的输入暗示对用户填写加以引导。但许多问题的答案远不止一个,这时我们就有必要对用户输入内容的有效性,进行即时验证。

即时验证可支持多种类型的反馈形式,这些反馈形式包含对用户回答问题提供建议,对用户输入答案的有效性进行确认,以及对那些有明确输入范围限定的答案提供设计引导。这些验证行为通常发生在输入开始时,输入进行中,以及输入完成时。


一. 输入有效性确认

当用户在进行表单填写时,无法知道已填入内容是否恰当,这时为用户提供即时确认反馈就显得尤为重要了。


1. 重名确认

一个比较常见的案例来自于用户重名确认。由于有很多产品都不支持用户名重名,所以在用户填写注册表单时,会对用户设置的用户名进行验证,并将验证结果即时反馈给用户,用户可以根据这一反馈结果,调整用户名设定。

比如,当我们在注册微信公众号时,在注册公众号名称一栏,填入名称时,如果填入的名称已经被其他用户提前注册了,那么微信会给与我们一个“当前用户名已存在”的即时反馈。此时,我们需要换一个其他的用户名,来获得注册通过。



2. 密码设定

另一个案例涉及密码有效性确认。当我们在设置某些产品的登录密码时,为了确保用户设置的密码具有一定的安全性,平台通常要求密码必须包含特定的字符类别。如果用户设置不符合要求,及时向用户提供确认反馈将有助于他们修改已经设定的密码。

常见的确认反馈形式可以通过明确的文案或实时点亮填写要求来实现,例如“密码中必须包含一个大写字母”。此外,一些产品设计还会在用户输入时即时点亮填写要求,以帮助用户更好地了解密码构成要求。


还有一些密码设置的表单中,不会强制要求用户设置密码构成,但是会通过密码设置强弱的进度指示,即时向用户传递密码设置的安全等级。


3. 验证码

即便是有很多答案明确的输入框,用户因为疏忽而导致的填写错误也会经常发生。比如当我们让用户填入手机号或者个人邮箱时,数字漏输或者邮箱字母填写错误,都是经常存在的。这时明确的反馈也能帮助用户发现问题。


当手机号码发生位数错误时,向用户发送“手机号不少于11位”等即时反馈文案,将有助于用户发现问题。当然在手机号码填写处,为用户提供11个小的数字输入框,能有效避免这类问题发生。

当用户因为疏忽,将邮箱或者手机号码填写错误时(比如字母或者数字的位置颠倒),那么平台往往并不能第一时间,查验出问题的所在,这时即时确认反馈就不再生效。一个能有效避免这一问题发生的方法是,对用户填写的邮箱或手机号码提供验证服务。

当用户填写完手机号或者邮箱后,我们会向用户手机或者邮箱中发送一条验证码,并要求用户将这条验证码中的字段信息,填入到对应的验证码输入框内,如果验证码填写正确,那么我们可以将这一验证信息,即时反馈给用户。


4. 反馈时机

如果为用户即时反馈功能,那么即时反馈的出现时机非常重要。在很多设计方案中,只要用户激活输入框,就会向用户反馈填写错误,而真正的填写还未进行,恰当的设计方案应该是在用户填写完毕后给出反馈。


即时反馈可以帮助用户在表单填写过程中,更好的确认填写问题的所在,但并不是所有的表单,都会为用户提供即时反馈确认功能。有些表单设计只有在用户提交时,才会集中向用户反馈所有的问题。如果是在一个非常长的表单中,当提交发生时,突然有大量问题需要修正,那么一定会给用户造成非常大的修改压力。


二. 有效答案建议

在用户填写表单时,即时反馈不只是让用户确认所填内容是否符合要求,有时还会为用户填写提供建议。

例如,当用户填写进行时,我们可以通过用户已输入内容,判定用户的预期答案,如果符合输入要求的答案范围非常广泛,那么通过一个下拉列表呈现符合要求的建议选项,将有助于帮助用户快速的找到所需答案,从而节省输入时间。

我们结合一个具体的案例加以说明,比如用户想要在表单中完善相关的地址信息,那么从用户输入开始起,我们就可以通过下拉菜单,给出匹配的地址选项建议。比如当用户输入“海淀区”时,我们可以在下拉列表中,列举所有所有含有海淀区字段的热门地址信息。尽管这些地址信息答案较多,但随着用户输入文字增多,建议的答案数量会越来越少,并且匹配的精度也会越来越高。


如果用户换一种输入方式,以具体的地点作为初始输入词,比如“摩玛大厦东门”,那么我们在建议列表中给到的地址信息中,数据的条数将变得非常少,用户可以很快的选出有效答案。


当我们在注册电子邮箱时,经常会在选择邮箱名前缀时,耗费大量的时间,我们会发现,很多我们喜欢的用户名,早已被其他用户注册过了。网易邮箱会在验证用户名重复时,给到用户命名建议,将一些没有注册的用户名提供给用户,尽管这些用户名可能并不能满足用户个性化的需要,但是有效名称的给出,可以很好的提升用户的完成效率。




三. 输入限制提示

有些输入框并没有固定的答案选项,但是确有明确的输入限制,比如对字节个数的范围要求,在这种情况下,即时验证也能为用户输入提供帮助。

例如,在小红书的用户个人资料完善表单中,个人简介最多只能输入100个字节。当输入发生时,右下角的字数统计会即时做出变化,帮助用户确定还允许输入多少个字节。




Design tips

1. 即时验证,可以帮助用户实时确认输入答案的有效性,非常适合在填写要求多,填写错误率高的问题中使用

2. 当问题有大量有效答案时,为用户提供即时建议,既可以提升用户的填写效率,也能规范答案的填写

3. 即时反馈的时机选择很重要,应该在用户完成填写后给出,而不是在填写进行中给出

4. 填写反馈应该在用户每回答一个问题后,就立即给出,而应该在用户完成所有问题填写,统一提交后给出。

5. 输入限制的即时反馈,应该在用户输入时,就实时给出,而不应该在输入完成时再给出。