交互设计

交互设计导论

语义学家、哲学家阿尔弗莱德·科日布斯基(Alfred Korzybski)曾说过:“地图并不是领地本身。”本书也遵循这一观点。地图虽然不等同于领地,但却能帮助你在领地中游觅,找到你身处的位置和即将前往的方向。本书内容广泛,涵盖编程、电子学、交互设计和艺术,如地图一般提纲携领,全部点到即止;而这些内容都是交互设计的重要方面。作为近年来新兴的领域,交互设计包含了艺术、设计、心理学、工程学和编程,而工具的发展又让它越来越容易企及,在本书中我们将看到这些工具如何让编写代码变得更简单。

不妨把本书当作一份地图,看看交互设计领域里都有什么技术,有哪些技术是你希望了解的。这不是一本手把手式的教程,也不是一份精深的技术手册,但会指引你去了解一些其他的书、研究者、设计师、项目和艺术家。本书还会让你从技术上掌握,如何从各种各样你感兴趣的项目中获取有用的资讯,以及如何利用你已掌握的资讯。

交互领域中的编程

我们主要关注交互设计中要用到的编程知识,也就是用编程的手段,去创造用户能直接与之交互的应用。编程有很多种,其中有些技术和思维方法更适合用于服务器和数据库,而不是交互。而本书集中讨论的东西将是你用来建立用户和应用之间沟通的知识和技能。交互设计中的一大挑战是如何在你设计的作品和用户之间建立真正的交互。

交互的本质

那么,“交互”到底是什么呢?我们可以把它定义为双方或多方之间的信息交换。作家及电子游戏设计师Chris Crawford把交互描述为“两位及两位以上的参与者相互间听、想和说的过程”。通常谈及交互的时候,无法避开编程,因为交互中总有计算机系统或其他控制结构让人们去操控。计算机或机械系统是为 “用户”而设计的,“用户”所使用的就称为“系统”。关于交互,流行着各种各样的专有名词,例如“人机交互”、“机人交互”和“体验设计”等,事实上它们的含义大同小异:设计某种系统,为人们提供某种他们可理解的交互方式。作为一名交互设计师,你会尽力去理解用户想做什么,以及自己设计的系统应该如何反馈。你的系统可以是任何东西,例如游戏、菜单、若干连在一起的传感器和灯、一个复杂的物理交互应用等,甚至可以是其他人。

你还应该理解交互设计中的一个重要概念:反馈回路。反馈回路是指一个实体为适应内部或外部调节系统而与自身通信的过程。听起来有点复杂,其实你对此早已熟悉,例如我们的生物调节系统、流汗散热、呼吸保持氧气在体内循环、眨眼避免眼干等。当你需要更多氧气的时候,你会深呼吸,你不需要刻意“通知”身体作出这些反应,你的身体自己会去完成。为了保持体内一定的含氧量,身体发出信号,增加呼吸深度或频率,直至达到所需要的含氧量。身体向自身反馈,向自身发送信号,不断增加自身的呼吸,达到所需水平后则停止发送信号。关于反馈,类似的例子还有骑自行车,调整着平衡是不断反馈的过程,即脑部向身体发送信号,身体向脑部反馈信号,这样才能让你保持平衡。对于一个持续工作的系统而言,反馈回路非常重要,如果没有反馈,系统就不知道自己在做什么,因而也就无法进行自我调整。

我们来看看怎样从“消息发送”变为“交互”。假设其中发送方享有主动权,接收方只能收但无法给出回应,这种情况只有信息传递,谈不上“交互”。你会很容易联想到电视广播或电台广播。在合适的时间、地点,加上合适的设备,你就能看到或听到相应的信息。而广播并不考虑谁在看、谁在听,只会按它自己的时间表和节奏进行。

在此基础上,如果用户可以重新收看(听)节目,或者可以自己决定收看(听)的时间,这就增加了一个用户控制层。其实你并不是真的能和一本书或是一个静态网页进行交互,甚至对于大多数动态网站你也做不到,但你可以控制浏览的速度,可以重新阅读那些你没有看懂的内容。这其实就是导向传播。它向你提供了一系列预设的内容,让你选择要看的部分。滚动页面、点开链接、快进和回退等都属于导向传播的手段。

我们再进一步,向用户提供一些方法去完成一个任务或者向系统输入数据,真正改变系统的状态,同时也制定了一些方法,让系统去反馈用户的动作。这样,你就建立了交互。反应式交互是交互的开始,它让你开始考虑用户要做什么,你的系统或对象应该如何反应。对于用户的任何动作,系统或对象都必须作出反应,就算无法给出用户期望的反应,也必须告诉用户“我不明白”或者其他错误信息。这些功能可以在一个系统内实现。这一类的应用程序不少是用来监控系统自身状态的,例如检查系统中的某一个属性当前的状态,或者确认仓库里箱子的数量。如果把这些套用在两个人之间的交互,你可能会想到父母向孩子给出指令。

再复杂一点,这一次系统持续做着一件事,而用户可以通过向系统输入信息来控制和调节这件事。很多工业监控系统就是这样工作的,同样的还有游戏引擎的主要部分及很多其他交互装置。建立这一类交互的难度在于,确保用户在任何时候都清楚系统正在做什么,知道他们可以怎样改变系统,并且明白他们对系统任何一方面的改变都会影响到其他方面。再把这些套用到两个人之间的交互,这回是父母教孩子走路,随时留意着孩子会不会摔倒。另一个例子就是调节系统,在用户执行任务时调节他们。这里,双方之间并没有真正的沟通,因为调节系统并没有给出反馈,它只是在改变对方的行为,当中还包括连续系统。系统也可以自己完成此类任务,它能实时监控和调整正在进行的过程。

