从可用到易用的一次思考|手机获取验证码那点体验

我们做用户体验的不能将系统过失/产品过失迁就于我们的用户。因为用户永远不会错,用户也没有必要为产品和过失负责。我们要做的就是穷尽我们解决问题的能力帮助用户获得最佳的使用操作,并能带来一丝的惊喜。


我们做用户体验的不能将系统过失/产品过失迁就于我们的用户。因为用户永远不会错,用户也没有必要为产品和过失负责。我们要做的就是穷尽我们解决问题的能力帮助用户获得最佳的使用操作,并能带来一丝的惊喜。

从可用到易用的一次思考|手机获取验证码那点体验

问题根源

最近在做公司某个PC端项目时涉及到企业要获得权限必须进行一次资格认证。而在这个过程中,其中要紧的一步是进行手机号的验证。但是,最近公司网站频繁被黑,考虑到用户手机号会受到骚扰,同时短信平台也会增加无谓的流量压力。因此凡是涉及到用户进行手机号码验证的地方,都额外增加了输入随机验证码的步骤。

从可用到易用的一次思考|手机获取验证码那点体验

图1 登录输入验证码

流程分析

从逻辑上来讲这个操作并不复杂,对照随机验证码内的字符输入即可,如果看不清楚,点击换一张(刷新)即可。而且放到整个操作流程上来说也只是多一步操作而已。

从可用到易用的一次思考|手机获取验证码那点体验

图2 任务流程分析

用户操作行为分析

看似只是增加了一个简单的输入验证码的步骤,但是实际上进行用户行为分解时其实是复杂了很多。其中微动作的分析下可以发现:

从可用到易用的一次思考|手机获取验证码那点体验

图3 用户操作流程分析

  1. 企业用户在平台上的上一步操作中点击提交下一步,来到手机验证这一步时,手机号是不用再次输入的,因为这个必须而且是必要的从用户中心获取;
  2. 实际上输入随即验证码是这个页面操作的第一步,但是这个步骤中因为验证码规则安全性的考虑,采用字母+数字组合的方式。殊不知在键盘上数字区域和字母区域相距较远,操作切换过程花费时间会比较长。(用户目标是企业用户,台式机占大部分);
  3. 另外获取手机验证码时用户行为需要从键盘上切换到鼠标上从而获取手机验证;
  4. 输入手机验证码是6位数字,又需要切换到鼠标。

明确问题

看似简单增加一个验证码,实际上在第2步操作以及切换到第3步操作的过程上给用户操作带来不必要的繁琐和时间冗长。

虽然添加随机验证码有这样的缺点,但是其简单的逻辑以及被带坏的用户操作习惯造成我们在设计上的思维定势。误以为这就是最合理的解决方案,虽然不是最佳的,但是确实最稳妥,最没有争议的而且对于技术实施来说也相对容易。

那么还有没有更好的操作方式,或许在看到上述表述,你的心里已经有了更好的解决方案。但是不要着急,因为我也找到了一种比较合理的方法。慢慢看来,是不是和你的一样。

分析问题

解决一个问题之前首先要做的是这个问题的来源是什么。

我在前面讲到了这个问题的来源是因为平台频繁被黑,无法判断获取手机验证码的是来自于真实的用户还是程序下的黑客们。

那这样做的目的又是为了什么呢?

  • 为了让我们的系统认定这个操作是人为的;
  • 为了防止黑客恶意获取对短信平台造成影响;
  • 为了保护用户信息的安全;
  • 为了提高用户操作效率(优化的最重要目的)。

产品案例分析

知道问题是什么以及要做什么了,那么我们看看有什么好的可以借鉴的操作方式么。

首先想到的是某付宝,我们来看看这个据说是互联网信息安全最厉害的公司是怎么做的。

从可用到易用的一次思考|手机获取验证码那点体验

图4 拖动滑块验证方式(1)

这个一滑到底的操作方式想必很多人都用过。其延伸的操作方式有:

从可用到易用的一次思考|手机获取验证码那点体验

图5 拖动滑块验证方式(2)

这个是比较有趣味的解决方式,利用大家熟知的拼图方式(建立简单的认知模型)结合卡通形象做一个趣味性的验证方式。

从可用到易用的一次思考|手机获取验证码那点体验

图6 拖动滑块验证方式(6)

除了卡通形象外,另外像人人网登录验证时,用户拖动滑块到指定位置并且成功后提示用户拖动滑块的时间并做了一个百分数的排名,转移用户的对因安全验证而增加的滑动验证的抱怨,增加趣味性并且通过排名激励用户下次对使用滑块的期待。这种方式也是极为不错的。

方案设计

结合当前比较流行的滑动验证的方式,首先我先做了一个流程上的优化分析。

  1. 原始流程中输入随机验证码-获取手机验证码-输入手机验证码,对应着动作操作为键盘输入-鼠标点击-键盘输入;
  2. 优化流程为拖动滑块获取验证码-输入验证码,对应着动作操作为鼠标拖动-键盘输入。

流程上优化方案确定后,接着进行原型页面设计,如下图:

从可用到易用的一次思考|手机获取验证码那点体验

图7 设计优化方案

优化方案提出后,经过产品评审和技术评审讨论,这个方案从开发逻辑上来说相对于随机验证码方式复杂了许多,因为这里需要前端去控制滑块的移动,移动位置数据的随机规则会比验证码随机生成的规则不同。虽然在一定程度上增加开发周期,但是能够满足产品安全策略并且提供一个良好的用户体验。所以方案评审通过,并且进入开发。

