3.3　交互设计的8大策略支柱

下面将介绍的，就是交互设计师必须了解并且善加运用的8种交互设计策略，它们分别是：制约（constraint）、反馈（feedback）、关联对应（mapping）、能见度（visibility）、惯例（patterm）、一致性（consistency）、个性化（personalization）以及脆弱环节（weak link）。这8种策略能够预防错误、提升功用直觉、增加效率、缩短学习曲线，因此也可以说是交互设计的8大支柱。

3.3.1　制约

制约是一种防止使用者犯错的机制，它的另外一个说法，就是防呆装置。防呆是一种预防矫正的行为约束手段，运用避免产生错误的限制方法，让操作者不需要花费注意力，也不需要经验与专业知识即可准确无误完成正确的操作。广义来讲，防呆就是如何设计一个东西，而使错误发生的机会减至最低的程度。避免工作错误的发生，进而达到“第一次就把工作做对”之境界。

如图3.15所示，这款iF获奖作品“微笑钥匙”就通过防呆设计解决了关于钥匙的4大难题。自然的弧度，更加贴合拇指和食指，用着更舒服；更容易分辨钥匙的朝向—不用再去记忆哪面是正确的朝向，自然贴合拇指与食指的那面，便是正确的；钥匙平放的时候，因为这弧度，更容易被拿起来；钥匙上面有数目不等的凸起小颗粒，用于区分是哪儿的钥匙，比如说，1个小颗粒是办公室的，2个是自家大门的。这在晚上看不清的时候尤其方便，不用再一串钥匙挨个尝试了。

防呆设计经常使用感官替换的方式来进行设计。如图3.16所示，这款杯盖，

通过视觉替代触觉进行防呆。可以感应杯中液体的温度显示不同的颜色。通过视觉的警示提醒人们此时的饮品很是烫口，避免一时糊涂拿起就喝了。

“人非圣贤，孰能无过”，就算是再熟练的专家，也有失手或闪神的可能，因此制约机制的建立，是交互设计过程中非常重要的一项工作。我们还可以进一步细分，把制约分成强制性、极限性和保险性三种。

强制性的制约，完全不让使用者有任何犯错的可能，例如，计算机内存模块上有一个凹洞，借此确保只有正确的安装方向才能够将它插入记忆槽。数码照相机记忆卡上的切角也有相同的功能，让用户只能以正确的方向插入。许多的数字器材的接头和组件，都会有这种设计，但这并不是一个起始于数字时代的观念，旧式的录音带上也有防呆装置，只要把“预防再录孔”上的塑料片折断，就可以防止将录音带内容洗掉。如图3.17所示为USB防呆卡口设计。

极限性的制约，则是在系统超载之前，就用自动性的机关去制止系统继续运作。马桶水箱以浮球来侦测水量，在水漫出水箱之前会自动停止供水，这就是极限性制约的典型（图3.18）。这种机制在软件设计也很重要，在程序运算出现超载情况时，必须能够自动停止该程序的运作，以免造成系统性的“停摆”。

保险性制约的概念，则是刻意将操作程序复杂化，减少失误发生的可能性。例如，为了防止孩童不懂事吃错药，许多药品包装设计，会让盖子必须先向下压之后再用力旋转，才能够将盖子打开（图3.19）。为了防止孩童玩打火机，因此使用者必须先按下保险钮之后才能点火，也是同样的保护功能。枪支的保险锁、手榴弹的保险插销，都是这种形态的制约。将保险性制约概念运用在软件界面上，则是在执行关键或无法恢复的动作前，会先以对话窗口来提出警告，让使用者多经过一道确认的手续，之后系统才会开始执行。

谷歌邮箱（Gmail）有这样一个功能。为了防止用户在心情不好、精神不济或者酒过三巡之后，会不小心发出让自己在清醒之后悔不当初的电子邮件，Gmail让使用者可以选择开放“邮件防呆装置”，设定在按“传送”之后，马上会跳出一个询问“确定传送”的视窗。询问内容，是几则必须在60秒之内回答完毕的数学问题，透过这个缓冲程序，一方面可以确定使用者的头脑是清醒的；另一方面也让使用者借机好好想一下，这封信件到底该不该发出。这个防呆装置，就是有趣的软件制约范例。