以上最后提到的那种交互模式与学习模式的交互类似,但要稍微复杂一点。系统同样在持续运行;用户可以看到系统的内部,但不再是调整自己的行为,而是从输出数据中学习。很多监控系统就是这样运作的。系统让用户看到相关的数据,以此让用户使用和了解处理的过程。当然,系统还是没有与用户交谈,它只是在运转的同时向用户报告信息。用户的操作受系统报告的驱使,但没有被系统改变。这就是之所以把它称为“学习模式”的原因。这种模式下,系统和用户都更善于自我学习,当然两者所使用的方式有所不同。

现在我们来看一个更复杂的交互模式——管理型模式。用户和系统之间双向沟通信息,并且系统允许用户执行另外一个任务。真正的复杂性从这里开始。用户与系统通信,让系统执行某些任务。系统回应用户,让用户继续执行另外一个任务。系统依旧运行,用户也依旧工作,就算出现了用户的反馈回路,一切都依旧进行。从金融行业到医疗领域,很多实时监控应用程序就是这样的系统。

最后,我们来看看最复杂的交互模式:真正的对话。这在人和人之间的交流再寻常不过,但若发生在人和机器之间就是另一回事了,因为对话的构成是很复杂的。只要想一想我们如何通过字词、音调、面部表情、身体姿态、潜台词和上下文来相互对话,就能明白要有巨大的信息量被迅速交换和处理。当然,大部分人机对话远没有这般复杂。

一个简单但典型的例子是使用移动设备来导航。当用户频繁地移动并向设备提出请求时,设备就不断地更新位置信息,向用户反馈以及指出方向。实现对话模式的交互是交互设计和工程中最紧迫的挑战之一。各类模式的交互帮助用户完成不同的事情,实现起来各有难度。我们可以根据用户类型、任务目的和交互发生的语境来选择合适的交互模式。

消息与交互

交互的建立需通过系统和用户之间的双向消息传递。消息可以是文本、语音、颜色、视觉反馈,或是机械和物理输入及反馈。在某些场景之下,眨眼是和按下按钮一样清晰而重要的消息。交互设计师经常考虑的是,如何在用户和系统之间建立简单明了的方式,以便双方构建、发送和接收消息。

在设计和实现交互应用程序的时候,最大的一个难题是,系统怎样看待来自用户的消息,以及用户怎样看待来自系统的消息。一个应用程序的交互自由度越大,允许用户和系统执行的任务越多,消息越复杂,则越容易引起其中一方对消息的误读和不解。当消息无法被理解,就不仅要通知发出消息的一方“消息未被理解”,还要让它知道怎样解决这个问题。如果我听不懂对方的话,我就会让他再重复一遍。如果我点击了一个不存在的页面链接,服务器就会显示一个错误信息页,告诉我“此网页不存在”。双方的自由度越大,出错率越高,计划外的消息越多,就越需要告知其中一方,另一方理解了什么,是怎样理解的。

想象一下两个成年人之间的对话。在成功对话之前,他们经历了多年的“用户培训”——学习语言、行为、价值观等。丰富多彩的对话正是建立在这样的基础上。培训用户,让用户知道系统能理解什么消息,系统发出的消息又是什么意思非常讲究技巧。常见的数据网格是比较容易让人理解的方法,大部分电脑用户都熟悉数据网格的概念,知道什么能做,什么不能做,懂得从中选取他们需要的东西,大概看得懂错误消息的意思并明白怎样运用。如果你要用新型的控制方法或者界面,就必须给用户提供学习的途径,让他们去了解你的系统是怎样运行和怎样使用的。

交互系统的丰富性和实现它的难度是密切相关的:交互越是丰富,越是容易出错。所以设计师会花很多的时间和精力,试图建立“可预期体验”,这种交互体验来自用户的其他知识领域或交互经验,或者可用于用户的其他知识领域或交互经验。设计界流行的“最小惊讶原则”正说明了应该优先选用熟悉的交互方式,因为相对于全新的交互方式,这种方式用户的学习曲线要平滑得多。用户需要很长的时间来学习系统如何反馈,如何根据反馈作出调整。

界面与交互

消息(如文本提示)是系统反馈的重要部分,而界面也是交互通信中不可或缺的,它是交互双方之间沟通的桥梁。界面可以是屏幕、控制面板、互动墙,或者只是一个麦克风和一对音箱。用户和系统共享界面的资源以收发消息。界面设计本身就是一个很大的主题,但只要考虑到它对交互设计的意义,则也不是漫无边际的。

界面就是用户和系统之间沟通的媒介。这引发了一系列的话题和考虑,包括可能性、效率和风格等。我们平时跟别人讲话,不知不觉间已深受沟通媒介的影响,例如打电话和面谈,显然面谈的时候会使用更多的手势和面部表情等非语言方式,沟通起来更直接;打电话时则更多使用语调和语气。所使用的工具和方式直接影响到我们的做法和效果。富功能性、表达力和吸引力的界面对建立交互方式非常重要。一个具吸引力的界面让用户使用起来心情愉快,其中颜色、文本、对称、声音和图形都是至关重要的通信元素,直接影响系统在用户心目中的形象。这一点也不稀奇,大家都喜欢好看的东西。至于怎样让界面吸引人,则因情况而定,取决于你面向的用户以及用户需要达到的目的。除了好看,大家还喜欢好用的东西。界面的功能性影响到系统是否能很好地完成任务、用户是否能把系统使用得恰当自如。就算系统可看作在黑盒中运行,仍然需要一个功能化的界面告诉用户他输入的消息起到什么作用以及其他的反馈。

