我们在做表单设计的时候，一方面希望我们的表单可以对用户有引导，可以针对用户的操作作出适当的回应，防止他们放弃表单填写；另一方面我们不希望一开始加载大量表单，一下子就把用户吓到，下面是我在项目中做表单设计的一些考虑。
针对如何提升表单设计的引导性主要会考虑以下几个问题：
一、如何排列体验是最优的？
用户在填写表单的时候经常会犹豫不决，所以要尽可能简化表单填写过程，表单设计要遵循内在系统逻辑，符合用户的使用习惯，减少视觉负荷，创建良好的信息层次。
1. 国外的设计研究员mattero penzo做了眼动实验，如果将label放置在input框上面，眼睛扫描表单速度会更快。
图片1来源于Uxmatters
2. 按照逻辑顺序聚合排列表单，便于用户理解。
图片2 UX Planet的注册页面
图片2 UX Planet的注册页面把birthday表单填写聚合在一起，方便用户理解。
3. 将input框与将要输入的长度匹配，尤其是可能会输入很多信息的输入框大小一定要留够，让用户对将要输入的内容有所预期。
图片3 Salesforce Object界面
图片3 Salesforce Object 表单里面description input框比较大，提醒用户可能会输入比较多的内容。
二、额外的提示怎么做到恰到好处？
为什么需要提示？
Sting TV的数字负责人Yakir Reznik做了A/B测试，在A版本只给用户提供姓名和电话号码表单让用户填写，在B版本中除了给用户提供姓名和电话号码表单，还添加了一个解释，即如果用户需要找回密码，则需要此信息，虽然提示比较长，甚至在移动设备上面还需要额外滚动，但是转换率却提高了11%。所以好的提示对用户的引导性和防止用户放弃有很重要的作用。
在做项目的过程中一般会遇到以下几种提示，每种提示都各有优缺点，大家可以根据自己的实际情况使用提示。
1. 静态提示，在界面上固定显示，不会消失。
- 优点：始终在界面呈现提示，用户不会错过它，对指导用户操作有重要作用。
- 缺点：占地方，会让界面不整洁。
- 建议：如果是特别重要的信息或者是不容易理解的信息，建议采用静态提示。
图片4 Salesforce Object 界面
图片4 Salesforce表单填写有大量静态提示，帮助用户理解自己需要做的任务。
2. 按需显示，当鼠标点击或者悬停在图标“?”、“!”、“i”或者链接上出现提示。
- 优点：不占用很大区域，还可以指导用户。
- 缺点：对于不熟悉的用户会错过重要信息。
- 建议：如果是对用户填写前作指导，且表单信息容易理解，避免信息过载最好隐藏提示，如果是对用户操作作出反馈，建议预留提示消息空间，且要立即提示最好。
图片5 WIX Login 界面
图片5 针对用户操作作出反馈，提示用户输入错误。
3. 自动出现，当label或者input框获得焦点时，提示自动出现，随着焦点变化而改变。
- 优点：在需要的时候出现不会有负担，也不会被忽略。
- 缺点：信息填写完即使不再需要它也会出现。
图片6 Zeplin Login界面
图片6 Username input框获得焦点时，提示自动出现，当焦点在password时提示在password右侧出现，username右侧的提示消失。
4. 自动消失（一般指占位符），输入框提示用占位符，一旦用户焦点在该框，占位符消失。
- 优点：不占用很大区域，还可以指导用户。
- 缺点：显示提示信息空间有限；当用户输入一半信息想要看提示的时候是无法显示提示的。
- 建议：如果提示信息不多建议用占位符。
图片7 Invison 注册界面
三、如何减少用户输入次数？
好的表单设计可以减少用户输入次数，提升工作效率，目前主要从下面几个方面去考虑。
- 打字交互成本高，尽量用单选或者多选代替，让用户做选择题，减少用户输入。
- 区分可选和必选字段，必选可以加 * 号，让用户可以集中于必填字段。
图片8
图片8 用 * 号标识出必填字段，但是如果大多数是必填且有大量表单，建议只标识出非必填，如下图9。
图片9
四、如何鼓励用户继续填写信息？
给用户持续的激励，会刺激多巴胺的产生，多巴胺是一种化学奖赏的神经递质，会产生神经系统的兴奋性，所以为让用户可以愉快的完成表单，不中途放弃，要有一些激励设计。
1. 完成过程中提醒用户进程，鼓励用户继续填写表单。
图片10
2. 完成任务之后给用户一些称号激励，例如给用户设置青铜、白银、黄金、铂金等等级，给用户升级刺激。
图片11 WIX 界面
后面我会讲当表单数量很多时，如何做设计？