3.3.2　反馈

另一个交互设计师常用的策略，就是让使用者在操作的过程中，每一个动作都得到适当的反馈反应。用户在按下按钮之后听到一个声响，发出邮件后得到一个确认信息，或者是将点选的档案用醒目的颜色凸显，这些都是常见的反馈机制。它的主要功能在于让用户肯定自己的动作已经产生了效果。如果按了一个选项之后没有得到任何反馈，用户将无法确定系统是否接收到指令，可能会让使用者连续再按几次，甚至因此而造成不必要的错误。

反馈对于软件接口设计特别重要，因为对于用户而言，软件系统的运作是完全隐形的，因此接口必须负责随时对用户提供信息。数字反馈反应设计的最高指导原则，就是反应的及时性。根据研究报告指出，对于使用者而言，在0.1秒以内得到的是实时反馈；若是在0.1～1秒内才得到反馈反应，会让用户感觉系统运作并不顺畅；如果在1秒以后还未得到反馈反应，使用者会认为运作可能已经受到干扰，并且开始臆测系统运作是否不正常；大多数的人，如果在10秒之后仍未等到任何反馈，会认为系统运作已经终止，并且开始尝试重新登入或开机等障碍排除。

在产品设计上，许多的反馈反应会自然发生，例如，开关发出的声响、键盘的触感甚至于东西拿起来的质感，等等。值得注意的是，这种反馈其实还带有暗示质量的功能。例如沃尔沃（VOLVO）的高级房车，连关车门时的声音和重量，都会传达出一种扎实和信赖感。因此，交互设计师一定要了解，反馈除了实际的功能之外，也是建构使用体验的重要一环。

另外一种反馈，则是向用户通报系统运作的进度。最常见的例子，就是在下载文件、安装软件或者执行复杂的运算功能时，电脑屏幕上经常会出现的进度条。还有一个常见的例子是地铁车厢内显示已运行站点的灯带。这种进度的反馈功能，在于让使用者确定系统是否运作正常，同时也会缩短使用者认知中的等待时间。根据相关研究报告显示，设计成功的进度条，能够有效地给使用者系统运作比较顺畅的错觉。而且尽管两者等待时间完全相同，过程中持续加速的进度条，会让使用者感知的进度比较快，反之，进度条如果在过程中出现明显停顿，使用者所感知的速度就会慢（图3.20、图3.21）。

无论你在设计怎样的产品，总会涉及“用户行为与反馈效应”这样的循环。

很多时候，良好而有效的“反馈循环（feedback loop）”是决定一款产品能否取得成功的重要因素。那么，怎样通过精心打造的反馈循环对用户行为产生影响呢？

“反馈循环”在我们的现实生活中是无处不在的，它可以揭示出人们是否做了正确的选择。一个人吃了不好吃的东西会觉得恶心难受，并在未来产生排斥行为；而吃了好吃的东西则会感到幸福香甜。

如果你善待他人，而对方也以同样的方式进行反馈，你就会觉得很开心；如果一个人损害自己的身体，身体就会出问题—我们的大脑似乎就是有一套这样的奖惩机制。

反馈循环由以下几个环节组成（图3.22）：

① 一个人发起行为；

② 该行为产生一个或多个效应；

③ 其中一些重要的效应会以某种方式反馈给行为发起人；

④ 行为发起人根据收到的反馈继续产生新的行为，规律地如此循环下去。

3.3.3　关联对应

关联对应的概念，就是要设法让操作方式与效果产生正确的联结。如果要将光标移到左边，使用者就必须将鼠标往左移动，这就是很直接而且正确的联结；但如果你故意把鼠标往右转90°，事实上你还是可以操作光标，但鼠标和光标之间的关联对应就会变得很奇怪，鼠标必须往上，光标才会向左移动，因此操作上就会变得很困难。Apple公司的圆形鼠标，因为正圆本身没有方向性，在握的时候不容易找到正确的角度，因此操作就会很困难。