必须指出的是,交互远不止是使用界面。以最常见的人机交互——用手机打电话——作为例子,我们很容易会简单地认为这是用户和物件之间的交互。你拨号,就能找到电话另一头的某位;有人找你的时候,你的手机就会响;对谈的时候,手机在收发声音。这个简单的交互过程之所以重要,并不是因为它是人和物件之间的交互,而是因为交互发生的语境:你可以在几乎任何地方打电话。在手机出现之前,打电话需要电话线;而现在,一部手机在手,你只需要一个号码(电话账户)。就算人不在家也不在办公室,也依然可以联系到。在手机刚一出现的时候,用户就已经知道怎样打电话和接电话,因为用户界面的总体形态早就确定了,与以前打座机没太大区别。真正具创新性的用户界面,其实是很难被接受的,通常需要大量工程方面的考虑和工作,以确保界面正确运作;除此之外,还需要大量的用户培训和再培训。多年来,用户界面方面革新性的创造屈指可数:键盘的发明、Doug Engelbart的鼠标(我们今天所用鼠标的原型)、Ivan Sutherland的绘图板、桌面图形用户界面(Graphical User Interface, GUI),以及现在兴起的电容式触摸屏。以上这些都体现着技术的进步和工程的力量,它们改进甚至改变了人们使用电脑的方式。革新性的界面不仅会塑造一种工具的样子,更重要的是重新定义使用一种工具的可能性。

交互语言

任何一种交互都需要一套相应的词汇。例如,你要用鼠标把桌面上的某个文件删除,你会说“选中该文件,然后把它拖到回收站”。事实上,对你这个动作,系统并不是完全如你这般理解,但没关系。重要的是你明白你可以做什么动作,而对于同一个动作,系统有相同的理解,并作出你所预期的响应。建立一个有意义、有效和有结果的交互,就像创造一种语言或代码,需要交互双方对符号的意思和动作指令的意义有一致的协议。而同一个符号或动作,在不同类型的界面和交互中, 含义会相差很大。

各式各样的交互种类繁多,本书将会探讨其中某些类型,但不要把以下内容当作分类清单。人和电脑之间的交互遍布我们生活和工作的方方面面,丰富的种类之间,关系千丝万缕,就算只提及最常见、最普通的几种,也不可能将它们毫无重叠地严格分类。

物理(实物)操作

这是电子类和多功能人机交互中最早出现的交互界面。汽车和收音机是最早的两个具备多种界面元素的常见机器,而在它们出现之前,机器一般都只有一个开关、一个功能。用户的注意力一次只会集中在一个任务上。收音机和汽车的出现带来新的挑战,这些机器由非专业人士操作,并且这种操作不是单一的。对于汽车,操作包括常规的速度和方向以及突发的其他任务。它的界面应该是一个操纵装置,有时它对应着一种状态,而这种状态可通过拉动开关或按下按钮来激发;有时它对应着一种范围,这个范围可通过转动旋钮或推动滑块来设置。界面不仅让用户设置参数的值,还通过标识滑块、旋钮、仪表盘和开关,让用户确认这些值。仪表盘、示波器和其他反馈功能的界面元素,让用户迅速修改信息而无须去碰及他们正在操作的实物。这就需要让用户在操作控件的同时,可以监控多种信息。对控件的物理操作是交互方式中最重要、最有趣的一种。

代码输入

在计算时代开始之初,典型的交互场景就是用户坐在一个终端前面,输入代码指令,计算机运行,显示器以文本方式输出结果。这就是驱动式交互,即用一套预设的可识别的系统指令去操作机器。用户需要了解这套指令,或者起码能自如地在如此简陋的界面上寻求帮助信息。键盘当然不仅仅用来敲指令,不要忘了还有快捷键。例如,深受广大程序员喜爱的撤销组合键Ctrl+Z,普遍出现在各种应用软件中,包括文档编辑软件、图片处理软件和浏览器。 快捷键其实和命令行没区别,但它能让用户在不分心的情况下,轻易快捷地执行或重复一个操作。

鼠标操作

这是目前最常用的人机交互方式,常见的应用和软件界面都是按鼠标交互来设计的。鼠标交互的语言已被广大设计师和用户所熟悉,包括拖放、双击,以及单击保持。在不同的应用中,鼠标交互语言的意思不尽相同,也没有严格的标准将它们规范和固定下来。就算在同一个应用中,一种特定的操控方式也可能同时具备不同的意思,用户需要通过应用给出的反馈去学习在不同场景下的意思。

出现、位置和图像

利用参与者或用户的出现和退场,是一种简单又直观的交互方式。可以通过检测重量、运动、光、热或声音来判断用户的进入和退出,通常用作开关,启动或结束一段进程。这虽然很简单,但却是交互中强大的基础:把用户亲身请进来,把人物的出现、位置和图像信息利用起来。最简单的例子就是自动门,人靠近的时候自动打开。另一个例子就是Theo Watson的作品Audio Space。进入作品的观者头上戴着一套包括耳机和麦克风的装置,在某点录下自己的声音,留给下一位走到同样位置的人去听;而当前这位观者也能听到之前的人在这一点留下的声音。这让人感觉到每一段声音信号都是从它被记录下来的那个位置发出的。我们可以把人的身体看作一个开关,或者是一个图像——我们可以把它拍摄下来分析而获取有用的信息。这个关于身体“化身”的话题能引申出大量丰富迷人的交互方式,我们把这类交互手段称为“计算机视觉”——摄像头捡拾图像作为输入,像素化并分析。本书稍后会讨论如何使用计算机视觉技术来检测运动甚至识别图像中人脸的位置。

触感界面与多点触控

这本书还在写的时候,就已经出现了苹果iPhone手机和微软Surface平板电脑等使用多点触控界面的设备。这些产品日新月异,我和编辑们都感到本书内容难以追赶上技术前沿。不过,这种使用手势界面的交互,其设计的基本理念和构建的基础方法是不会变的。关键在于弄清楚使用过这类产品的用户习惯什么手势,例如用开合两个手指去拉大或者聚拢,转动两个指头去旋转,通过手指的轻敲选中对象。事实上,手势不仅仅用于软件应用,在机场洗手间,我们挥动手掌让自动水龙头出水,让厕纸架出纸,让干手机出风。我们把这套手势语言用在交互中,使得交互变得像普通语言一样自然,同时又像图标或电子游戏中的按钮一样语义明确。

手势

