交互设计方法论:空间(Space)
交互设计究竟要考虑什么空间要素,才能尽可能地将所有情况都考虑进去呢?本文将主要通过以下3个问题进行研究。
我们日常使用产品的时候,基本上都是在某个场景下使用的。以雨伞为例,天空下起了雨,如果此时我们是在家里,那肯定不会使用雨伞,但如果我们要去外面的话,我们就需要使用伞来遮挡雨水。交互设计师也非常地清楚,在做交互设计时需要考虑到使用场景,而场景中的必不可少的要素就是地点或者说人所在的位置。
但为什么我们考虑了场景,还是会出现各种各样的让人体验不好的交互问题呢?
比如在厕所里安装声控灯,当有人进入厕所时,灯就能够亮起来,当人离开厕所后灯就自动熄灭,节省能源。这个交互看起来很好地减少了人们去找到开关,再打开开关,离开时关闭开关这三个过程。
但投入实际使用时,会出现什么问题呢?
女生在厕所对着镜子补妆的时候,因为太久没有声音,灯突然就灭了,然后就需要跺脚重新让灯亮起来。男生虽然不需要补妆,因为某个我们每天都会进行的生理行为,我们需要在马桶上坐一会,而这个时间有长有短,当超过灯的时间后,我们就需要鼓掌让灯亮起来了。你可以想象一下,当你坐在马桶时,灯灭了,坐在你隔壁的人突然鼓掌或者叫唤一声是什么样的体验。
发生这些问题,很多时候是交互设计师没有将某个情况进去,直到真实遇到的时候,再考虑如何去改善。
一般来说,大公司会通过给部分人员体验使用,从中发现问题,小公司可能就没有这个能力。而且就算是大公司,也有可能没有发现出某些问题,直到产品上市之后,使用情景和人数增多了,才会发觉哪些情况忘记考虑了。
哪些情况忘记考虑了?
那么交互设计究竟要考虑什么空间要素,才能尽可能地将所有情况都考虑进去呢?让我们从上一章中提到过的开灯照明的例子进行分析:
例子:我在家睡觉,天还没亮就起床了,我需要看清楚周围环境,于是下一步就要开灯照明。我将灯的开关按下,然后灯就亮了。
在这个例子里,在家睡觉,空间位置就是在家里,好像没有其他可延伸的含义了。这里的位置不是在课室,不是在公司,而是在家。所以场景的位置信息就是在家。一般产品经理,亦或是交互设计师,很多时候考虑到家这个层面上就终止了。
但实际上,我们需要考虑我现在在家的哪个位置,灯的开关在家里的哪个位置,我如何抵达开关那里,我够不够高去开启开关,我用手还是脚去开启开关等等一系列的问题都会影响到交互的设计。
你不用记住上面的这些问题,因为即便我现在列出来了这些问题,也不是你自己想出来的。你也很难去将这些内容记住,这种填充记忆式的学习,过不了几天就会忘记,而且不同的产品,其交互设计考虑的空间要素有所区别,所以死记硬背是没有用的。
接下来我将主要通过以下3个问题进行研究,来思考我是如何提出上面的一系列问题,并对上列问题进行解答的。
三个问题
- 空间包含着什么要素?
- 要素的空间位置包括什么?
- 要素的空间姿态包括什么?
第一个问题答案是讨论第二个和第三个问题的基础。但很多时候交互设计师只考虑了第二个问题,就是使用的地点。你只要记住这3个大纲,下面我会对交互设计的空间要素的进一步细化。做到只需自己可以很快地推理出来这些细化都有什么,而不是靠记忆力。
问题1:空间包含什么要素
(1)空间的含义
在正式说到交互的空间包含哪些要素前,我们先自己想一下空间的概念,空间有什么东西?
下面是维基百科物理学上的空间概念,我们来看一下维基百科对空间(物理)的解释:
空间为一种抽象观念,乃是物质与事件存在并有彼此相对关系的客观形式。与“时间”相对,通常指四方上下。
古典物理的解释:宇宙中物质实体之外的部分称为空间。
近代物理的解释:宇宙物质实体运动所发生的部分称为空间。
在相对论中,时间与空间一起组成四维时空,构成宇宙的基本结构
在古典物理的解释中,我们看不见摸不着的空气称为空间,因为没有物质实体,但其实现在我们都知道空气中也含有氮气氧气等各种物质。实际上物质实体也是占有空间体积的,比如:人、手机、电脑等都存在于空间之中。我们无时无刻都处在空间之中,空间会影响到交互设计。
举个最常见的例子,我们使用iPhone时,可以一只手在空中进行操作,但当我们使用iPad时,往往一只手是无法在空中操作的,你需要一只手拿着,另一只手操作。
那么接下来我们要思考的问题是:
- 从物理学的角度划分,空间都包含着哪些物质实体和非物质实体?
- 从交互的角度划分,可以将空间划分成什么呢?
(2)空间包含什么
古典物理角度的物质实体:
我们继续去分析空间都有哪些物质实体和非物质实体。我是一个人,我是物质实体吗?
那必须是的,我肯定存在于空间之中。人,各种动物,各种植物,都存在于空间之中,而且是看得见摸得着的实体,学过生物课的应该都知道这些可以看作是生物,有生物肯定会有“死物”。石头,水、太阳、月亮,这些都不是生物,也会占据着空间位置。这些都是看得见摸得着的,也就是维基百科里面所说的物质实体。
古典物理角度的非物质实体:
那么非物质实体,比如空气,我们看不见摸不着,这些又该如何分析,空气中含有氧气、氮气、二氧化碳等气化物质(在一定条件下也可以变成液体,比如我们灭火用的二氧化碳)。
那么非物质实体,除了这些气化物质外还有什么?不存在任何物质,比如外太空的真空中,什么也不存在,一片虚无。
人由各种器官组成,器官由细胞组成,细胞最终到最后就是各种元素。所以空间可以看作由各种化学元素组成分子、离子、无机物、有机物、植物、动物、人,各种人造物和虚无组成。上面的分类会有重叠的部分,按照不同的分类标准有不同的划分逻辑。
(3)以交互划分逻辑可以将空间划分为使用者,媒介,其他要素
交互,必然是需要两个元素才能称之为交互。根据使用关系,我将划分为使用者和媒介两种要素。而不参与该交互的物质实体或非物质实体,我称之为其他要素。
使用者:
使用者,即使用媒介的人或者动物。很多时候,我们主要考虑的使用者都是人,但实际上使用者不一定是人,也可能是各种动物,不同的动物所要考虑的内容也不一样。具体有关使用者的内容将会独立一个篇章进行讲述。目前在本篇章,我们只需要知道交互的空间要素中包含了使用者。
媒介:
媒介,即被使用者使用的对象。各种产品,电脑,手机,电视,人造物,自然物。比如本书开篇说到的那块被人划出痕迹用来计数的石头,等都属于媒介。具体有关媒介的内容将会独立一个篇章进行讲述,目前在本篇章,我们只需要知道交互的空间要素中包含了媒介。
其他要素:
其他要素,指的是对于当前交互来说,不需要的要素,比如:你在玩手机的时候,空气、大地、海洋、森林等等,但不需要不代表不会影响;比如你在开车的时候,媒介是车,但现在烟雾弥漫,你使用车就会受到影响。当然了,地球之外的太阳月亮这些也可以是其他要素。如果你的交互跟太阳有关,比如太阳光,那太阳就不属于其他要素了。
空间要素小结:
交互的空间的要素可以分为使用者、媒介、其他要素。
下图为空间示意图:
两个问题:
每次交互必不可少地存在使用者和媒介这两个要素,那么接下来要问的问题是:使用者和媒介的空间位置包括什么?使用者和媒介的空间姿态包括什么?这些就是接下来需要讨论的内容。
问题2:要素的空间位置包括什么?
事物必存于世间某处,我在家,我在学校,我在公司,我在回家的路上。我们现在通过手机GPS很轻松就能够知道自己在哪里,必定处于地球坐标系,这里的位置其实就是很多交互设计师都会想到的。也是交互设计中重要的考虑因素之一。
我们可以很容易就能够知道空间包含的要素,使用者和媒介必然存在于地图中的某个位置。对于这种位置,我称之为绝对位置,即使用者和媒介在这一刻,必然会有绝对位置。当使用者和媒介各自都存在绝对位置,这两个绝对位置间的关系,我称之为相对位置。
由此,我们可以知道,要素的空间位置包含了绝对位置和相对位置两种。
(1)绝对位置
人有绝对位置,你住的家也有绝对位置,你所在的城市也有绝对位置。这些绝对位置的精确度不一样,不能说考虑城市的绝对位置就不用考虑家的绝对位置。为了更好地进行分析我们可以根据参照系的范围不同,将绝对位置看作是一个点。交互的空间位置是在一定参照系里讨论才有价值,脱离参照系讨论交互的空间,就是耍流氓。
根据范围的不同,在宇宙坐标系里,地球是一个点。在地球坐标系里,房子是一个点。在房子的坐标系里,你是一个点。
点在空间中可以上下左右前后进行移动,使用者可以看作一个点,人在床上,在洗手间,在上班的路上。媒介也可以看作一个点,家里的洗衣机,电视,空调等。
清楚了上面的逻辑之后,让我们回到开灯照明的例子来分析要素的绝对位置和相对位置。
开灯例子:
我被闹钟吵醒。灯在我的上面,而开关在我的床头旁边的位置。我需要靠近床的一侧,才能碰到灯的开关。如果将我看作是一个点,开关看作另一个点,这两个点的空间距离是发生了变化的。如果我想打开水龙头,也需要走到洗手间,水龙头和我看作两个点,这两个点的距离不停缩短,然后我才能用我的手去打开水龙头开关。
其实我们手里里所使用的地图软件标示的位置,一个简单的在哪里(where)并不能够将交互所涉及到的东西考虑清楚,其实是一种偷懒的想法。我们生活在三维空间中,而不是在一个平面里,使用哪里(where)往往会限制住设计师的想象力。
绝对位置在地球上是由经纬度和海拔3个维度来确定的,当然我并不说无论在什么范围里都要考虑到空间。这取决于所考虑的维度。但落实到具体的交互设计时,必须考虑空间。比如考虑在家,空间(space)相对于哪里(where)的平面位置多了一个z维度,为立体的空间绝对位置。
而你所在的空间绝对位置不同,就会影响到交互设计。如你在北极圈里生活,外面温度一直是零下,一年中有半年的日子太阳一直都不下山,这些都会影响到交互。
(2)相对位置
现在说一下相对位置,我们回到开灯照明的例子,我去开灯,把我和灯开关按键看作两个点,这两个点的空间距离是发生了变化的。相对距离不停缩短,然后我才能用我的手去打开电灯开关。
知道相对位置的含义之后,现在需要思考这两个点之间会存在什么空间关系?
我在看电视,电视可以说在我正前方的5米的距离,这个正前方其实是人以自己作为一个3维的坐标系的原点来进行方位关系描述的。一旦把人和电视抽象成两个点,其实就不能说这个点在另一个点的正前方了。这样说有点抽象,你可以想象太空中飘着两个篮球,你描述一下这两个球的空间关系,你不能说A球在B球的前方这种说法。
但我们还是有办法进行描述,比如将深圳和香港都看作是点,那么我们可以说深圳在香港的正北方向,这个时候我们使用的就是地球经纬度这一坐标系了。
实际上如果看作是两点的话,因为还存在高度,还需要另外的描述,比如一个人在街上,另一个人站在十几层楼的楼顶。如果以地图的经纬度来看我们说这个人在另一个人的正南方向。显然这种描述是不正确的,我们一般会说这个人是在另一个人的上方。
相对位置包括使用者和媒介的相对位置,使用者和媒介各自的信息发送器接收器四者的相对位置(使用者的信息接收器,你暂时可以理解为眼睛,接收外界信息。使用者的信息发送器,你可以理解为我们的手,进行操作。)
使用者和媒介的相对位置:
这里主要想说的是使用过程中,使用者和媒介的相对位置有可能会不停变化。在这期间,我们要考虑人和产品之间的信息交流是否还是通畅的。
比如我们使用洗衣机时,肯定不会蹲守在洗衣机前面等着衣服洗干净,打开开关之后,我们会忙自己的事情,在客厅刷剧什么的。这时候洗衣机如何跟人沟通,只能是通过声音,因为声音的信息还可以传递到人的耳朵里,但洗衣机如果只有完成的指示灯闪烁,那么因为人和洗衣机之间隔着墙,人是无法接受到这个信息的。
使用者和媒介各自的信息发送器接收器四者的相对位置:
这里主要想说的是在使用过程中,这些信息接收器和发送器之间会互相影响,比如手机上打字,想在这段字的中间插一句话,那么你需要在输入框中,将光标定位到你想要输入的地方。你的信息发送器是手,你用手去点击时会遮挡住内容,你不确定是否将光标定位到想要定位的地方,你需要移开手指看一下,如果没有定位正常,还要继续小心翼翼的再点击一次。
考虑到这种情况,我们需要有放大镜,能够在手指遮挡位置之外的地方显示光标所处位置。当然,如果有其他方式去定位也行,比如直接在键盘上滑动来进行光标移动,就不会有遮挡的情况。
上面是使用者的信息发送器和媒介信息接收器的例子,下面我再说一下关于媒介自身的信息发送器和信息接收器相对位置的两个原则。
1)接近性原则
我们会认为两个接近的事物是有联系的,这个属于格式塔原则的其中一个原则。
2)映射原则
左边的开关控制左边的灯,右边的开关控制右边的灯,这是遵循映射原则的设计。如果右边开关控制左边的灯,左边开关控制右边的灯,那这个就是灾难。
上图是《日常生活中的设计》[美]唐纳德・A・诺,所提到关于映射的例子,图中是4个控制旋钮(信息接收器)和4个灶(信息发送器)。这个例子很好地说明了映射原则对交互设计的重要性。
(3)绝对位置与相对位置的关系
当使用者与媒介交互时,两者绝对位置不能太远,太远的时候,因为媒介和使用者的发出的信息都无法被对方接收到,也就无交互可言。
1)绝对位置变化,相对位置不一定变化
我在电视机前面看电视,和坐在沙发上看电视,我的绝对位置变化了,我和电视机的相对位置也变化了,而我在飞机座位上看电视,其实我和电视的绝对位置是在不停变化的。但我和电视的相对位置却没有发生变化。距离依旧是大概那么远。
2)相对位置变化,必然会有一方的绝对位置发生变化
两个点之间的相对位置如果发生变化,必然要有一方移动了,一旦移动,绝对位置就会发生变化。没有办法举出一个相对位置变化,但绝对位置没有变化的例子。
小结:
空间位置包括绝对位置和相对位置,其中绝对位置又分为使用者的绝对位置,媒介的绝对位置。相对位置分为使用者和媒介的相对位置,还有使用者和媒介各自的信息发送器接收器四者的相对位置。
问题:
上面我们将使用者和媒介成两个点,来探讨绝对位置和相对位置。如果两个点的距离已经很近了,还需要看作两个点吗?如果不算两个点,那应该考虑什么东西?这些是我们接下来需要考虑的问题。
问题3:要素的空间姿态
当人和产品距离很大时,可以将人和产品都看成是点来进行考虑,但如果已经人已经开始接触使用产品了,那就不能再看成点了,要分析使用者和媒介的空间姿态了。姿态包含两个含义,姿势和体态,体态又可以进一步划分体积和形态,同样也要考虑到使用者和媒介信息接收器和信息发送器的空间姿态。
使用者空间姿态:
(1)姿势
要素的空间位置其实还是将我和灯都看成空间的一个点,这是远远不够的。我是面向着开关,还是背向开关,坐着还是站着。这些是不一样的,这就是姿势代表的含义。
(2)体态
体积:我们人有高低矮胖,这里的我是一个人,占据着一定的空间,这就是体积代表的含义。形态:我是人的形状,而不是一个球,当然有的人是国字脸,有的人是瓜子脸,有的人是圆脸。这就是形态代表的含义。
媒介空间姿态:
(1)姿势
你放手机的时候是屏幕朝上还是屏幕朝下,这种就是媒介姿态所代表的含义。
(2)体态
体积:灯的大小,开关的大小,你家里和你朋友家里的灯一般会有体积差异。你家的灯大一点。开关占据着空间体积,灯也占据着空间体积。
形态:你的手机是方形的还是圆形还是三角形,这就是形态的差异。
使用者的空间姿态:
使用者的空间姿态包括:人的姿势(坐站),空间体积(高矮胖瘦),身体形状。
我们先看看人的一天整体的空间姿态都有哪些,床上躺着,起床坐着,站立,行走去刷牙,蹲着系鞋带。去上班/上学坐着,下午运动跑步,回家吃饭,洗澡休息,这些都是粗略分出来的一些整体姿态。每种姿态下,其实还细分到身体每个部位,每个器官的姿态。就像上面的绝对位置一样,细致到某个部位,在空间上是怎么样的。
如果在设计时没有考虑空间姿态,设计出来的产品往往是会有问题的,比如以前小时候的那种下拉式的电灯开关,因为我那时还小,不够高够到,所以也没有办法开灯。还有就是公共洗手间里的洗手盘,如果考虑了小朋友的身高情况,就会有一个比较低的洗手盘给小朋友使用。使用者自身的姿势,空间体积,身体形状等,会影响到交互设计。
下面的设计是为了保护儿童,西班牙慈善机构设计出独特的反虐童海报。只有身高低于135公分的孩童才能看见求救专线号码,避免身旁的大人劝退孩童求救念头,这就是考虑了大人和小孩空间姿态不同而做出的设计。
使用者信息接收器和发送器的空间姿态:
考虑使用者整体的空间姿态时,我们会考虑人的身体姿势,空间体积,身体形状。当具体到眼睛,手等器官时,我们主要考虑的点是朝向和形状。
因为器官的体积是不会变的,有的器官形状也不会变化,比如我们的眼睛,鼻子;有的器官会变化,比如我们的手,可以握,可以抓,可以做出不同的形状,剪刀石头布等。器官的朝向也会变化,必然我向上看,向前看等。
游戏手柄:
说起游戏手柄,大家比较熟悉的是小霸王“学习机”的游戏手柄,如下图2所示。但随着游戏的功能越来越复杂,我们需要更多的按键来承载这些功能,有的厂家在右边添加到6个按键,如图3,以承载更多的功能。
如果有的读者,不知道现在ps4,switch,Xbox等主机的游戏手柄长什么样子的话,建议先别往下看,先自己想一下。
从上面说到的手的空间姿态方面去考虑,究竟应该怎么添加更多按键,添加在手柄的哪个位置?也许你想到的就是现在大厂所用的设计。那说明如果让你回到几十年前,你也可以成为游戏机历史的缔造者。先别往下滑动,想一下。
====思考空间====
解决方案是通过增加肩键,如下图1所示,利用我们的手在握持状态下食指并没有进行任何操作,可以利用起来。有的小朋友可能就有疑问了,其他手指也是空闲状态,为什么不用其他手指,而是用食指呢?
首先是因为重力的原因,我们握持手柄时,手柄会有向下的力。同时我们握持也是需要用力气的,如果我们移动无名指和食指在手柄底部进行按键操作,会让我们感觉拿不稳这个手柄。基于这个角度考虑,下图2的手柄交互设计,必然是不会像肩键那样成为主流设计。
又有好奇的小朋友会问了:“为什么不在肩键位置设置多几个按键呀,像大拇指那样有4个按键不好吗?”
首先,我们看不到;其次,我们人对每个手指的控制度是不一样的。拇指最为灵活,其他手指就没有那么灵活了,比方说你拇指怎么移动,其他手指都可以静若处子,但你自由移动一下你的无名指,你的其他手指就会动如脱兔。
媒介的空间姿态:
媒介的空间姿态同样包括体积、外形和朝向以及信息接收器发送器的空间姿态。
媒介的空间姿态有的是基本不会变动的,比如洗衣机,电视机,冰箱这些。基本上是固定的一种姿态,不会倒过来,或者偏移进行使用。有的媒介是经常变化的,比如我们使用最多的手机,拿在手里玩,放在桌子上看电视,放在口袋里。其姿态是会不停变化的。
一般使用时空间姿态会变化的产品,体积都是比较小的,打火机其实就属于空间姿态变化的一类产品,抽烟,点蜡烛,点各种各样的东西。
我相信正在读这本书的读者,或多或少都有人被打火机的火烫伤过,各种情况下都可能会发生。我说一下我的情况吧,小时候在家灶台点柴草,我把柴草塞进去然后点火,我不可能像点烟一样,将打火机放置草的底部,没有位置。我会把打火机调整成水平方向去点火,火苗是往上的,我的拇指又必须按着打火机开关,这样一不小心就容易烫着。特别是在室外点什么东西,又有风的时候,把火苗吹偏,也是很容易烫伤的,也容易被吹灭。
如果你只是从场景方面考虑交互设计,你没有办法去想到这些情况的。但如果打火机的交互设计从使用时产品的姿态的角度考虑,会不会发明出下面这种一个侧边开关按键的打火机呢?
媒介的信息接收器和发送器的空间姿态:
一般来说,因为信息接收器和信息发送器都是在媒介固定位置的,所以当媒介的空间姿态变化时,媒介的空间姿态也会随着发生变化。
苹果手机的静音按键设置称前后移动来打开关闭,而不是上下移动,可以理解为你把手机放在口袋,会跟衣物触碰。如果开关设置成上下移动,很容易就会误触到。
掌控空间:
说起控制空间,让我想到了《七龙珠》里的悟空的瞬间移动,可以将自己瞬间从一个地方转移到另一个地方。
我们人肯定没办法怎么做,或者说永远也做不到这种瞬间移动。我们也没有办法将自己的东西瞬间送到别人的手中。如果我有这种技术,快递公司就都不用开了。
但在虚拟的软件世界里,我们可以做到移动。就是我们常见的复制,剪切,粘贴功能。这些功能虽然现在已经被大家所熟知,但也是有发明过程的,对这个过程感兴趣的读者可以查阅资料。
思考练习:
下面是键盘方向键的不同设计方案,大家可以通过本章的知识,思考一下这些键盘方向键的设计是怎么样的。
上图这种方案和游戏机手柄的的十字键非常相似。
上图是苹果推出过的键盘,应该很多读者都没有见过。
上图的键盘也是苹果生产的键盘,那时候的苹果logo还是彩色的。
上图的键盘就是我们现在常见的的倒T布局了。
上面两图是小尺寸键盘,没有足够空间给到上下左右按键。
简要分析:
为什么键盘的方向键变化是这样的呢?大家可以使用这章的内容进行分析,我在这里带大家简要地思考一下。
第一张图像的上下左右按键,其实跟游戏手柄的上下左右几乎一样,我不知道是不是直接将游戏机的手柄设计直接挪过来在电脑上用,有兴趣的同学可以去查找一下资料。这种布局是非常规则的上下左右布局。但为什么后来不采用了呢?
我们分析一下现在我们所熟知的方向键设计方案,向下按键依然是在左右按键之间。为什么不是向上按键在中间,有的人可能会觉得,如果那样设计,键盘下面不就多突出一个按键了吗?
这么想是对的,但我们先抛开布局美观的这一观念,给设计师留下一块白板。设计师依旧会设计出向下按键,在左右按键之间。因为人的手指就长成这样。自然放下的时候,中指一般比左右两个手指稍微出来一点。手柄的上下左右都是由大拇指进行操作,并不存在需要很长距离的空间位移。且自然情况下,食指和无名指都自然弯曲的情况下,中指如果想要弯曲度更大是很不舒适且容易出错的。
你可以尝试一下打fps游戏时,我们的上下左右移动按的是wasd,现在s键为上,z键为下。你可以感受一下,你往左走的同时后退,你的手指状态是怎么样的。是很不协调的弯曲,就是因为我们的中指比两边的手指长。这种生理结构让我们必然走向这种布局的向下按键在左右按键之间的这种方案。
作者:交互灵光;公众号:交互灵光
本文由 @交互灵光 原创发布于人人都是产品经理。未经许可,禁止转载
题图来自Unsplash,基于CC0协议
虽然阐述的是很多基础理论,但贯通的恰到好处,如果只有交互的知识体系读这篇文章有点可惜,从空间的角度来看此文也颇为赞叹,
这很难理解吗?都是常识嘛
老哥多多沉淀一些干的知识,这些太高深了 其实用不上的 或者通过上面的 总结出了实际的什么知识 ,老哥 看的感觉在看三体
第一章ipod看着疼,第二章看的生疼,,明天再看你第三章
不好意思呀,即将更新的一章将会是本书的核心,看完你再看iPod篇章就不会有疑惑了。本来的章节顺序不是这样的,如果是按顺序观看。保证你不会有任何疑惑的地方
好的,,期待更新,看完了再给你整体反馈
不看完全文 我还以为自己在看宇宙的理论
我也不想这样的,里面有很多词汇都是在书里前面篇章提到。只看中间一章体验就很不好