另外一个常见的关联对应例子，就是以位置做联结。如图3.23所示，汽车驾驶座旁边的车窗控制按键，左前按钮控制驾驶座的窗户，右前的按钮控制副驾驶座的窗户，左后方的按钮控制驾驶座后方的窗户，右后方的按钮控制副驾驶座后方的窗户。如此一来，在前、后、左、右的位置上，就得到了合理的关联对应。如果四个按钮排成了一条直线和其所控制的窗户丧失了对应，就很容易造成使用时的错误和操作的困难。如图3.24所示，电梯按钮也是相同的道理，楼层愈高，按钮就排在愈上面，如果反过来把一楼排在上面而顶楼排在下面，这就会造成关联对应的混乱。

以上所提到的方向和位置的直接对应，是属于自然的关联对应（natural mapping）。另外一种，则是逻辑上的关联对应（logical mapping）。逻辑的关联对应，指的是一种逻辑上的合理转换，比如：高和大、低和小、重和多、轻和少之间，在逻辑上是合理的转换。所以把控制钮往上推的时候声音会变大或者灯光会变亮，这都是合理的联结，反之则违反了常人的逻辑习惯。

如图3.25所示，天猫电器城界面标示，在“综合”选项旁边有一个向下的箭头，在逻辑上，这个箭头代表什么意义呢？它是代表在哪方面上的排序由高到低呢？我们无法确定。这种不确定，就是逻辑关联对应策略错误所造成的混乱。如图3.26所示，国外的梅西购物网站的界面，会发现他们直接用文字标示出“Price：Low to High（价格：低至高）”或“Price：High to Low（价格：高至低）”，这种做法就避免了逻辑关联对应错误所造成的困扰。

错误的关联对应，并不会让产品无法使用，但一定会增加使用者的记忆负担和延长操作的学习曲线，这些都是交互设计必须避免的。因此，交互设计师必须非常细心，认真检视每一项关联对应的策略，让使用者能够毫无疑虑地凭直觉操作。

3.3.4　能见度

唐纳德·诺曼（Donald Arthur Norman）在1988年讨论“能见度”的时候指出：功能愈明显，用户就愈容易知道下一步该怎么做。对功能简单的软硬件而言，这很简单，只要把所有按钮都清楚地放在使用者能够一目了然的位置即可。而为功能复杂的系统设计互动，能见度就成了一门高深的学问。因为，如果让所有功能的操控都出现在接口的表层，那为数众多的各种按钮和选项，反而增加了使用上的困难度。

在设计复杂的软件接口时最常见的争议，就是浅宽信息架构与窄深架构的可用性比较。浅宽式的信息架构就是一次看到的选项数量很多，但减少了层级的分隔；窄深式信息架构就是每次看到的选项数量比较少，但却分为很多个层级。一般而言，浅宽式信息架构比较容易使用，因为人类辨认的能力很强，因此很快就能够找到需要的项目；窄深式的架构则会强迫使用者不断做选择，因此可能会花较多的时间。

如图3.27所示专业录音室的控制台将所有的控制键展开在表面，是典型的浅宽式信息架构。如图3.28所示购物网站一般为窄深式信息架构。

Microsoft公司在1998年曾经做实验比较三种信息架构：架构一，8个主选项，每项各有8个副选项，每个副选项各有8个内容物（8×8×8=512）。架构

二，16个主选项，每项有32个内容物（16×32=512）。架构三，32个主选项，每项各有16个内容物（32×16=512）。实验结果发现，架构二比架构三有效率，而架构一则是最没有效率的一种。信息架构的宽度与深度均衡，还应该要考虑内容形态与视觉策略规划。以乔许·贺恩（Josh Hearn）所设计纽约指南网站为例，它虽然是标准的窄深式架构，但选项展开时的视觉变换饶富趣味，而且能够正确地将用户导向需要的页面，因此使用经验上是优美的。