手势是一种引人入胜的交互模式,因为它和签名、书写和身体的物理性非常相关。它的强大之处在于让交互脱离了非直觉的键盘和鼠标。手势一般用于触摸屏界面、光标移动或书写工具中,以及绘图软件、简易导航、自适应技术或供儿童使用的应用中。这方面的前沿探索多不胜数,从手写识别系统和新型输入法(如Swype),到通过视频捕捉的手部动作识别系统。

人声和语音识别

人声识别是指经过计算机编程,识别出特定词语或短语,并据此执行相应的任务的过程。指令可以简单到只是把人声当作开关来触发一些事件,也可以复杂到识别出不同的词语和命令。按既定的声音模式,计算机逐个识别出词语或指令,然后把它们连在一起,和模式库中的数据作比对,从而判断出是什么命令。而语音识别则是更高级的主题,其过程和简单的指令识别引擎类似,但使用更庞大的数据库和更强大的工具去判别输入的信息。当然,人声不仅包含语音信息,它的音量、声调、发声时长等参量都可以用于交互。

以上简短地列出了交互设计中的热门话题。本书有限的篇幅不足以涵盖交互设计的方方面面,但你能了解到支撑这一切的基础,获取进一步学习所需的相关信息,并应用于你的设计工作中。

访谈:Matt Cottam

Matt是Tellart公司的CEO和联合创始人,活跃于学术界和设计界,他经常参与国际会议并发言,为企业带来丰富的启发和正确的指引。自1999年开始,他在罗德岛设计学院以工作室形式授课,涵盖从极端环境下的设计到物理计算的广泛内容。Matt也是瑞典于默奥设计学院(UID)的客座教授,并在多所高校担任访问教师,包括丹麦哥本哈根交互设计学院(CIID)、挪威奥斯陆建筑与设计学院(AHO)和中国中央美术学院(CAFA)。

硬件草稿的意义何在?

Matt:20世纪90年代初,我刚去罗德岛设计学院读书。那时只有医生能用得上车载电话,而那电话跟鞋盒子差不多大。当时的网络就像一个带显示器的可在其上点击的传真机。五年后我毕业时,学弟学妹们已经全都有手机,每个人都有好几个电子邮箱,浏览器里也已经是丰富的彩色画面、动画和声音了。在当时已经很明显,势不可挡的数码产品和网络技术一定会改变我们使用、感知和设计产品的方式。

在过去五年里,我们做了一些尝试。我们制作了一些看起来像是数码产品的木块和泡沫块;用乙酸粘合打印组件,把屏幕上的内容呈现为实物模型;和学生一起玩角色扮演,去体验和探索交互系统中的行为。这些尝试效果都不错,但毕竟我们以往所受的是传统手工艺训练,我们还是遗漏了一些重要的问题。你要设计一把椅子,一般可以到一个作坊里动动手,切割、塑型、组合不同的材料:钢铁、铝、皮革、夹板、塑料、软木、泡沫;管子、棒条、薄板、树脂。你也可以尝试某种工具(如点焊机、热成型机)的功能和性能,看看它们是怎么燃烧、熔化和拉伸材料的,想想怎样发挥它们的最佳性能。你还可以把特定的工具用在特定的材料上,获得极尽其材料特性的尺寸和形状。你将会创造出一种和谐的形式,因为它来自材料特性和制作方法的独一无二的结合。

我读书的那个年代,设计师没法轻松直接地在软件和电子工具上画草图,真实产品形态无法用软件表达出来。不像一把椅子,你可以坐上去感受到它,而软件和电子工具无法提供真实的体验。

1999年我们创立了Tellart。工作室里,工业设计师、平面设计师、电子工程师和软件工程师紧密合作,能够迅速草拟出一个和真实产品交互的方案。我们一直活跃在“硬件草稿”和“物理计算”社区,在和学生及客户的合作中,开发了不少硬件和软件工具。到目前,就算没上千也有上百个这样的工具把设计和工程结合起来。而连接设计和工程正是本书要教给大家的。现在Tellart不仅拥有图形界面和触感界面这一类工具和平台,我们还提供内容和服务的全套方案。

你是怎样发现一些关系和课题值得尝试和研究的?或者说,假设你已经发现了一些关系,你怎么把关系中的各个方面最优地结合起来?在你的设计实践里,这种探索是怎样的一个过程?

Matt:前几天我收到一封信,告之我在罗德岛设计学院教了12年的书。此外我还在乌默奥设计学院教了6年,在哥本哈根设计学院教了3年。在Tellart公司里,几乎每个人每年都在学校里教点课。我们在中国大陆和中国台湾也开设有课程。我经常被问到怎么在学校和公司之间安排好时间。其实很简单,学校和公司是共生的。学生们求知和创造的劲头都很足,我们和学生一起在工作室的台锯上开工,在应用程序界面上开发,不断地去了解现在的设计师有什么需求,了解他们理想中的工作环境和条件是怎样的。我们开发了一套全新的并一直演进的硬件和软件工具包Sketchtools,拿它给学生们测试和试用。学生们体验到新的实验性的工作方式,而我们则能看到Sketchtools在这些聪明人手里会有怎样的可能性。我们把这些都记录下来,带到国际会议上分享,带到客户面前展示。现在我们整个团队几乎都是由以前合作过的学生组成的。我们在学校里的工作并不能称为“研究”,因为那些都不算是学术或概念上的探索,但却非常富有策略性。

对于日常的设计工作,哪一种工具你觉得是最有影响力和最有用的呢?

Matt:在Tellart工作以及跟学生合作的时候,最美妙的事情就是使用不同的硬件和软件,像是在用不同颜色作画一样。想只用一种工具来做事,基本是不可能的。琢磨怎样把好几种工具结合起来使用,是最费脑子也是最容易出新点子的。

开源对你来讲有何意义?在你的实践中,分享和交流起到多大的作用?

