移动端用户体验设计:请不要让我思考

2,077 阅读11分钟


这一阵看了Steve Krug的《DON’T MAKE ME THINK》一书,书中阐述的大部分都是Web端的可用性研究,移动端的篇幅非常少,而且章节里作者讲解的也不是很透彻,所以这里我把我对于本书得到的相对于移动端相应的可用性思考分享给大家,希望能给大家以后的设计一些有用的启发。

现在的产品设计越来越向交互体验至上趋向了,单纯美观的UI界面设计已经大大满足不了一个公司对移动端产品设计师的要求,项目想要上线之后取得一定成果(至少给下载了的用户不会有再删除的想法),就要迎合用户的使用习惯,这里我得出了三个满足良好用户体验的移动端设计规则和其相对应的解决方案。


规则1、去掉问号原则

让页面或屏幕不言而喻就像把商店布置得光线良好:这样会让你的产品看起来更美好。
要知道,大多数用户会花上比我们想象中少得多的时间来使用我们的产品,除非你的产品非常棒而且是必需品。


人们都是有惰性的,你在设计很多界面或者交互的时候,脑袋中应该第一个映像就是自己的用户很懒,它们不愿意思考,不愿意再在使用App这么一件小事上再去花费更多的学习的精力,所以你作为设计师,要为他们竭力避免它,竭力避免让用户思考。

这一点其实很多人都知道,这些很简单的用户体验的关注点其实大家心里都明白,但是要怎么做到它呢?这里提供给大家两个解决方案,只要你能满足这两点,你就能实现“去掉问号”,并大大的提高产品的可用性。


① 通过改变界面元素的外观

那么怎么才能够更好的帮助用户扫描呢?用书里作者的一句话说“如果你让每一个页面都不言而喻的话,那用户只要看一眼就知道该怎么用它了。”

不言而喻?这里最简单的方法就是通过改变按钮的阴影,界面元素的标签名称、尺寸、颜色或者布局,利用对比色等,让整个页面可以自我解释,让无论是任何一个人,看上一眼就明白了整个页面的结构和自己接下来应该如何操作。


② 更清晰的交互逻辑

请注意这里使用的“清晰”字眼,并没有用“少”,普遍大家都知道的道理是更少的交互逻辑,避免存在更深的交互层级,让用户迷失了位置,甚至有些公司的产品设计规则中明确规定了避免
5级以上的逻辑交互。

但是用户迷失与否真的跟这些交互层级有绝对的关系吗?并不一定!如果能保证每一次点击,每一次跳转都清晰可见明确,那即使在3层以上的层级上,也不会让用户出现问号或焦虑感,用户在使用App中对点击的动作要求其实并没有那么苛刻,如果你在更少的交互层级和较复杂的页面结构 与 更多的交互层级和清晰的页面结构 之间的取舍犹豫不决的时候,那么果断的选择后者吧!

这里作者贴心的给了我们一个疲劳值参考公式:

用户 3 次无须思考的点击 = 用户 1 次需要思考的点击 

即 4个结构简单的页面交互 约等于 2个结构复杂的页面交互规则


规则二、重视幼鹅效应

如果能通过在某种程度上打破一致性,而得到高度简洁清楚的效果,那么果断选择简洁,即简洁大于一致。
正如大部分人们使用新电器不会认真看说明书一样,人们在使用软件的时候也不会非常注意软件里面具体都有什么内容,他们跟你不一样(指产品的开发或设计人员),在海量的移动产品市场里,用户们有时候根本不会在乎产品的全部功能,他们大多数都在从AppStore下载之后适用阶段只会快速扫描你的产品,然后找到可能帮助到他的功能,然后决定你们的产品是否有资格留在他的手机里。

这就是一种幼鹅效应,即第一印象是绝对的一切。他们第一次使用你的产品(或者第一次使用迭代的2.0)将会快速的进行扫描,他需要的功能在什么位置(寻找中)?需要的这块功能可用性怎样(找到了)?有没有什么新意(观察中)?有没有解决了他们的问题(思考中)?解决的效率是不是高效(结果得出)?(形成对产品的第一印象,通常也是最终印象)

这就是个典型的“锚”,让用户愿不愿意为你的产品后期一系列的服务买单,起很大的决定作用的是第一印象。所以1.0的项目产品做的越简单越好,加班设计,速度开发,抢占市场。这个观点并不一定是正确的,除非非常必要,否则做好交互逻辑,做好可用性和产品用户体验是非常有必要的。

那么产品给用户良好的第一印象应该如何做好呢?这里提供给大家三个解决方案进行参考。


① 简洁!帮助用户扫描,减少视觉负担。

如果做不到让进入你的移动端产品界面的时候眼前一亮,那么至少做到关系明确简介明了,那是非常有必要的。利用好亲密性原则,即相关的区域分模块排布在界面之中,把页面划分成明确的区域。观察底部导航栏解释的是不是很清楚,最好是产品开发之前,拿到Axure做的Demo
给用户群体做个测试,看他从点开启动图标到找到自己想要的功能用了多长时间,几个步骤?如果测试结果很迷茫,那么你应该好好考虑有没有做到亲密性原则或者图标和文字的含义明不明确了?


