从网站到移动客户端应用 随"机"应变的用户体验设计

2011-11-22 19:17:08来源:为网而生作者:

平日的工作忙碌了些许,疲劳因素让每晚散碎的时间显得更加吃紧;赶上这样稍微有点篇幅的文章,做起来就有些迟缓了,哼哼唧唧的翻译了将近一周。

即使这样,我们也无需扔掉HTML、CSS、JavaScript或是相关的Web App前端开发框架——这些工具可以帮助我们在开发原生应用的过程中创建快速原型——无论视觉还是交互方面都相当高保真的快速原型。

说到设计工作本身,特别在用户体验方面,移动应用与传统网页之间还是有着显著差异的。有两点需要特别注意:人机交互方式与使用场景。

  • 对于移动设备来说,你需要面对和解决的交互设计方面的问题会有很多,和以往不同,你现在是在为手指做设计。你必须考虑的一个问题是,怎样的页面元素布局可 以让拇指自由的操作并充分的休息。另外,当用户在进行操作时,界面的一部分必然会被拇指遮挡住,所以要尽量保证控制元件的布局不会干扰到实际内容。类似这 样的问题还有很多,多数可以归纳到“舒适度”与“可视性”这两方面。这也是多数触屏智能手机会将主要控制元件或导航一类放在屏幕底部的原因——而这些与传 统Web设计的习惯正好相反。
  • 你需要知道用户多数会在怎样的环境下以怎样的方式使用客户端应用。对于这个问题,我们通常有个误解,就是觉得用户都会在很忙很赶、无法集中注意力的情况下使用应用。其实这只是实际情况的一部分,“移动应用”并非只在移动的状态下被使用;很多时候,人们会在沙发上、在厨房中、在机场候机时进行操作。在这些场景里,用户拥有足够多的操作时间,注意力也可以非常集中。另外,移动设备在很多方面的功能是超越桌面计算机的,譬如GPS、内置麦克风及摄像头、触控、陀螺仪、罗盘等;基于这些功能打造的不同类型的客户端应用,它们所对应的使用场景也各有不同。

不要过于自信的假设用户的意图。移动应用未必代表功能的简化,当你告诉自己“用户并不需要在移动版本中使用这个功能”时,你也许是错的。回忆一下你是否有这样的经历:在移动设备的浏览器中打开一个你所熟悉的网站,却发现页面跳转到了所谓的移动版本,不仅在视觉和操作上与你的习惯不符,更糟的是也许它所简化掉的功能正是你所需要的。虽然用户正在使用小屏幕设备,但这不代表他们需要获取的信息、需要使用的功能变少了。

我想说的是,我相信在多数情况下,无论移动应用还是所谓的移动版页面,它们都应该与桌面版的网站及产品具有相似的内容与功能。当然,正如我们在前面提到的,在呈现及交互方式等方面,它们需要基于设备自身的特点而区别对待,但在内容方面应当尽可能保持一致。有些时候,移动应用甚至需要做的更多,拿亚马逊 (Amazon)举例子,他们的移动客户端应用还具有条码扫描功能;这是充分利用移动设备特有功能的典型案例。

从网站移动化这个角度来说,作为Web设计和开发人员,需要把思路锻炼的更加具有弹性。在过去超过15年的时间里,我们只是为桌面浏览器设计网站。真正的Web设计不该是这样的,它应该中立于平台之间的差异,在任何设备、任何尺寸的屏幕中都保证可访问性及可用性。

当然,在移动设备大规模普及之前,我们确实很难看到这一点;现在,我们开始了解到自己的网站和产品会被各种类型的设备访问及使用。这并不是说我们要为所有类型的设备都单独打造一个版本——真正需要的是让网站有足够的适应性和响应性。

关于响应式Web设计,可以参考我们之前的两篇文章:“什么是响应式Web设计?怎样进行?” 以及 “通过CSS3 Media Query实现响应式Web设计”。

Robin Nixon (Web开发人员、科技文章作者,著有HTML5 for iOS and Android: A beginner's Guide一书)

在我看来,对于传统Web设计及开发人员来说,进行扩展或转型的最佳入门方式,就是保持手头技术的先进性,包括HTML(5)、CSS(3)和 JavaScript;目前,将Web App整合成为原生客户端应用的解决方案正在日趋成熟,要实现产品的移动应用化,我们并不一定需要花时间学会那些复杂的编程语言,比如面向对象C语言、 JAVA、.NET等。只要你拥有足够扎实的前端设计和开发能力,你就可以很轻松的创建Web App。