Matt:我们的Sketchtools工具一直开源,并且会继续下去。我们跟一起合作的学生有个协议:你与我完全分享,我也对你毫无保留。我们在课上交流所有的观点,我们的工具包开放给任何时候参与进来的任何人。我发现,想要独自占有某些知识并且想独占鳌头的时候,会出问题,并且很快就落后于人;乐于分享的人都明白这一点。我并不真正想看到什么惊世巨作,倒是希望学生每天都有新的思考,再微小的想法都好,而不是一辈子只发一次光。当然,对客户需要遵守商业上的机密原则,这就是另一种做事方式了。开源和商业机密是平行的、互不相扰的,甚至有时还是共同促进的。

你怎样把纸上的或者视频里的概念变成一个真实的物理原型?如果可以继续这样想,你又是怎样把物理原型变成电子原型(至少带一些活动元素的那种)的?

Matt:这样说有点简单化了,但我们的确有越来越多软硬件工具,这些工具设计师使用起来并不比操作铣床或热成型机难。我们的工作台上经常堆满了Arduino、传感器、电机、铅笔稿、塑料、假毛皮,还有粘土。在教课和面对客户的时候,我发现“原型”这个词的定义有点问题:它是一个可以马上拿去制作加工的确定的模型呢,还是一个开发中的草稿模型?我们倾向于使用后一种定义,原型可以是各种阶段的草稿模型。如果说概念要使用草稿模型来开发,那我觉得铅笔、电子元件、软件和物理模型都可以用,并且是同时用到——这是试验台,设计师在上面把概念做出来(在此过程中还有不断的新发现),而不仅仅是把既定的东西搭建出来。

对于初学者,你认为什么技能是最有帮助的?

Matt:画图和拍片子。你可以说我守旧,但我坚持认为任何一个称职的专业设计师必须能画。并不是要求你画出多精美的肖像,我的意思是有能力把想法呈现在纸上,让别人明白。想得再远一些,现在软件和服务越来越抽象,数据和信息越来越无形,网络越来越复杂,所以在团队工作中,设计师如果想比较顺利地与不同领域(市场、商业巨头、制造业和技术)的人交流,那么即兴画图能力就异常重要了。交互设计师需要意识到他的产品和服务要给用户长期使用和多方面的体验,所以构建一套用于表达信息变化和交换的可视化词汇(例如故事板)是非常重要的。一位交互设计师,如果擅长画图,能搭建包括电子和软件部分的中低仿真度的草稿模型,同时还能拍拍片子,用来向别人讲解他所开发的东西在文化上和经济上是如何相关的,就差不多了。

可以略微介绍一下NADA项目吗?

Matt:NADA是Tellart的第一套工具包,最早在2001年发布,项目负责人是Brian Hinch。这个工具包让设计师比较容易地使用上Arduino的各种前身(如Teleo和Phidgets)和多种MIDI设备,并且把它们和Flash相连。2002年的时候,设计专业的学生只花了几个礼拜,就把RFID(Radio Frequency Identification Devices, 无线射频识别设备)和网页连接,并且把网络跟光和电机连上。这些工具在现在看起来没什么,但在当时对我们和学生来说帮助都很大。

只要做过网页项目的,都会对Flash比较了解。有无数的书、在线教程和课程教设计师用Flash。

Flash,特别是NADA出现时的Flash v4,可以说就是一个图形编辑环境,例如可以用它来画一个蓝色正方形,单击的时候点亮灯泡等。对设计师来讲,这比写HTML(Hypertext Markup Language,超文本标记语言)直观形象多了,在HTML里处理图还要引用目录下的图像文件。

不少学校已经把Flash相关软件纳入年度采购计划里(当过老师的都知道,一般买一套软件要申请好长时间)。

NADA使用Java写的服务器。在我们早期的交互文件里,教程是用Java和Flash做的,这促进了工程师和设计师的合作。

文件里含有一些代码,但更重要的部分是可视化设备诊断界面,可以检测接入了哪个设备,读取所有模拟输入和PWM(Pulse Width Modulation,脉冲宽度调制)输出的数值。把这些数据全都记录下来很简单,但大部分使用NADA的设计师一直开着这个窗口做实时数据跟踪。这个界面还带了个互动式的电阻计算器,你可以从传感器的输出直接观察和调整效果。

我们在众多的客户和教学项目里使用NADA。大部分情况下,NADA用来做草图和原型,但也经常在最终的成品中应用。

NADA还有NADA Mobile,苹果应用和服务器相结合,使设计师仅用JavaScript、CSS(Cascading Style Sheet,层叠样式表)和我们定制的功能来开发iPhone/iPod应用。用NADA Mobile v2可以把Arduino和苹果设备对接,还可以把模拟传感器接到苹果设备上的耳机/麦克风插孔来控制应用,硬件捡拾数据变得非常简单。我们最近的课程也包括了相关的内容,例如怎样把苹果和安卓设备连到Arduino、ZigBee以及它们的组合上,教大家通过日常的移动设备应用软件来做设计草稿。

我们还开发了若干硬件工具包,这些都是Sketchtools系列的一部分。

NADA只是用来做这一类事情的一个工具,很多其他工具在这本书里也有介绍。Sketchtools的更新版本将更关注现有的硬件和软件工具的组合,而减小从草稿开始搭建的功能,并强调记录设计摘要,促进我们、我们的客户和学生去考虑目前的可能性。我们并不是要刻意制作一些特别先进的工具,只是恰巧身处一个美好的时代,人们的想法很多,但实现想法的方法还不够。现在有很多项目都在开发这些神奇的工具,很多朋友在参与。有了这些工具,我们就可以把更多的时间用于创造美妙的体验。

我对你教的那门“开关是什么”的课程很好奇,在这个入门课程里,学生要做一些不同的交互作业和项目。