唐纳德·诺曼是单纯地从可用的角度来讨论，因此我们如果从设计策略的角度来讨论能见度，还必须注意的是：使用者在每一个阶段最有可能需要的下一个功能是什么，并且让那些功能适时浮出台面。亚伦·库伯将这种手法称为：顺应使用者需求去变化你的接口（inflect your interface to match user needs）。亚伦·库伯还进一步表示，能见度编排的考虑依据为：使用频率、变化度以及危险度。使用频率高的功能，当然要放在明显的位置。会对接口、内容信息和整体运作造成全面更新或调整的功能，则可以放在比较深的位置，因为这种功能需要时间执行，如果使用者因为不小心按到，而造成不断来回切换，容易造成系统运作上的错误。风险比较高的功能，例如将硬盘重新规格化或是清除记忆体等。这种具有高危险性的功能，也应该放在接口系统的深处，以免误按造成不可挽回的后果。

3.3.5　惯例

有一句谚语：You don't have to reinvent the wheel（你不用重新发明轮胎），意思就是既然已经有人发明了轮胎，你需要这个工具时，就不需要浪费时间和精力重新再发明一次。对于惯例的认识与运用，具有相同的意义。惯例可以从以下两个方向来节省时间增加可用性。

① 从目前市面上类似的产品或接口设计中去芜存菁、找出惯例，能够让设计团队快速地架构出一个设计方针。

② 惯例的运用，让使用者在第一次接触这个设计时，可以倚赖他们过去使用类似产品的经验，不用重新摸索，因此可以缩短学习曲线。

大多数的惯例都有其来由，例如，许多网站都会把按钮设计成具有立体感的图样，这是网络设计常见的简单惯例。而这个惯例的起源，则是因为有立体感的图像，会让用户想起家电用品上的按钮，所以它的功用直觉就很明显。如图3.29所示，许多网站都会把公司商标放在左上角，这也是网站设计的一个常见惯例，而它的来由，则是因为左上角的图标，最不容易因为窗口改变大小而被切掉，而且，大多数人的阅读习惯由左至右，所以左上角是最有效的宣示位置。

遥控器选台按钮往上按会跳到数字高的台，往下按会跳到数字低的台；音量控制旋钮往右拨声音会变大，往左拨声音会变小；往右的箭头代表放音，两条直杠代表暂停（图3.30），正方形代表停止。这些都是交互设计中的常见惯例，如果改变它或者是逆势而行，就有可能增加使用上的困难。因此，在与利害相关人面谈之后，研究流程里的下一个步骤，就是竞争产品稽核（competitive product audits）。从这个过程里面，除了要找出市面上现有产品设计上的优缺点之外，也要列举出一些常见的惯例。

但是惯例这个设计策略，可以说是一把“双刃刀”。它的坏处，在于如果你完全依循惯例，这个设计本身就很难有独特性。因此运用惯例策略的重点，在于将它分成以下三个步骤：

① 找出惯例；

② 分析形成惯例的原因；

③ 寻找改进的可能性和合理运用这些惯例的方法。也就是不要一股脑地照单全收，而是要用智慧将既有的惯例提升到另一个层次。

要记住，站在巨人的肩膀上，才可以比巨人看得更远。绝大多数的时候，认识惯例之后将它升华，比从头做起来得更有效率。

3.3.6　一致性

一个国家或机关，最怕的就是朝令夕改，因为这样会让大家无所适从。同样的，在交互设计中，最怕的就是整体设计没有一致性。这样的做法，会让使用者产生混淆。例如，在同一个网站架构之内，字体、用色、构图、文字撰述的态度甚至于照片的形态和风格，都必须有一致性。这个策略有以下三个好处：

（1）能够快速地建立一个明确的用户心智模式

