译者：Daisy

全文共 3904 字 7 图，阅读需要 8 分钟

———— / BEGIN / ————

最开始的iPhone于2007年6月发布。

2008年末，当我们开始研究第一版移动报告时，大多数人还是在使用有着最极其糟糕的用户体验的原始移动设备。

在那个时候，相较于体验糟糕的移动设备和移动网站，任何稍微像样的产品都会带给用户愉悦的体验。

三年前，移动报告第三版出来时，我们对移动端可用性做了严密的评估。我们很高兴移动端可用性报告不再是一种矛盾的修饰，我们最终看到很多网站、客户端都有相当好可用性。

第四版移动端用户体验调查报告，我们继续看到了进步。

现在，大多数的移动网站、app都提供了非常好的用户体验——也有一些问题，为了让页面更好看可用性做出了些牺牲。但我们可以自信地说：自上次报告以来，这一领域在过去两年中取得了进展，大多数惊人的错误不再出现。

当我们尝试更新许多移动指南的示例时，我们发现这些公司已经解决了他们的问题，并且我们讨论的一些问题已不再普遍出现。

然而，我们也遇到了两年前我们认为几乎灭绝的问题的再次出现。

在可用性方面，错误（如趋势）往往是循环的：一代人识别它们并创建避免它们的设计模式，但后代不再看到用户体验问题，在追求新设计时再次犯同样的错误。

它总是前进两步，后退一步。

一、内容 vs  Chrome

内容优先于UI（例：chrome）的重要性是从响应式设计中吸取的教训之一，而汉堡菜单是这个教训的结果。设计师们试图尽量减少屏幕可见的UI元素数量，为宝贵的内容提供更多的空间。

两年后，设计师们继续评估移动设备上屏幕的地位，他们已经达到了隐藏chrome导航栏的程度。

虽然汉堡包的方式正在被打破，但隐藏导航仍然非常普遍（正如我们在其他地方所论述的，隐藏导航是某些站点的唯一选择）。

许多人也已经理解，如果有更好的模式（例如：可见导航栏）是可用的，那么不应该隐藏导航。

Chrome对内容进行优先级排序，已在其他设计领域中渗透。例如：我们不再看到占据页面一半页面的导航栏。

嵌套模式（让用户在遇到内容之前通过多个页面进行一系列选择），也不再像过去那样受欢迎。至少有一些公司已经开始意识到，最好是在移动设备上将导航结构扁平化——立刻向人们展示各种内容，并允许他们将其缩小到特定范围内。

Walgreens.com采用了嵌套导航栏的模式，在过去那是非常流行的但是现在很少被应用了，他要求用户在看到任何产品前，先在4种类型中作出选择。

然而，Walgreens尝试去通过向一些类别选择页面，添加产品图像来创造内容错觉，这表明设计师可能意识到这种类别设计的乏味。

iPhone上的 Google express，在Grocery下不是用全部子类别的列表，而是在每个子类别下显示一些内容。

App正确使用基于内容的设计，而不是使用基于类别的设计。

二、使用手势

手势解决了太多chrome在小屏幕上的问题，但是他们很难的发现和学习。一些原始的手势热情（纯手势的应用程序（例如：Clear Todos）体现）已经衰减，但手势的使用仍然是移动设计中更有前途的方向之一。

iPhone版本的clear todos，第一版出现在2012年左右，使用各种手势来弥补ui上的不足，但是这些手势很难让人记住。

不幸的是：手势是鸡生蛋蛋生鸡的问题。他们不会变得易学和好用，除非手势在app、网站上建立了使用规范，并且所有的app和网站的手势使用都要有一致性。

另一方面，设计师被迫远离手势，因为他们对用户群的熟悉程度如此之低。

苹果已经多次尝试扩展手势的标准词汇表（随着3D Touch for iPhone 6S 的推出），并将一些可见的浏览器委托给手势。

iPhone X的尝试已经结束了iPhone的唯一物理按钮，用一系列轻扫手势代替。优点是提高了屏幕使用；缺点是对曾经习惯使用home键的用户来说，初次学习该手势的使用带来不便。

3D touch技术是很有前景的，但是他很少被使用在app上。

但是，其他两种手势流行程度开始增长，以至于增添到基础手势词汇表中——滑动删除（展示删除动作的上下关系），两指滚动来移动嵌入网页中的地图。

滑动删除只是简单为列表元素增加上下操作，两指滚动解决了与滑动冲突的问题，这经常在网站嵌入地图中遇到。

这些手势对用户来说变得越来越熟悉，尽管我们仍然建议使用这些手势的设计，可以添加其他的方式来执行相同的操作，或者至少具有良好的上下文提示来引导用户。

两指滚动手势滚动地图，变成一种标准来解决与滚动冲突的问题（当人们尝试滚动页面却意外滚动了地图，反之亦然）。

三、移动网站和应用程序更好的结合

从网站过渡到要求用户使用特定操作的app，在iOS上，用户需要打开一个app然后在其内部进行搜索。