Matt:2001年我在罗德岛设计学院教一门交互设计课程,我把它的内容简化了一下,难度降低了一点,就有了这一门“开关是什么”的课程。一个学期的工业设计课的容量是远远不够去把任何一个用户界面琢磨透的。所以这门课主要是探究一下技术方面的需求、用途和意义,而并不是技术本身。我让学生去金工、木工和造型车间,尽量多捡一些好玩的边角料。每人做20份作业,尝试各种方式将人的手势或者环境参量(光、风或者水流……)用作闭合电路中的“开关”。不一定是电子上的概念,例如可以用笔在纸上画两根线,把纸对折,两根线就连起来了。在这里,“电路”是把两个部件连起来的意思。就算到现在,学生上这门课之前对Arduino等技术已经很精通,仍然能在课程里获得很多创造力方面的激发。没有任何门槛和障碍,学生自如地摆弄他们找到的材料——一捆塑料线、羊毛带子、打孔铁皮什么的。我们鼓励学生去仔细观察材质和形态,考虑尺寸和分析成分。一份作业通常在24小时内完成从初步概念到评价的全过程,速度是很关键的因素。

“开关是什么”还有一个进阶课程,缘起是我们在学校的废品堆里挖回来一堆键盘。我们把键盘的微控制器改装成这种“开关”(这次真的有些电线了,但还是没有电池),然后在Flash里捕捉按键动作。理论上,一天的教学时间,加上零成本的材料,学生是能做出一些复杂的事情的,例如“打开门能播放网页上的视频,关上门视频也就停止了”。而这个用门来控制视频播放的作业是我最喜欢的。廉价材料最大的好处是,学生用起来就跟铅笔或者黏土一样放得开,不需要小心翼翼。这些能屈能伸的粗糙材料最能激发创意。

设计与交互

伟大的工业设计师Henry Dreyfuss把设计称为“对人的测量”,意思是,设计是理解和分析人类行为的绝佳途径。如何定义“设计”一词,这留给别人去想;而我则关注交互设计作为“创作一种工具或方法”的方面,我们使用这种工具或方法完成一些特定的事情。需要完成的事情越具体或特殊,所需的工具就越要精雕细刻,交互设计就越特定。交互关注的是“用工具做事”,可能换一种说法“如何用工具做事”会更清晰。其实“工具”本身就包含了方法,亦即解决“如何”的问题,而不是“什么”、“何时”或“为何”,从而有别于做事过程中的体验。任务的类型直接影响交互设计。只包含单一动作的单一任务,不会产生很多歧义,或者说,单一任务可以容忍更多的歧义也不至于崩溃。而复合动作多任务则容易产生歧义,并且很少的歧义就能使其崩溃。

交互设计过程复杂,涉及大量建模工作,包括确定系统如何工作,用户如何完成想做的事情,以及界面应如何安排以满足各种操作。以上这些构成了你的设计所在的语境,语境对你的决策非常重要。或许你想做一个非常直接干脆的交互,快捷清晰地给出用户期待的反应和结果。在大部分商业应用程序或其他任务型的应用程序中,有清晰的用语告知用户可以做些什么,整个交互不会偏离原意太远。知道可以期待什么、可以得到什么是一件很宜人的事,而一个宜人的交互能让应用软件或事情富有魅力。又或许你想做一些更好玩的东西,乐趣在于在使用过程中,发现和观察这个交互的变化。无论你想做什么,理解语境有益于你创造更好的系统和更佳的体验。

这里告诉你一个小秘密。一般来讲,用户喜欢把正在做的事情和自己过往熟悉的经验关联起来。人们有时会说“电脑在思考”,多少对计算机赋予了拟人化的理解。人各有所长,各有其想法和思维方式;同理,在交互设计中,比较重要的是怎样用各自的方式去理解对方的内部过程。话说回来,和一个系统进行交互并不是真的要去理解谁在想什么,但倒也是类似的认知过程。为了达到这种“可理解”的效果,交互设计师会给出提示帮助用户理解当前的状况。用户或者不需要或不应该知道确切的过程,但应该大概知道系统对他们输入的信息正在做什么处理。

艺术与交互

艺术中的交互已经被热烈讨论甚至争论了至少20年。在艺术作品中出现的交互一直在改变和扩大“艺术”和“交互”的定义。很多电脑游戏可看作艺术作品,也有很多艺术作品被看成工业设计,越来越多的作品是画廊和设计展两相宜。

我们不打算在这里讨论太多关于交互艺术、工业设计、交互设计和软件工程之间的差异。它们肯定有诸多不同,但也的确有着共同的目标:为用户创造事物和体验。尽管领域不同,但所使用的工具和处理手段是相通的,从草图到原型再到最终成品的工序也是类似的。你可以想象一个连续体,一端是为完成某个任务预设好的种种,另一端是难以预见的离经叛道,挑战着我们的观念,刺激着我们的神经,但可能不实用于日常生活。交互艺术领域里,艺术和设计之间的关系微妙游走于简单和复杂、实用和无用、指向和开放之间。哪一端比较吸引你,取决于你对交互的看法,但你该写的代码和应使用的硬件设计方法完全不受你的喜好和兴趣所影响。

做交互艺术和非交互艺术很不一样。绘画的对象是画本身,雕塑的对象是雕塑及其周围的空间,影像作品的对象是影像投影,而交互作品的真正对象是场景,即对象就是观者和系统之间的交互,而系统由艺术家创造。这个系统在技术上可以很复杂,也可以只用单一的技术元素,甚至什么技术都不用。本书讨论到的艺术家和作品很注重技术,这类艺术家经常被称为“新媒体艺术家”,他们所使用和开发的工具你将要学会怎样用。但别把新媒体艺术和交互艺术混为一谈,使用了编程但程序不交互的作品,即不具备与观者相互遭遇的场景,也不是交互作品。很多作品技术上很考究,也使用到本书提到的技术,但其实不是交互的。本书大部分内容所提及的艺术家研究交互性,他们创作的作品对用户的动作和行为产生反馈。