② 视觉层次 远远大于 界面美观

如果要在美观性与层次抉择,设计师请果断选择层次感,设计一个界面结构,最重要的就是帮助用户思考,尤其是主页,哪些是最重要的,哪些是类似的,哪些仅仅是起到提示作用的。都要一眼上去一目了然。越重要的越凸显,相关联的结构要嵌套。这点在iOS10新的设计中体现尤为明显,iOS10的设计里大标题,超级加粗的字体甚至很不美观。弱化UI,只为凸显内容,精简精简再精简的界面,这些都是为了更好的输出视觉层级,说白了就是为了让用户更好的扫描界面,不管新的风格是不是一个正确的尝试,但是它的方向是绝对没有错误的,以后的产品视觉方向,也绝对是从 让用户看到你想给他看到的 到 让用户看到他自己最想看到 中转变。

层次感的设计落地也很简单,记住
  1. 需要明显的越要明显(有时候你觉得凸出的已经够了,其实还远远不够)
  2. 降低视觉噪点(用户第一时间不需要的全部筛掉,用最简单有趣的图标和精炼的文字表达最全的内容)
  3. 时刻关注好亲密性原则


③ 不要试图挑战习惯

移动端十年的发展,已经形成了自己的操作习惯,这些都是得到大家(用户们)认可的,所以如果没有非常好的理由,请不要去挑战这些习惯,如果你还不知道这些习惯有哪些,请参考最新的IOS和安卓的设计规范。



规则三、保证导航清晰

如果人们在你的软件里找不到方向,那么他们不会再使用你的软件了。

导航的重要性无与伦比,用户的迷失是非常可怕的,这就是为什么几乎所有的App都会放上Tab Bar,一款产品的好与坏,最关键的不是用户体验,不是界面的设计,而是交互逻辑(产品的交互设计师是多么重要啊)。交互逻辑决定了可用性,它是需要重视等级最高的用户体验。移动设备屏幕寸土寸金,我们不可能一直在下面放上导航栏告诉用户你在哪里(这样做也会显得很傻),所以良好的交互和必要的提示信息就替代成为了我们移动端设计最重要的面包屑导航,帮助用户可以找到自己的方向,而不是一生气直接按到手机主桌面强制关掉了你的软件程序。

关于交互设计,绘制你的原型图的时候,怎么做才能让用户使用的时候,在脑中出现一个声音告诉他这个软件是可靠的呢?这里我提供三个解决方案(也是需要注意的地方)。


① 正确的跳转和命名

移动端的 Navigation Bar 一般都在页面的最上面,并在旁边有回到上一级页面的返回键,这个Bar 上的名称字号大小粗细除了要保证一致性原则,即每一个页面的样式都一样,而且要有合适的命名。点击了一个地方,就要跳转到的相应的页面,这个页面的名字要与你点击的地方有非常明显的关联。而且值得一提的是,有时候通过反复的交互动效,对于让用户明白界面的元素、内容信息或关联的界面,从哪里来的到哪里去的 也会有意想不到的帮助。

其次,返回键的跳转不要傻乎乎的只是返回到上一个页面,想想你是用户操作到了这里,点击了返回键,你要返回到哪里,帮用户省略掉不必要的返回界面。有助于提高可用性,避免用户迷失和降低操作的烦躁心里。而且要注意,尽量在每一个需要返回的界面都要有返回键的设置,即便它并不是那么重要。


② 必要的封装和假提示

一些操作提交服务器等待时间较长,或者手机后台计算非常复杂,需要用户等待的时候,如果可以避免的话,封装掉它,即不让用户知道真实的状况,软件的计算和提交操作在后台进行,前端设计的时候不要设计loading或者进度条,让用户直接进行他接下来要进行的操作,而不是陪着服务器或者手机的计算速度傻等。

反之,一些非常重要的操作,但是不需要用户等待的时候,你反而应该做出loading和进度条,让用户等待一会, 并给出明确的成功提示和返回掉所有小操作回到主页面的按钮,这些不仅仅是提高用户操作性和安全感的设计,也更是软件给用户的隐形导航。


③ 子页面区别于上级页面

不要让所有的页面的结构都长的一模一样,要有明显区分的地方就要有明显的区别。



尾声:可用性与层级的抉择

最后还是那句话,如果你需要几个页面中放上很多的东西,在交互层级上与可用性之间进行抉择的时候,请记住:
管理屏幕空间的挑战不应该以牺牲可用性为代价。

交互层级多几个并没有想象中的那么坏,人们并不反对多点几下,只要每一次点击都不要需要太多思考就可以。忘掉那些所谓的规则吧,多研究研究用户,即使我们是设计师,也需要研究市场,毕竟我们所设计的一切都是为我们的用户服务的,我们的设计并不在乎他们喜欢怎样的方式,只要他们不讨厌就可以了。

好了,这里是全部的web设计《DON’T MAKE ME THINK  点石成金》关于移动端的思考,书的前半部分所强调的用户体验可用性研究可以移植到移动端的部分几乎全在这里,后半部分是关于产品可用性测试的,这里就不再赘述了。


感谢您的观看,如果对我的分享有什么见解的话,欢迎在评论区留言。