从iOS 9开始，移动网站和app间的切换变得更加简单，比如：我在搜索引擎中搜索了一个电影，一些结果将会自动打开对应的app页面（当用户已经下载了这些app）。

当选择了搜索结果页的电影链接时，控件将从safari跳转到iMDb app。返回app按钮显示在顶部状态栏的左上角，并标有以前使用app的名字。

从浏览器到app的无缝跳转，一般来说，从一个app跳转到下一个的体验是非常好的，因为通常app相比较于网站将具有更好的用户体验（因为他们更接近他们设计的移动平台）。

但是，追踪他们的位置，并且知道如何操作返回的这种设计，会给用户带来新的负担，App仍然需要满足这种需求。

举个例子：我们会注意到很多app在层级深的页面并没有放logo，会给使用者造成不知停留在哪的困扰。

一个显著的提高，可能与从浏览器转换到app的易用性相关，app内的插屏广告大幅度降低。当去新网站前会插屏广告邀请用户下载app已经过去，大多数时候会将广告放到web页面的banner处。

四、更好地使用电话功能

虽然不完美，越来越多的网站和app利用电话的基础功能。

像Apple Pay 和Android Pay，由于集成系统让付账在很多电商网站变得很轻松，大多数的网站和app都会考虑到用户当前的位置。

生物识别有望让我们更接近忘记密码的问题，甚至可以让用户轻松跨设备传输信息（并自动登录），从而使桌面登录更加轻松。

当设置一台新iPhone，不需要输入凭证进行身份验证——他们自动从附近的设备上传输。

五、减少指导说明

几年前，任何一个可敬的app都是从漫长的指导开始的，这些app对提供所有不同的功能进行编总。这些教程是糟糕和无效的，在冗长的指导列表里，没有用户可以记得过多的命令。

他们也没有动机想要去记住他们中的任何一个，毕竟谁可以说哪些功能实际上是有用的呢？

今天，这些指导已经很大程度上被app一般概述（应该指引导页）取代了，打算说服用户登录并创建账号。

理想上，这些登录页应该完全的消失，应该允许用户在没有任何注册的情况下体验app。

最初app的应用概述会发挥广告的功能，但是大多数人讨厌到处都是广告，尤其是当他们已经花费了精力下载app。

六、向后一步

总体而言，响应式设计产生了积极的影响，跨平台的交互形式的追求，已经推动了一些奇怪的解决方案。

比如说：使用分割按钮菜单（split-button）或者手风琴菜单（accordions）。

分割按钮菜单主要目的是：复制桌面类别在主导航栏悬停和点击交互效果，即允许访问类别登录页面和子菜单。

这是一个非常不可用的解决方案，不仅是因为在狭小的空间内挤满了内容，以至于用人们的手指点击它们都非常的困难，同样也因为它违反了用户的期望和到迄今为止他们所学到的移动端使用规范。

另一个惊人的发展是：顾客结账开始消失。在过去提供这个功能的网站和app被取消，一些依靠apple pay结账和paypal结账来弥补顾客结账的不足。但是仍然有很多逼迫用户来创建一个账号，尽管他可能是一次性消费者。

从好的方面来看：在很多设计中登录注册越来越简单，现在很常见的用户仅被要一个邮件帐号和密码就可以创建一个账号。

浮层覆盖流行程度不断的增长，很多网站的菜单采用浮层覆盖的形式。

两年前，很多移动浮层覆盖是错误的并创建了很多有趣的效果（例如：浮层突然出现在内容的顶部）。

现在的浮层覆盖好多了，但是它们经常看起来充满屏幕，人们对待它们的期望，能使用离他们很近的返回按钮并且会到之前的视图。通常在这种情况没发生时用户会迷失方向，然后离开该网站。

当整个流程在浮层上被移动（这就是顺序菜单越来越流行的原因），出现错误的次数会增加更多，人们忘记去使用在浮层中菜单栏的返回按钮，确保的正确返回路径，却使用浏览器或者手机的返回按钮。

LATimes.com：这个菜单显示在浮层上看起来是个新的页面（左侧图），尽管关闭按钮在顶部的左角，人们仍然尝试去点击浏览器的返回按钮关闭浮层。如果她们这么做的话，她们将会回到之前的视图页面（搜索页-右侧图）来替代LATimes的主页面。

七、结论

从第一步iPhone开始的十年里，移动端用户体验领域已经达到很成熟的程度。

根据comScore最近的报道：在这个世界上的很多地方，超过一半的线上时间是在移动端上。

所以移动可用性赶上桌面可用性是正确的，这并不意味着移动端网站和app已经到达了完美的可用性状态——没有完美的设计。它简单的意味着它们中的很多提供了不错的用户体验，很多在过去臭名昭著的错误也已经被修复了。

参考：

comScore.2017.The Global Mobile Report

翻译：

Raluca Budiu.2018. The State of Mobile User Experience

———— / END / ————

本文由 @dasiy 翻译发布于人人都是产品经理。未经许可，禁止转载

点击“阅读原文”下载APP