总结

  1. 这个方案能够实施推进的前提条件是手机号码必须要先输入正确;
  2. 简单的交互,能够满足可用性,但是还不够易用性;
  3. 用户体验也是可以迭代的,综合考虑开发成本、上线时间等因素,用户体验在版本迭代中慢慢提升;
  4. 当产品处在功能快速迭代的时候,产品的用户体验会在上线时间紧迫的压缩下损失一部分,但是对于细节的体验要保持持续的关注。

 

作者:Nick Chen,微信号:Chen_YonWei,从事某互联网行业,3年交互设计,擅长场景分析和产品品牌分析。曾主导过智能硬件,Web后台管理等多端的用户体验工作。偶尔做做平面设计和3D建模设计。

本文由Nick Chen原创 发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/27442/

(0)
CatherineCatherine
上一篇 2017-05-17 17:56
下一篇 2017-05-17 19:51

相关推荐

  • B2B、SaaS 等企业软件中的交互设计总结

    ♝点击上方“交互设计学堂”关注我们,送电子书我刚开始在VWO工作的时候,一直想弄清楚一个问题:企业软件(B2B)真的和B2C应用不一样吗?对于设计师或者设计流程来说,两者又有什么不同?这篇文章是我在过去几年里的一些经验梳理,希望能够帮助那些想去或者已经在企业软件团队工作的设计师们。什么是企业软件?下面是维基百科中的定义:企业应用是一种计算机程序,主要用来满足企业的需求,而非独立的用户。一些大家可能用过或者见过的企业软件。在现代企业中,大...

    2018-04-20
  • 设计的三个层次,帮你重开情感化设计的大门

    我们正在进入一个信息复杂度远超以往的时代。我们所面对的是一个物质和信息都极大丰富的世界,从产品竞争的角度上来说,越来越激烈的对抗和冲击是必然的。许多产品已经从单纯的“谈配置”过渡到了“谈感情”的阶段,情感化设计已经在不同的设计领域中崭露头角,甚至成为了最核心的组成部分。

    2017-05-15
  • 通过减少认知超载,提升用户体验(上)

    “怎样才能改善用户体验设计?这是关于用户体验研究恒久不变的话题。今天给大家推送的是关于运用认知心理学中的相关理论来提升用户体验的研究。希望对大家有帮助。 文章太长,会分成两次推送,欢迎期待~“通常,飞速行驶的货车不可能轻松地停下来。因为它需要花费很多努力,运用更多的动能去改变运动状态。与其强迫人们从他们的主任务上转移注意力,不如直接带他们去他们想去的地方。”
    ——Luke Wroblewski,谷歌产品总监

    2017-05-07
  • 交互模型的构建方法

    交互建模用来对应用当中的交互模式进行定义,它同时还诠释了这些交互模式是以怎样的方式被整合成为具有高度一致性的、容易被用户理解的交互模型的。我们曾经在第二章里对iOS交互环境的概念模型和空间模型进行了解析…

    2014-12-01
  • 用户研究:中国人网购的7个真相-信息图

    在需求和消费之间,永远存在着不对称性。 电商已经改变了中国人生活的方面,而且还将继续扩大自己的影响力。 中国已连续三年成为全球规模最大的电商消费市场。国家统计局公布数据显示,2015年中国人在消费品零售中…

    2016-05-26
  • 交互设计精髓-阅读心得1

    学习交互设计,选择第一本读的书是《交互设计精髓 About face 4》,因为这本书在交互设计领域名气很大该书一共分为3个部分,一共有21章。最近刚刚读完第一部分,有所感悟,在此记下,与尔分享之。交互设计就是站在用户的角度看问题永远为别人着想,心中装着别人,站在用户的角度看问题....读罢本书,这是关于交互设计在心中停留的第一印象。由于交互所设计的是产品与用户接触相处的整个行为过程,所以用户的感受首当其冲成为检验设计的重中之重。可是我...

    2018-04-28
  • 如何做让老年人也能方便使用的网站【UXRen译#176】

    作者:保罗•克瑞斯顿(Paul Crichton)  |  翻译:阿陌,校审:天蛙   英国有近三分之一的人口都超过50岁。 他们在2015年的网络消费额就达到了14.45万亿英镑。 他们中76%的人会每周至少一次进行网上购物。 50岁以上…

    交互专题 2023-03-03
  • Axure RP 7.0软件安装视频教程

    Axure RP 7.0下载地址:链接:https://pan.baidu.com/s/1eTf0W6Y密码:otr5安装中有问题请咨询私人微信:152374906801、找到AxureRP_Pro_Setup.1415607193.exe鼠标右击以管理员身份选择打开2、点击next3、勾选I Agree,然后点击Next4、点击Browse更改安装路径建议安装到除C盘以外的磁盘,可在D盘或者其他盘创建一个文件夹。然后点击Next5、名...

    2018-03-04
  • 交互设计自我发展三部曲——“器、势、人”

    数十万互联网从业者的共同关注!作者: 集创堂-纯色个人微信号:jichuangtang作者授权早读课发表,转载请联系原作者欢迎投稿到早读课,投稿邮箱:mm@zaodula.com交互设计师(或者称UI设计师)发展的三部曲——器、势…

    2017-08-01