1.1 什么是交互设计
1.1.1 交互设计的起源
1982年,IDEO的创始人之一比尔·莫格里奇(Bill Moggridge)主导设计了世界上首款现代笔记本电脑GRiD Compass,如下图所示。
比尔·莫格里奇和他设计的笔记本电脑
在使用GRiD Compass第一台样机的时候,莫格里奇形容自己被“机器吸进去了”,因此他开始寻找人与设备之间的互动关系。在1984年的一次会议上,莫格里奇为自己的设计工作创造了“交互设计”(Iteraction Design,IxD或IaD)一词。这个看起来有点奇怪的缩写,是为了跟ID(Industrial Design)区别开,用“x”表示Interaction的“action”音。但交互设计这个词真正开始流行是在10年后,伴随着《About Face:交互设计精髓》第1版的出版,交互设计荒漠开始涌现生机。
1.1.2 交互设计的定义
交互设计作为一门新兴学科,从人机交互/人机工程学脱离出来后,又融合了认知心理学、行为学、视觉设计、社会学等多门学科,成为设计学中的一个分支学科,如下图所示。
交互设计的相关学科
关于交互设计的定义,网上有很多种,这里收集了几种比较权威的,给大家参考。
2005年9月成立的交互设计协会IxDA,对交互设计的定义是:
Interaction Design (IxD) defines the structure and behavior of interactive systems. Interaction Designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond.
翻译一下:
交互设计,定义的是交互系统的结构和行为。
交互设计师致力于在人们及他们所使用的产品及服务之间建立有意义的联系(产品包括计算机、移动设备和电器等)。
2012年李世国教授出版的《交互设计》一书中的定义与此类似。
交互设计是定义、设计人造系统的行为的设计领域。它定义了两个或多个互动的个体之间交流的内容和结构,使之互相配合,共同达成某种目的。交互设计师努力去创造和建立人与产品及服务之间有意义的关系。
在About Face 4中Alan Cooper也强调,交互设计的重点是行为设计。
辛向阳老师作为国内交互设计的带头人,他在《交互设计:从物理逻辑到行为逻辑》论文中也强调“交互设计是对行为的设计,直接把人类的行为作为设计对象”。
为什么要给大家引用这么多交互设计的定义呢?
一是因为交互设计作为新兴学科,一直处于发展变化之中,并没有统一的定义。
二是想通过不同的定义,让大家去感受和总结交互设计的本质:交互设计表面上是在设计产品的结构和内容,本质上是在设计用户的行为,最终是为了创建人与产品/服务之间有意义的联系。
为了方便大家理解和记忆,我总结交互设计的定义如下:
交互设计是一种设计方法,它通过对产品结构和内容的设计,使其能够顺应和引导用户行为,最终满足用户需求并达成业务目标。
1.1.3 交互设计的5要素
学习交互设计,我会推荐大家从辛向阳老师拆解的交互设计5要素着手,去了解每个要素对交互设计的影响,如下图所示。
交互设计5要素
为了方便大家理解和记忆,我把辛向阳老师的交互5要素用一句话来表达:
“用户”在某个“场景”下,借助某些“媒介”,通过某些“行为”达成最终“目标”
并对交互设计5要素之间的关系进行整理,如下图所示。
交互设计5要素的关系
不同用户有不同目标,不同目标反过来又会改变用户的态度和行为。
用户可以通过自身行为改变场景,场景改变后反过来也会影响用户的态度和行为。
不同用户有不同的行为模式,不同的行为反馈反过来也会改变用户的态度和行为。
不同媒介会塑造用户不同的行为,不同的行为施加在媒介上会产生不同的结果。
这些关系看起来有点绕,核心就一点:交互设计5要素是互相影响的,初学时可以拆开来理解,但在真正设计时需要全盘来考虑。下面我们通过具体案例来理解。
要素1:用户
交互设计本质是对人行为的设计。不同类型(性别、年龄、职业、地域等)的用户,其需求和偏好可能是截然不同的。那么设计用户的行为前,我们首先要了解“用户是谁”,他们在态度和行为模式上有何差异,然后才可能针对不同类型的用户提供合适的设计。比如针对不同年龄的用户,我们会有经典(默认)模式、青少年模式、长辈关怀模式;针对不同性别的用户,我们有男生频道、女生频道,如下图所示。
用户对设计的影响
针对不同岗位角色,我们会有员工模式、管理员模式。
针对不同经验,我们会有新手模式、专家模式。
针对不同目标用户群,我们会有经典模式、极简模式和自定义模式。
……
所以在进行交互设计之前,需要先了解目标用户是谁?他们有哪些典型特征?用户画像是怎样的?他们的目标是什么?只有了解了目标用户及其需求之后才能够展开交互设计。
要素2:目标
交互设计是目标导向的设计,设计过程中要始终围绕用户目标和业务目标。牢记产品只是媒介,不是目标。明确用户使用我们产品的目标,才能有目标导向,设计出合理的信息架构和行为路径。
以vivo浏览器为例,有些用户使用浏览器只是为了搜索,新闻资讯对他们来说就是一种干扰。所以我们会在经典模式的基础上,设计极简模式,减少用户干扰。同时提供历史记录和搜索联想等,帮助用户更快捷地获取搜索结果,如下图所示。
目标对设计的影响
作为交互设计师,在设计前务必要先明确用户目标和业务目标,只有方向正确,交互路径和方式才有意义。
要素3:场景
不同场景下,用户的需求是不同的。
洞察用户场景,提供场景化设计可以给用户带来便利甚至惊喜。
以vivo手机为例,当有可取快递时,锁屏状态就会出现提示,点击就可以扫码取件,非常的便捷,如下图所示。
场景对设计的影响
当复制了淘宝链接以后,打开淘宝会直接弹出淘宝链接,一键直达链接详情。
默认打开vivo浏览器会进入浏览器首页,但如果出现闪退再次打开浏览器,则会直接进入上次闪退的页面,避免用户重新查找该页面。
这都是根据用户场景提供的场景化设计,会让用户感觉非常的贴心便捷。
要素4:媒介
媒介包含搭载产品的软硬件,如下图所示。
媒介对设计的影响
比如手机、计算机,以及手机中的App等。不同媒介平台规范不同,用户基于使用经验,会形成不同的认知和使用习惯。比如,计算机端会包含更全面复杂的功能,可以使用鼠标键盘辅助操作。移动端的操作和功能相对简便,可以使用手势语音辅助操作。
同是移动设备,iOS和Android在系统级的规范和组件上也有差异,所以在设计之前,设计师需要先确认产品所在的硬件媒介及其软件系统规范,再根据硬件特点和软件规范去做设计。
要素5:行为
表面上看,我们的设计决定了用户的行为,比如我们设计了一个按钮,用户就只能点击;我们设计了一个滑块,用户就只能滑动;我们设计了输入框,用户就只能输入。如果我们是垄断型产品,那用户只能逆来顺受。但在充分竞争的自由市场,用户的选择很多,如果对我们的产品用得不顺手,用户转身就可能投入到其他产品的怀抱。为了留住用户,我们在进行交互设计时,往往需要顺应和引导用户行为,而不是与用户固有的行为模式相冲突。
福格行为模型如下图所示。
福格行为模型
想要用户发生一个行为,需要用户动机、用户能力和产品提示同时满足要求。因此交互设计时,需要充分考虑用户动机,提供合理的提示,降低用户交互成本,提升用户能力,以便让用户行为自然而然地发生。
对于用户熟悉的产品,我们要顺应用户操作习惯,对于新产品,我们则要更多考虑用户心智,如下图所示。
心智对设计的影响
了解用户对新产品的理解、期待、顾虑和担忧。尽可能地让产品接近用户的心智模型,打消用户顾虑,让用户可以按照自己的理解和习惯来操作产品,减少认知和操作成本。
通过顺应用户的心智模型和行为模式,可以增加用户对产品的熟悉感,最大程度地降低用户的行为门槛和成本,提升行为发生的概率。