优化输入框让填写如丝般顺滑

　　看似简单的输入框，实际上对用户体验有着十分明显的营销，那么如何优化？看文章如何解读。
　　填写是一件麻烦事，我们或多或少感受糟糕体验。设计开发者也很无奈，感觉身体被掏空。怎么办？
　　让我们从优化输入框开始吧！看着简单的框，对用户体验的影响很大。特别是在非常有限的手机屏幕中，怎么帮助用户顺利的填写完呢？值得我们好好研究。
　　视觉层面
　　舒适的填写区域
　　常用的数值是：拇指的滑动触发区域在宽高45px左右，图标的操作区域是48dp，输入框行高在80dp左右，行间距在8dp。
　　左图行距过于拥挤，而且文字大小不统一，给用户一种填写内容很多的感觉
　　简洁的描述
　　填写标签要简洁，过长的标签有两个问题：
　　使填写的内容压缩。
　　影响整页对齐。
　　平行排布优点是：符合视线规律。阅读更快。如果要填写的标签实在过长，检查一下是否说不清楚的可以用占位符描述？或者采取垂直排布的方式。平行排布优点是：对标签字数限制不严格。
　　恰当的颜色
　　输入的结果我们常常用颜色来反馈，比如蓝色代表链接，灰色代表失效，绿色代表正确，黄色代表提示，红色代表错误。红色的使用要慎重，因为红色默认为最高等级警告，如果红色的提示出现过多会对用户造成紧张感，想到试卷上满篇的厚叉了么？所以把提示分级吧。
　　对于大家公认的色彩暗示，如果随意交换容易造成误解，特别红色和灰色。这有点像我们默认为穿裙子的形象是女，穿裤子是男，如果有天你看到穿裙子标识的男厕所，会困惑吗？
　　对于约定俗成的事，走寻常路才更易用
　　明确的指示
　　当用户选中准备输入的时候，应当提供清晰的视觉提示，这样让用户明确知道自己的位置，而不是迷失在茫茫表格中，这种细微的反馈会让用户更有掌控力。
　　交互层面
　　标注键盘类型
　　手机上的键盘触摸点非常小，触摸键盘需要随时调整，根据每个表单域的不同数据类型，为用户提供不同的键盘布局。输入方式有三种。对于第一种纯数字的我们可以锁定为数字键盘。
　　纯数字：电话号码、邮编、各种号码
　　纯文本：用户名、地址等
　　混合格式：评论、备注等等
　　上图填写电话号码，如果如右图默认好数字键盘，填写时就节省一次切换键盘的功夫。
　　对于一些固定选项我们常常使用控件帮助用户更快填写，比如日期，性别，地区等等。尽量在当前页面调用控件。如果填写内容范围广，需要进入二级页面另一页来选择适合，尽量提供快速检索方式。还有一种情况是对于容易填错的选项，使用控件，减少用户的填写错误，从而减少心理负担。
　　但是我们要思考使用控件是否更快速，下图这个例子，填写还款日的时候进入另一个选择，把128以及月末安行排开，初衷应该是为了容错，但是使用起来繁琐。
　　及时验证
　　当你好不容易填写完长长的信息，点击提交，这时候界面提示：你有20项填错虽然我知道作为金融产品，这项的目的是为了限制错误。然而这种处理方法显然不是最好的。
　　没有人喜欢后知后觉的反馈，特别是错误。告知用户输入内容是否正确的最佳时机，是在用户填完内容后立刻告知用户。内联验证可以马上告知用户输入的正确性。帮助用户及时改正，无需等到点击提交按钮。如果只有一个错误要修正，那就很容易，能降低用户放弃的可能性。
　　清晰的反馈
　　关于填写错误的描述应该非常清晰，比如注册时密码填写，不要说密码安全性过低，而要说，密码必须超过8位，或者密码必须包含大小写和数字。总结为两点：
　　发生了什么错误，可能原因是什么。
　　用户应该做什么来改正错误。
　　必要的说明
　　有两种输入项目常常要加入说明：
　　专业性强，大众可能不清楚
　　安全隐私或者金钱相关，有心理顾虑
　　针对第一种，说明能减少输入错误，例如银行转账不是及时就到，而是需要两小时，金额不是任意的，每天有上限，并且和所剩的余额相关。如果这些是在用户输入完才告知，或者报错，那么这个锅用户当然不愿意背。
　　针对第二种，有心理顾虑的，可以承诺不会对用户造成损失，或者找背书，该方案已经通过XXX安全认证。消除顾虑之后才能顺利进行下一步。
　　上图转说明了限额，以及限额原因，能让用户在正确范围内使用
　　减少用户输入
　　说了那么多，最让用户舒心的莫过于帮助他们填写，因此，许多需要填写、选取的表单最好有预设的初始值或者内容填充在其中，这样可以让用户用起来更加方便，这就是智能预设。常见的使用场景有搜索联想输入，地址定位等。
　　总的来说，优化输入框设计主要有三个方向：
　　提高输入速度
　　为用户输入提供引导帮助
　　直接有效的指出用户输入过程中的问题
　　重视每一个接触点的用户的感受，这样我们的产品才被打磨的越来越精致。