序
Foreword
构想(parti)是建筑学中的一个基础性概念。它指的是要建造一组与跨学科协作趋势契合的学院派建筑,还是要建造一座足以适应各类观众审美取向的大剧院?为了把特定的构想变为现实,建筑师不仅要规划好建筑的基本功能,还必须懂得如何协调最终会影响建筑进程的种种复杂因素。
设计原理是建筑师提出构想的指导方针,它定义了建筑物的关键特征,能够在建筑相关各方(包括委托人、承建方、城市规划部门和工程师)之间起到沟通的作用。设计原理清晰地表达了基本目标,是做任何决定的依据,也有助于保证工程的各个组成部分最终合成为一个整体。但是,要完成一幢建筑物,只有设计原理还是不够的。
无论是修筑小小的阁楼,还是建造禅宗花园,建筑的主题思想或构想随时都可能面临修改,或者遇到无法逾越的障碍。可能的因素包括标准尺寸(standard dimension)、空间容量、审美观、物料限制,等等。希望把头脑中的构想变为现实的建筑师,必须全面、深入地掌握设计过程中的诸多因素,唯有如此,才能根据现实的条件做出最佳选择。
在这个组合中,上方是设计原理,下方是设计注意事项,而中间则是建筑师构思的各种用途的、能够满足人们或组织交流、通信及工作需要的具体结构。
对于读者来说,你们想把自己的构想变成活力四射的富Web应用程序(rich web applications)。同样,由设计原理和种种注意事项组合成的框架,也将是迷雾中为你引航的灯塔。本书作者Bill Scott和Theresa Neil是这座灯塔的建造者。长达30年的软件设计开发经历,成就了Bill和Theresa这样跨越多个领域的顶尖专家。不管是对术语的命名,还是对例子的阐述,乃至对细节的剖析,无一不映射出他们对成功及失败的富交互设计的深切体悟。
两位作者经历过的不计其数的案例为他们提供了独一无二的视角,让他们能够洞悉当今最成功的富Web交互站点背后的设计原理。本书第1至第6部分给出的原理,是用来衡量富交互能否为你的Web应用程序带来价值的圭臬。Bill和Theresa为每个原理提炼的注意事项和最佳实践,是做出可靠决策的重要依据。工程师、项目经理、市场营销人员,当然还有设计人员,应该反复领会并时常参照这些原理和注意事项,以确保每个人都能基于同一套标准来评估设计决策的影响。
在富Web交互的组合中,上方是设计原理,下方是设计注意事项,而中间则是Web设计师构思的各种用途的、能够满足人们或组织交流、通信及工作需要的应用程序。正如殊途同归的建筑设计。
想把活力四射的富Web应用程序的大胆构想变为现实吗?那么从现在开始,先通过本书迅速掌握Web界面设计必备的知识和技巧吧!
——Yahoo!公司产品构思及设计部门高级总监Luke Wroblewski著有畅销书《Web Form Design: Filling in the Blanks》(Rosenfeld Media)和《Site-Seeing: A Visual Approach to Web Usability》(Wiley)
前言
Preface
历史回眸
What Happened
我(Bill)的第一台个人计算机是Radio Shack Color Computer(1981年前后),配有芝克莱特译注1式键盘。最初几个月,我面对的主用户界面是命令行,即每天都要在COLORBASIC操作系统中输入代码。
后来,升级的Apple IIe让我用上了更好的键盘,而且机器里还预装了很多游戏。但是,界面基本上没有任何变化,仍然是命令行和基于文本的菜单一统天下。即使是IBM PC登上历史舞台,类同的地方照样居多。Lotus 123是当时顶尖水平的电子制表软件,它通过一组简短的键盘命令来控制。不过,即使是这种级别的应用程序也谈不上什么用户体验。
不久,界面革命开始了。1984年Macintosh问世,这种新机型刚推出时间不长,我就买了一台回家。Macintosh配备的鼠标打开了崭新的交互世界的大门。用户摆脱了只有学习古文一般的命令才能在基于文本的菜单中导航的命运,取而代之的是另一种自然而然的、更符合人类直觉的方式。
嗯,读者可能会想,这有什么值得大惊小怪的?别忘了那是1984年,不是现在。那么,这跟一本设计Web界面的书有什么关系吗?关系无处不在。
在Web有史以来的大部分时间内,Web站点和Web应用程序都以界面作为分水岭——与早期的桌面电脑时代很相似。多数Web站点都基于以下两个事件:
单击超链接
提交表单
试一试,就通过这两个事件能创造出什么吸引人的用户体验?而且,问题不止如此——每次单击或提交都会伴随一次页面刷新,创造流畅的用户体验几乎只是一句空话。
说来很有意思,解决这些问题的技术其实很多年前就已经存在了。只不过必须等到常用的浏览器普遍支持这些技术之后,开发人员才敢在日常开发中放心大胆地使用。2004年,Google发布了Gmail和Google Maps,这两个应用程序使用了之后被Jesse JamesGarrett称为Ajax的一组技术。
差别的确非常之大。基于Ajax的Google Maps支持实时平移、缩放,无须任何页面刷新,其交互性丝毫不亚于桌面应用程序。而当时的Mapquest则亦如其他Web应用程序,必须在每次移动或缩放地图后刷新页面。Ajax的应用,使过去的Web和现在的Web有了非常明显的差别。