做交互艺术有一个挺有趣的矛盾,在这里,艺术经常变得实用和富有功能,但它的确还是艺术。你仍然能很大程度地控制它作为艺术作品的语境。用户可以从自己选择的位置去观看和体验一件作品,以一种与预设完全不同的方式接触和影响作品,作品有可能被改得面目全非。很多设计师从事行内所谓的“关键设计”,这类设计品不仅具有功能性,更具有启发性,让用户以一种突破常规界限的方式把作品更多地和艺术关联起来,而不仅仅是设计。已经很难清晰区分这是在设计一件物品还是在创造一次艺术体验,这些特点让交互成为艺术家关注的热点。交互为你开拓了一个新领域,从中你可获得极具表现力的体验和探索。

数据交换与探索

交互设备的任务、目标和实现其交互的方式都很重要。与之前提到的一样,下面的分类并不是一个交互作品分类的完整清单,只是列举了一些最常见主题,为本书后面的内容提纲挈领一下。

支持数据可视化

我们身处的社会越来越以信息为中心,每天都有大量的数据在处理,数据可视化就变得越来越重要了。结构良好的数据可视化是一种有力的工具,它不仅让用户理解独立的数据点,还让用户明白数据点之间的关系,检测数据模式,甚至重新配置数据,或将其置于新的语境中。数据可视化不是向用户单方面灌输信息,而是通过和用户对话的方式快速指出内容,提高用户处理和整合新信息的能力。

