网站产品移动化的用户体验设计思路浅析

又是到处流淌着阳光的周末。让人忙碌和揪心的一件件事依然在继续。想到之前在微博上看到的一句话，大致是这么说的：“最终一切都会好的；如果还没好起来，那就是还没有到最后...”。今天的内容发掉之后，继续收拾家当；最好呢，这两天可以再抽时间搞些字出来，接下来的几篇候选文章还是不错的样子。大约10天之后搬家，所以下个周末能否如期更新就看前面几天的造化了。

说正事儿，今天的小译文相对务虚，原文作者浅谈了一些关于移动化产品在用户体验设计方面需要注意的问题，值得思考和借鉴；话题中有待深入探讨的空间还不小，全当抛砖引玉，强烈欢迎各位朋友通过评论提出您的看法。走着。

对于移动化产品(移动版本的站点、Web应用等)的用户体验设计，我们会习惯性的将更多注意力放在“动”的方面。回想一下自己是否经常会幻想这样的情景：用户正走在上下班的路上，或是在等车，或是挤在地铁上...他们掏出手机很匆忙的上上网或是摆弄摆弄app，然后继续奔波。

现实中，用户对移动产品的使用情景以及体验需求，其实早已超出简单的“动”的范畴；另外，随着平板电脑的普及，需求的种类也在不断的扩大和发展。作为用户体验设计相关人员，我们会发现，曾经惯用的一些小伎俩，比如简单的缩放功能或是更容易触控的大按钮等，已经无法满足用户更深层次的体验需求了。

移动设备、应用及移动互联网的发展脚步仍在日益加快，在这种局面中，我们怎样才能让自己的Web产品在移动化方面的表现更好的满足用户的诉求与期望呢？

了解用户的实际需求

不能否认，设想用户在一种繁忙的状态下尽量抽时间访问网站或使用应用的做法并不是没有意义的；“高效”和“易用”仍然是移动产品的重要成功要素。不过，“动”只是一个方面；一个越发明显的趋势是，用户会越来越多的像使用台式机或笔记本那样，在家中或是其他相对安静稳定的环境中使用移动设备。随着移动互联网和移动应用在功能、设计、体验等方面的日渐成熟和易用，人们会越发习惯于使用移动设备完成目标，解决需求。

从应用软件，到用户需求，到市场发展，整个移动领域已经打破了几年前那种单调乏味的束缚。移动产品的用户体验设计工作的重要程度已经和传统桌面设备领域中的不分伯仲；我们势必要更加用心的了解用户，理解他们在不同情景中的行为习惯，以及对应的多种方面的需求。

了解设备的功能特性

在进行移动产品相关的用户体验设计工作时，我们需要时刻牢记在头脑中的，就是用来运行该应用的设备平台本身的功能特性。通常，屏幕类型是第一个需要关注的方面；通过用户调研，我们可以事先对产品的目标用户群的设备使用情况做到预估。举例说，黑莓用户更习惯鼠标风格的控制方式，对于这种交互方式来说，按钮或链接的悬停状态样式是有意义的，而iPhone类的触屏手机则不然。

设备的性能与速度也是与用户体验相关的重要功能要素。大家都知道，在传统的Web行业中，页面加载速度会在很大程度上影响产品的用户体验与SEO；对于移动设备来说，这方面的因素变的更加重要，因为用户对于移动设备的性能与速度的敏感度要高于桌面设备。如果一个移动版站点或是Web应用的加载和响应速度过于迟缓，用户会很容易“武断”的认为该产品根本无法正常的工作，或是归罪于自己的网络链接方面的问题而放弃。页面或应用界面中过于丰满的内容和功能会导致设备在内存等方面的资源吃紧，加载时间也会相应增加。然而，这些显而易见的问题往往会在实际的产品设计过程中被忽视或搁置。

对内容结构和页面长度的控制

传统桌面版的网站，绝大多数仍是通过不同的页面来体现网站结构。相比之下，移动设备则比较欢迎内容更集中、页面更少更长的结构与呈现方式；尤其是对于触屏手机来说，滚动页面的操作方式比基于键鼠的桌面设备来的要容易的多。

不过这并不意味着所有的内容都应该被一股脑的呈现在一个页面中，否则对用户来说，体验将会变得非常糟糕——用手指拖拽页面进行滚屏的交互方式虽然很来感，但过于频繁的话，则会挑战用户的耐心。我们应该花些心思考虑一下怎样以更巧妙的、交互性和控制性更强方式来进行输出，例如采用下拉菜单或手风琴风格的“展开 / 收起”列表等UI模式，通过JavaScript的配合，将内容按照合理的优先级组织起来。

清晰、简洁、易跟随的功能流程

Jakob Nielsen老师一直站在信息架构革新的最前沿。他在2008年提出的弹性交互理论(interaction elasticity theory)对移动领域的用户体验设计产生了重要的影响。

简单的说，该理论认为，清晰、简洁、易跟随的功能流程会对用户体验带来最大的优化作用。如今，传统Web用户似乎已经习惯了复杂的网站架构、导航系统以及操作流程，但这些并不适用于移动版本站点或Web应用。对于用户体验设计人员来说，要在移动化产品的设计中时刻遵循并实践这一理论，以保持功能流程尽量简短，并且易于聚焦和跟随，让用户快捷的获取信息、完成目标——这些远没有理论本身看上去那么简单。整个“简化”过程也许需要很多相关部门的参与配合，尤其对于已有产品的移动化重设计项目而言。

避免功能和内容的缩水

移动版的站点或应用，绝不应该是普通桌面版产品的缩水版，无论在是功能还是用户体验等方面。但是我们可以在不少移动版产品中发现，为了减小文件尺寸，加快下载速度，内容中的很多图片、视频、甚至文案本身都被删除或简化了，只剩下一些最基本的信息。

对于那些经过认真调研和设计的桌面版网站产品来说，有很多“非必要”的内容或页面元素，往往是出于增进内容多样性或提升易用性等方面的原因而存在的；在移动版的产品中，这些元素是否有必要存在，还要视具体情况而定。更加合理的做法是基于自己的产品对这些内容和视觉元素进行优先级判断，并在尺寸规格、布局结构等方面重新规划，专门针对移动设备进行响应式的调整，而不是一味的将它们抹掉。

在这方面的一些具体的实施策略和方法，可以参考我们之前关于响应式设计的概念、组成要素、基本实现思路以及怎样通过CSS3 Media Query实现响应式Web设计的文章。

移动化的未来

在移动领域，无论是用户的数量与成熟度，还是设备本身拥有的技术和功能，都在持续快速的增长和发展。市面上出现了越来越多类似jQuery Mobile这样的前端开发框架，用以帮助传统Web领域的设计师和开发者打造与本地客户端在UI与交互风格上非常接近的Web应用或混合型应用。(相关话题，可以参考阅读我们之前的文章，包括前端开发者的跨平台移动应用开发策略及工具和走出移动互联网的迷宫 - 网站移动化的方法策略)

如今的用户，多数已经脱离了“我用移动设备，因为这很酷”的幼稚阶段，他们在设备和应用方面的见解以及对技术的了解程度越来越高，同时，对糟糕的用户体验的容忍程度也越来越低。我们曾经了解和习惯的那些用于提升传统Web产品用户体验的原则方法，有很多同样适用于移动领域。对于移动版的网站产品，不可以仅仅从“移动”的角度进行简单而盲目的“优化”——站在用户体验的角度，移动版需要我们思考和投入的，甚至会超过桌面版产品。