设计心得：如何提高验证方式可用性整理.pdfVIP

设计心得 ：如何提高验证方式的可用性 验证码的作用是什么呢 ？它有哪些类别 ？怎 平衡用户体验和用户帐号信息、敏感信息安全 性之间的关系呢 ？本人做过一点通行证相关的交互设计工作 ，现在整理一下和大家分享 ，并 和大家探讨如何提高验证方式的可用性。 相信大家在进行“登录”、“注册”或是敏感信息操作时经常会被要求输入验证码 ，有些验证码很难识别 ，用户输入体验不是很好。下图是大家一直热议的12306网站的验证方式 ，故意的文字扭曲和低分 辨率图像是为了防机器人刷票 ，但是 ，机器识别麻烦的 ，人同 也麻烦 ，人识别简单的 ，机器也容 易破解 ，打个不太恰当的比喻 ，这就像癌症化疗 ，消灭癌细胞的同时也损害健康细胞。 12306的图文验证式验证码 验证码的类型 第一类 ：简单的数字、数字加字母、加减乘除 这类图片验证码用途广泛 ，在web网页端和各种智能终端用来防止机器人软件恶意注册、暴力登录 、短信防刷等用途。 常见的数字字母组合的验证码 （１）分析 它的优点在于图库丰富 ，可较好的防止爬虫遍历 ，缺点是需要用户手动收入 ，尤其是在移动端键盘 较小、环境较复杂的使用场景 ，随着图片验证码的变形程度加大 ，用户的输入正确率降低。 （２）交互可用性 为了提高用户的输入效率 ，经量降低用户的厌烦情绪 ，交互规则可以采用“图片验证码实时校验”和“ 输入错误后自动刷新图片”两种方式。前一种方式是给用户实时操作反馈 ，让用户“知错就改” ，避免 用户“千辛万苦”输入完成后再提示错误 ，造成用户的挫折感 ；后一种方式是用户在输入错误时不用 手动点击图片刷新而是图片自动刷新 ，尽量减少用户操作步骤 ，同时给予用户积极引导 ，用户看到 图片已经刷新了 ，就会比较愿意再试一次。 第二类 ： 文/标验证式、拖动验证式等 上文介绍的目前广泛使用的图片验证码 ，最早的灵感可能来自卡内基梅隆大学 （本人最想读却读不 起的大学~ ）的路易斯·冯·安 （Luis vo n A hn ）在2002年设计的扭曲的英文字符验证码。但之后 ，慢 慢出现了图文/标验证式、拖动验证式等“五花八门”的验证方式。 拖动验证式验证码 图文验证式验证码 （１）分析 这类验证码在移动端和网页端都有所使用 ，因为控件需要较大的放置空间 ，所以网页端使用更多 一些。图文/标验证式、拖动验证式验证码的优点是不需要用户键盘输入 ，而且形式新颖 ，有一点“ 游戏”的味道 ，用户可能会有想要“玩一玩”的心理。 但是 ，就像上文提到的12306案例 ，一些知识性和常识性的问题有些用户可能并不知道 ，因此无法 选择 ；另外 ，对于一些中老年用户或是较少使用电脑和智能终端的用户 ，这种稍显“新颖”的验证方 式让他们“不知所措”产生恐慌。技术方面 ，我们可能感觉第二类验证方式比第一类简单的字母数字 组合更复杂 ，因此会更加安全 ，其实 ，用户觉得越来越难并不代表机器越来越难破解。 （２）交互可用性 目前趋势是这类验证方式被越来越多的运用 ，但是建议尽量用在大屏幕的手机、平板设备和电脑上 ，如果在小屏幕手机上使用这种验证方式 ，会占用较大的屏幕空间 ，感觉控件过“重”。有些产品的 交互规则定为开始隐藏 ，随条件触发这种验证方式 ，触发弹出时往往会遮盖其他控件或引起“跳屏” 。其实 ，在小屏幕上用手指点击和拖动滑块不一定比键盘输入的成本低。 第三类 ：综合型 前两种对比可知 ，第一种较“轻” ，第二种较“重” ，而且各有优缺点 ，那么用户必须二选其一吗 ？其实 ，在安全性和综合体验的动态平衡中 ，设计师和工程师一直不断努力研究可用性更好的验证方式 ， 于是产生了一种“综合型”的验证方式。 综合型验证方式 （１）分析 这种方式简单来说就是通过分析用户进行相应操作时的行为来判断访问者是人还是机器。这种方式 的原理基础是人和机器在操作时 ，二者的环境、动作、频率和逻辑等是不同的。反映在交互上就是 通过拆分步骤的方式进行多步验证。 （２）交互可用性 这种验证方式的优点在于 ，对于低风险环境 ，用户可以单步骤验证通过 ，可用性良好 ；对于高风险 的环境 ，则根据风险情况触发第一类或第二类验证方式。这种“区别对待”的验证方式是将“麻烦事”由 用户方推给了技术方