用户心智模式，就是用户对于系统功能和使用方式的认知。这种心智模式的建立，能够让使用者将精神集中在内容或其他需要注意的事项，而不是一直尝试去了解和学习新的互动规则。例如，如果在首页中红色的字是超链接，而黑色的字是内文，在子页面中，这个规则就应该要一直延续下去。如果每一页都有不同的规划，那使用者每一次进入新的页面都必须重新学习，因此大量增加了理解性工作和记忆性工作。

（2）能够快速地建立产品或公司的形象

以统一的设计策略来强化使用者对于公司或产品的印象，这个就是品牌营销的概念。这种一致性，还可以延伸到串联同一个公司的不同产品和服务。例如Adobe公司的软件，不仅在视觉辨认系统上有一致性，而且在操作接口配置上，也运用了相同的逻辑和规则。这种整体性的串联，能够建立专业的气势和风格。

如图3.31所示是谷歌产品的包装设计，一份完整的系列产品，采用了谷歌的颜色调色板，是所有客户都希望拥有的收藏品，产品使用了一种独特的艺术形式、松散的插图，给人一种清新的感觉，从而获得更多的关注。

（3）能够突显重点

许多人误以为，改变能够突显每一个视觉元素的独特性。事实正好相反，一致性，其实才是突显重点的第一要件。如图3.32所示，平面上每一个元素都不一样，结果所造成的是一种混沌的平面效果，因为所有的不一样相互抵消，反而丧失了聚焦的功能。如图3.33所示，在一致性中突然出现一个特例，它马上会成为视觉的焦点。这个技巧，被称为是“智能性的不规则”（intelligentinconsistency）。

3.3.7　个性化

在讨论优秀交互设计的标准时，资深交互设计师劳拉莉·艾尔本（Lauralee Alben）曾经提出一个称为可变性（mutability）的概念。艾尔本认为，设计师应该要针对将来可能的改变，预留了适当程度的延展性，以及容许使用者用超出预期的方式与产品互动。在科技快速变迁的时代，延展性其实并没有那么重要，因为一个数字系统或产品，在市面上的寿命大多不超过五年。因此，和可变性概念相似但比它更重要的，就是个性化的概念。

个性化这个设计策略，能够让使用者依据自己的需求，来调整互动产品的功能和操作方式。对于初学者而言，个性化并没有特别的意义，因为他们还在摸索的阶段，因此无法有效地理解应该如何运用个性化来提升使用经验。但个性化对于经常使用产品的中级使用者以及专业使用者来说，却是一项非常重要的功能。因为专业使用者喜欢掌控，因此个性化的设定能够让他们得到所需要的操控感。这也就是为什么绝大多数的软件，都会有参数设定（preference setting）这一项功能的主因。

对于经常使用产品的中级用户而言，因为他们知道自己常用的功能或需求是什么，因此个性化的设计策略会让他们的操作更顺畅。如图3.34所示以英国BBC天气网站为例，允许使用者依照个人需要和爱好来添加、来安排版面，这就跳脱了传统用一份设计满足百样人的缺陷，允许科技以更人性、更自我的方式，来服务每一个使用者。

Android和iPhone手机平台的成功，也必须归功于个性化这个设计策略。苹果著名的App Store（苹果应用商店），让使用者可以下载各种不同的软件，以符合自己需要的方式来运用到智能手机上（图3.35）。

3.3.8　脆弱环节

脆弱环节的概念，就是在系统架构中刻意留下一个弱点，因此在意外状况不幸发生的时候，这个环节会首先故障或损坏，借此保护系统的其他重要部分。旧式电箱中的保险丝，就是一个脆弱环节机制的典型，在电力超载的时候，不耐高温的保险丝就会首先烧断，因而终止继续供电，避免酿成火灾。现代的汽车结构设计中也有类似的机制，在车祸撞击发生的同时，引擎下方的脆弱环节会让引擎往下掉，避免沉重的机件往后方推挤，造成驾驶者的伤亡。整体而言，脆弱环节这个设计策略的终极目标，就是以牺牲脆弱环节来保障使用者的安全。