交互设计是我最不熟的一块,一直觉得从定义好功能到出交互图,这之间的过程就是个玄学。去寻找关于交互的书,又发现大部分是一些案例集,或者只是介绍一些交互原则。看到《设计心理学》说到“心理模型”,觉得茅塞顿开,但是实际工作中依然很抽象。
最近终于找到一本书,把这个黑魔法一步步翻译成方法论。这本书介绍的内容比较抽象,但作者写得还算通俗,且非常精炼,全书没有废话(和《信息架构:超越 web 设计》真是形成鲜明对比阿... > <),五星推荐!!
概念模型
概念模型是全书核心概念,它和信息架构非常类似。其实,交互和信息架构的界线,据我目前来看,是非常模糊的。
概念模型或信息架构关注什么呢?作者用了一个很棒的房型图隐喻:
图1.jpg它提供的是一个给定功能(例如,厨房和卧室)的空间整体布局,每个空间都在相对其他地方的整体架构中。此外,通过对门和通道的描绘,方案还为我们提供了从一处到另一处所需路线的明确信息。
作为最简化的方案,在进行实施前,该图在评估架构计划时是非常有用的:是否提供了所有需要的功能(例如,有一个房屋)?是否有足够的空间分配给每个功能(例如,餐厅和客厅应该是最大的地方)?入口是否合适?从一处到另一处到路线和距离之间支持简单的导航吗?
为什么要有这个全局的概念模型呢?
视觉场景的全局结构往往先于任何局部特征的感知。
例如这个经典的认知实验,对于大字母 H 的识别要快于小字母。
图16.jpg概念模型分层
图2.jpg功能层
作者认为功能设计有3种类型,面向任务的、面向对象的和面向内容的。实际设计中可能是不同类型的混合。
图3.jpg架构层(概念模型)
架构层即概念模型,也是整个概念设计的核心,关注的是:
- 用户与应用程序交互以完成任务和目标的“空间”
- 用户需要的从一个“空间”到另一个“空间”的“路径”
(注意“空间“这个词汇)
作者在全书中举了一个“设置预约”的例子。3 个平台上的不同设计:
图4.jpg相应的概念模型是:
图5.jpg可以看到同一个功能设计,会有不同的概念模型。
导航和策略(物理模型)
这个部分首先是将概念元素转为物理元素,然后是其中的导航和策略。
物理空间
这里有一个重要的概念,即上文提到的“空间”。概念元素的“空间”在物理元素里体现为一个页面、或页面上的一个模块等等。
我们在讲元素、模型这样的词汇时,容易把它们理解为物体。但这里所说的元素是一个“空间”的概念。空间和物体有什么区别呢?如果把一个物体和另一个叠加,不管怎么放,始终是两个物体。但两个空间叠加,也可以理解为成为了一个空间。
知晓了这个区别,就比较好理解一个问题,即,概念空间和物理空间有时是一对一的关系,有时可能不是。
如下图,对于 3 个概念元素,上图中是 3 个物理空间,而下图中是放在 1 个物理空间中。
图6.jpg导航和策略
这部分关注两点。
- 空间间的路径:出口和入口、路径的方向、数量
- 模态 or 非模态
我们在设计用户路径的时候需要考虑一个基础问题,即:
用户是否可以同时执行不止一项任务?就交互流而言,这个问题会产生以下影响:用户进行到下一项任务之前是否应该全部完成或部分完成当前的任务?用户是否需要完成给定的任务,然后跳转从而继续完成下一任务,并且完成下一任务后是否应该能够再返回去完成初始任务?
这就引出模态的概念。
非模态概念模型元素允许用户同时与其他概念模型元素进行一对一交互。反之当交互原则限定了用户在同一情景中一次只能与一个概念元素进行一对一的交互时,我们称之为模态交互策略。
我理解,非模态指的是你可以先在这个概念空间交互,再在那个概念空间交互或者反之,而模态是你必须先在这个概念空间交互,再在那个概念空间交互交互。它们的区别是交互顺序是否被指定。
物理空间是否相同、是否模态组成了不同的概念模型:
图7.jpg再看设置预约例子中的物理空间:
图8.jpg形式层和细节层
就是交互和视觉的细节
所以总结一下,交互设计遵循从功能到概念模型,再到物理模型再到交互细节的过程。
概念模型的类型
概念模型可分为两个主要类别:
- 顺序和结构化:单序列结构模型、层级结构或多序列结构模型。
- 非顺序和非结构化:轴辐型、矩阵型和网络型。
概念模型越复杂,通常给用户提供的自由度越高。用户执行各种任务时灵活性越高,控制越多,特别适合专家用户。
这个复杂度在于:概念元素的数量、出口和入口的数量、用户可采取路径的数量。
概念模型评价:用户绩效和可用性
如何可知概念模型用户体验如何?作者分了两个指标。
用户绩效
用户绩效指的是
感知、认知、情感以及物质的过程和行为。
评估包括 5 个方面:
- 心理模型与理解力
- 位置感知
- 视觉搜索效率
- 操作(执行动作)负荷
- 工作记忆负荷
心理模型与理解力
操作和任务流程是否符合用户心理模型。
位置感知
位置感知是指
我们能意识到我们在哪,我们周围有什么,我们到达我们所在位置的路径以及可能是目的地的其他位置的能力。
影响因素:
- 访问空间的个数
- “地标”“您在这儿”的定位帮助
- 空间之间路径的长度和复杂程度等
- 是否存在于相同物理空间。
存在于相似物理空间的概念空间之间的导航,比不同物理空间间的,位置感知更有效率。
视觉搜索效率
视觉搜索是我们通过浏览视觉屏幕寻找特定目标的感知过程。在这个过程中,屏幕中任何其他非目标元素都是干扰。
影响因素有:
- 场景中元素的数量
- 元素特定的视觉属性,如大小、颜色、形状以及与其他项目的相似性
- 元素的视觉布置和组织
这里注意位置感知和视觉搜索效率可能会矛盾。同一物理空间,概念元素越多,越容易位置感知,但越会降低搜索效率。
操作负荷
影响因素:
- 操作的数量
- 物理空间间的路径
物理空间越少,空间间路径越少,操作负荷越小。
工作记忆
用户记忆负担越少,体验越好。
图10.jpg可用性
指标有:
- 易学性:与工作记忆有关
- 有效性:与位置感知、视觉搜索效率有关
- 效率:与工作记忆有关
- 满意度
怎么做?
功能层
前面用户调研、场景分析就不说了。
这里注意场景分析是进行对象行为分析。这个对象包括三个方面,不是单单分析人。
作者举了一个例子,为一个跑步爱好者做一个跑步时可以使用的应用。
- 人
- 实体对象:物理和有形的实体。例如 GPS 接收器、音乐播放器或道路本身等。
- 抽象对象:通过“不是xxx“来定义。所有不是人、不是实体对象的都可以。如运动计划、已进行的运动等。
除了关注用户本身的行为,还应关注用户和实体对象、抽象对象的互动等。
图12.jpg然后还有任务和流程分析。
进行用户调研,关注场景中的对象行为,进行任务流程分析。如此考虑对象、任务、内容,差不多就能整理出功能。
架构层
这一步从功能过渡到概念模型,主要是去抽象出核心的概念元素。
导航和策略
这一步从概念模型过渡到物理模型。
勾勒概念导航图
- 概念元素的进出口
- 概念元素之间连接的导航方向
如何评估呢?
可进行概念模型评估、用户绩效和可用性评估
概念模型评估:
- 它是否能代表所有功能模块?
- 它是否能表达元素之间的连接关系、并反映出功能模块之间的连接?
- 导航地图是否支持工作流程?
- 模型的复杂程度是否适合用户画像和任务结构
定义概念元素的物理空间分配
这一步首先分析我们在任务分析、对象行为分析中得到的结论:
-
用户做某事的频率是多少?
相似频率的概念元素可以安排在同一或相邻物理空间。 -
用户能够同时做些什么?
同一时间内完成的任务或操作,无论是对于同个对象或不同对象,都可以考虑分配在同一或相邻物理空间。 -
用户在做了某件事之后会接着做什么?
一系列连续的操作可以被考虑放在同一或相邻物理空间。 -
某事是否取决于另一件事?
具有依属关系的操作可以被考虑放在同一或相邻物理空间。 -
用户能同时看到什么?
一个任务或对象的可见性是指其状态能够被用户注意到的等级。我们需要确定哪些任务或状态是需要被用户看到的。被要求可见性程度相同的任务和操作可以被考虑放在同一或相邻物理空间。 -
直觉性和易寻找性如何?
具有高度相似性的任务和对象可以被考虑放在同一或相邻物理空间。
此外还要考虑用户使用情境
- 物理情境:室内室外、白天晚上、安静吵闹、气温等等
- 工作流程情境:当前位于的特定阶段、步骤或状态。如初次安装等。
- 个人情境:新手老手、清醒疲劳等等
- 社会情境:团队合作、分享互动、本地远程;国籍、文化、种族等。
定义导航策略
定义模态还是非模态。
这里注意通常大屏幕需要考虑更多。需考虑窗口、对话框、屏幕间有无模态上的联系。小屏幕由于物理限制,通常设计出来都是相互排斥的元素,即模态的。
形式层和细节层
考虑操作、参数、信息
操作
区分导航操作和在目标对象上执行的操作。
导航操作是指那些能够使得用户在导航地图和概念模型中转移的操作。例如,打开或关闭一个窗口,点击一个标签页来到另一个概念元素上,或打开一个文件、应用。
在目标对象上执行的操作包括创建、修改、删除对象等。
参数
每个目标对象一般会有参数。例如跑步的例子中,计划跑步里程是一个能帮助用户定义任务的参数。
信息
任何信息,无论是静态的还是动态的,都不是被用户定义的。
这些信息包括任何来自外部但是没有被用户输入或者设置的信息。例如,标题、字幕、描述、解释、参数的标签等。
图15.jpg
网友评论