设计师兼作家的Frank van Ham 指出:“它们应该是大规模的协作……重点不是分析而是沟通……应该是可视化的并由终端用户驱动。”数据可视化的目标是为用户构建数据的视图或图景,让用户更好地理解数据。Ben Fry的作品通过美妙的图表,让观者更快、更充分地理解蕴藏在数据中的事物之间的关系。这是将美学考虑结合到认知与心理学研究所得到的结果。Jonathan Harris和Sep Kamvar在作品“I Want You to Want Me ”(http://iwantyoutowantme.org)中,检索在线数据,利用检索结果生成交互图像。尽管它仍属于数据可视化,比起通常出现在标准视图中的图形-对话交互,这件作品更富动态甚至有些异想天开,但它带来的是具有深度和饱含意义的数据解析和分析。

用户的交互过程实则是对数据的提炼、比对、挖掘或叙事。设计数据及其交互时,我们不仅要考虑呈现什么数据,而且要考虑用户是怎样解释数据的,他们想怎样使用数据并与之交互。当数据的视图及视图的呈现清晰地相关联,交互就变得容易得多。例如,数据和滤波器有清晰的视觉呈现,用户就能轻松明白是对什么数据滤波,知道怎样改变它。

组织任务

有些交互的有趣之处在于它们帮我们达成的事情。如何组织任务、行为和离散的事物是界面设计里必须考虑的重点。回顾机器和计算机的界面发展历史,你会发现界面在组织任务、应用、信息和动作方面的演进。当下无处不在的桌面模式,就是把人的自然认知能力(例如在一个空间里整理物件)和办公室人员熟悉的桌面工作方式综合起来。

交互设计中的一个挑战是如何高效地把工作区域和组织工具各安其所,解决传统的桌面环境的问题。计算无处不在,用户希望在多处使用程序和数据。考虑到现在的人们与环境发生交互的场景,在小尺寸屏幕上甚至没有屏幕的情况下建立交互,这个需求越来越显著。

一些值得探究的话题包括,利用例如多点触摸屏这样现成的新工具开发新型桌面环境,创造新工具让用户创制个性化的专属界面,构建数据可视化界面以及与可视化相关的应用。

此类交互应用更多地从实用性和功能性方面考虑,让用户完成任务、整合信息和保存信息。当然,这并不意味着它们要从功能上复制一个操作系统,事实上它们借鉴了操作系统中的交互词汇。这方面具颠覆性的例子有Adrian Ward的Auto-Illustrator(http://www.adward.com/wiki/ckfault/read/software.net)。

创造体验

不是所有的交互设计都基于传统的应用模式。交互之中一个最常见又最吸引人的模式是所谓的体验式交互,包括电脑游戏、互动绘画和炫目的图形展示等,没有指定的实际用途,有时仅仅是为了娱乐。这一类的交互经常在音频和图像之间建立新的联系,创造的场景甚至能娱乐用户,或者含有富娱乐性的交互。体验式交互在很多电脑游戏中相当常见,用户在游戏中扮演角色并且能从角色的视角看世界。这类游戏中的交互多是目标指向,指向游戏的下一关、杀敌或者加分。很多交互装置使用类似的模式,很好玩,但缺乏游戏中的目标指向特质,取而代之的是制造景观,或者让观者摆弄产生声画的引擎。这一类交互的目的通常就是单纯的娱乐和吸引眼球。

游戏和交互装置在使用时会不断地调用应用程序,而在此过程中,它们经常会在不同的视图、视角和模式之间快速切换。这一点对建筑漫游方面的应用同样适用,例如展示进入建筑物所看到的效果或者数据可视化。游戏风格的界面很常见,例如从第一人称视角观看三维世界,或者在用户自主控制之下观看二维世界。这里还涉及环境的生成,能响应用户的动作而生成,而当用户不活跃时,也可以独立生成。交互装置和其他趣味性较强而任务取向较弱的作品,有时还使用“倒媒体”,例如画出一个声音、用声音制作图像、把实际的物体变成虚拟,以上反之亦然。

促成用户间合作

艺术作品中的交互最不需要数据驱动也最不需要依托于一个虚拟的世界。它可以由多名用户的协同参与来实现。协同可以是非常直接的方式,就像大家在白板上写写画画,分享和讨论事情;也可以是难以预计的试验方式,其中一位用户的输入添加到其他用户的输入,而这样的动作是难以预测的。从可预测的协同的交互到不可预测的不协同的交互,这方面的话题非常丰富。而定位游戏则是另一种靠用户间合作驱动的交互式应用程序,游戏由用户的方位驱动。不少基于网络的应用程序也利用用户间合作来驱动交互。这一类系统促使用户间的通信,保证消息在用户之间的收发,而不是像单人游戏那样,系统自己产生消息和反馈给用户。

这一类应用程序可以使用基于聊天或出场的场景,我们可以在一些最近很流行的大型多人游戏看到这种场景;或者创造真实的场景和表现,为每位用户带来真实的体验。适当提示用户,让他们知道有多少用户一起参与,他们的举动如何影响环境和其他用户,交互就会变得更加吸引人。

控制机器

Tom Igoe是我喜欢的一位老师、作家和工程师,他曾写道:“计算机应该以任何物理形态存在以满足我们的计算需求。”计算不仅局限在计算机本身或传统的计算机界面(显示屏),事实上,交互设计和艺术作品有丰富得多的形态。利用Arduino,我们可以轻松地让计算机控制真实的机器。机器可以完成简单如开关电灯的任务,也可以做到复杂如控制机器人的事情。机器可由单人或多人控制;或者是可以接受反馈的,通过程序控制它对用户、观者或真实环境的响应。

对机器的控制有时是任务导向的,对每个用户的动作的响应和效果都有严格的规定;有时是趣味性的,例如用户协作应用。在趣味性强的应用程序里,对用户的控制可以非常宽松,即在摆弄装置的过程中,由用户自己去发现如何控制机器。而在任务导向的情况下,控制的标识和结构应十分明显和清晰。

用于表演

一个应用程序可用在表演中,协助演出或者加强演出效果。例如电吉他被改装为一个全新的复杂的音乐创作界面。作为表演或交互的方式,交互界面或工具由表演者或观众驱动。比较有趣的例如表演者和观众一起控制系统,当然,这需要一些用户培训以确保观众知道他们该做什么。与通常的舞台演出工具不同,这类交互工具不要求概念上的简单。它们让用户在演出中创造出新元素,实现远程控制,并让观众也成为表演者。

创造环境

建筑师们开始探索所谓的“反应式建筑”,把计算技术结合到建筑实践中,创造出的建筑物和环境能对用户、环境自身的内在因素以及外部的指令作出反应。这里,反馈系统的模型非常重要。环境通过传感器或计时器作自我监控,知道什么时候改变或保持状态。最简单的情况是,计时器通知房子开关灯,温度传感器用来维持温度,动作传感器可以检测对象的出现,湿度传感器控制抽湿机。如果使用更复杂的传感器和系统,你还可以跟踪空间里的运动,这时你可以在运动对象上加上标签,使用摄像头捕捉图像,使用麦克风捡拾声音和振动,或者还会用到无线电波。系统根据捕捉和捡拾回来的数据改变环境,例如让环境变得更舒适、声音更响或者其他适当的调整。很多建筑师和技术人员正从事着这样的空间和建筑设计,由用户通过指令设定空间的使用方式,或使空间自身更富交互性。这样的空间通常被称为“智能屋”或“使能建筑”,是建筑师和工程师的重要研究课题。计算技术不局限在室内空间,公园、步行径、广场或街道等户外空间,都可以被这些有趣的技术介入,使环境好玩、有益并能启发思维。要重点考虑的是,某个应用介入空间是否合适,用户如何参与或控制交互。这一点对公共空间尤其重要,因为空间中的每个人有可能参与交互。

讲述故事

用交互的方式讲故事或叙事是最近交互设计领域的一个有趣主题。借助数据可视化和游戏领域的技术,这一类作品通常依托于界面,让用户控制叙事的进展和方向。尽管借用了游戏和可视化里的概念,但由叙事带来的一系列挑战更多的是电影制片人和作者的话题,而不是工程方面的考虑。

工作流程

创作交互作品的实际工作流程是以下所列的各种组合。

概念

概念来自笔记本上的涂鸦、白日梦、商业客户调查所得的产品需求,或是这三方面的某种组合。你不妨描绘出尽可能多的细节,例如这个应用程序可以做什么,用户感受到的交互是怎样的,以及应用程序的目标是什么。所有的项目都需要研究和计划,你必须把调研考虑进来,但这些不应该成为你创作的绊脚石。在有清晰计划之前,不妨动手比划一下,这通常能给你带来好主意。但如果还没有详细方案就开始写代码,则通常做不出什么有用的东西。

研究

决定了你的应用程序该具有的外观和功能后,就要去找你需要的部件,看看有没有现成的库和代码可以用。如果你需要硬件,就要考虑一下预算,什么元件同时符合设计要求和预算。确定部件和工序的时候,到论坛问问题或请教同学、同事是必需的。大多数的作品同时需要几种不同的技术,而这些技术几乎都是现成的,有些你已经在过往的作品中用过,有些则可以从其他艺术家或开发者那里借鉴过来。这种工作方式在二十年前是不可想象的。

设计

很难说有“设计”这么一步,因为它经常混杂在研究、概念和搭建的步骤里。有时你不会有一个设计阶段,但有时所有的工作就只有设计,这取决于需求和你要做的东西的性质。但至少,你需要清楚地定义作品中所有的部分,对各部分的外观和响应方式都要心中有数,还要确切地知道用户的动作如何与系统的动作关联起来。不妨画图表示出一系列动作如何发生,系统又是如何响应。还可以对系统的每个部分画图,表示用户会看到的外观以及对它的动作,这些个别的部分如何与系统整体相关。你可能不想把所有的部分和细节都决定下来,但之前考虑得越多越细致,后面搭建系统就会越容易。

搭建

这是真枪真刀干活的阶段,你要把硬件搭起来并写代码。不断地编码和调试,可能还要再补充一些搜索和研究工作,直到最后把整个应用程序装配好。

测试

应用程序搭建好之后,就是重要的测试了。测试可以很复杂,例如邀请用户在你设定的场景和条件下使用你的应用程序,观察他们的使用状况;也可以很简单,简单到就是你自己用一用,确保一切正常就可以了。

测试之后,就是安装程序或是生成文件以供下载。如果你的作品是硬件,还可能要拿去制造,或者拿到展示的现场安装。在正式呈现和交付之前,必须保证一切正常运作,所以高质量的测试是很重要的。

现在你已经对本书的内容有了大概的了解,那就开始学习写代码吧。

参考资料