交互设计师应该了解的心理学理论：认知心理学、格式塔心理学和心流

问：贴满一张卡需要多久，A和B是否相同？答案当然是不同，尽管同样需要买10杯咖啡，但往往B方案**更快地贴满。

交互设计是个跨学科专业，其中，心理学便是其中很重要的一个部分。所以，如果你不想继续仅凭直觉和死记硬背高大上的**原则来从事交互设计，如果你想成为优秀的交互设计师，学习一定的心理学将是很有帮助也是很有必要的。这篇文章的主要目的就是初步地向大家介绍交互设计师至少应该了解哪些基本的心理学**。

1、认知心理学

在对交互(interaction)的众多定义中，我比较喜欢这个：所谓交互，即输入(input)和输出(output)。所以，交互设计(Interaction Design)就是针对输入方式(通常是人)和输出方式(通常是机器)的设计。比如我们通过“触摸”来控制手机便是一种输入方式，然后手机在屏幕上提供相应的界面就是输出方式。而作为交互设计师，我们要思考的就是在何时采取何种输入输出方式。这里就涉及到一系列问题：我们为什么要用触摸而不是其他方式?机器反馈的界面又该如何设计才能使用户更容易理解，才能使人与机器的沟通更加舒畅自然?要回答这些问题，就要求我们能够从根本上认识人是如何处理信息的以及人是如何行动的。这就是认知心理学的范畴。

人机交互图

而认知心理学**将人比喻成计算机，人像计算机一样对外界信息进行加工，如下图所示：

信息加工模型图

认知心理学无法一两句话就说明白，我这里只介绍几个最关键的概念带大家入门。

A、感受器即人的感觉器官，视觉、听觉、触觉等等。研究人的感受器的特点将有利于交互设计师理解人们如何接收信息，才能设计出合适的交互方式来使人们轻松愉快地接收你要提供的信息。其中，一般来说，从信息量的大小来看，视觉、听觉、触觉依次减小。因此，我们通常使用听觉和触觉来辅助视觉上的设计，比如提示音和手机的震动。

B、效应器指手、足、语言器官等。效应器的质量指标通常是反应时间、运动速度和运动准确性，因此交互设计师可以以这三个指标来检测你的设计是否符合人的认知模型。

C、加工器，这个比较复杂，但也是最重要的一部分，简单来说，它告诉我们，除了客观因素(如刺激强度、数量、作用方式)外，诸如动机、兴趣、知识经验等主观因素也是影响人们理解信息的重要因素。学习它，将有利于交互设计师更准确地挖掘需求和提高设计质量。

2、格式塔心理学

这是交互设计中实际运用的最多的心理学**之一。它主要包括三个部分：相似原则、接近原则和完形原则。

A、相似原则：相等或相似的元素形成整体或群体。如下图左图中，你**不自觉地认为它是纵向排列的，而右图中是横向排列。

相似原则

相似原则告诉我们，人们通常把具有相似特征（如大小、形状、颜色等）的事物组合在一起。在交互设计中，我们经常用到这个原则，如网站的导航，使用不同颜色即可很容易将一级导航和二级导航区分开;再比如淘宝首页的横向标签导航中，“天猫”、“聚划算”和“二手”这三个板块和同一排的其他板块比较，使用了更大的字体更鲜艳的颜色，通过这种方法来强调这三个板块的与其他板块的重要性不同。

搜狐美剧页面导航

淘宝首页

B、接近原则：紧密靠在一起的元素形成整体或群体。比如下图中，你**不自觉地把它分成左右各一组。

接近原则

接近原则告诉我们如果你希望将多个元素进行分类，那么让同一类元素靠近在一起是个不错的选择。比如iPhone的“通用”界面：

iPhone的”通用“界面

同样的道理，很多同学在网站排版或者平面设计排版的时候习惯用各种线条来划分区域，其实没有必要，很多时候只需要合理利用留白就能够起到相同的作用并且更加简洁美观。另外，这里有一个小知识：由于人们的阅读顺序是从左往右，所以左右相邻比上下相邻显得更为密切。比如下图中，人们可能**觉得图**对应的文字是右边的文字，而事实上是图**下方的文字。所以，我们要尽量避免出现这种错误，解决的办法就是遵循用户认知习惯，采用横向的排版，或者加大留白。

看起来图**是和右边的文字对应的，事实上却是下方的文字

C、闭合原则：我们倾向于将图形中缺失的部分“填满”。如下图，你**不自觉地认为它是个三角形，实际上它们只是几根线条而已。

闭合原则

在交互设计中，这个原则也很常用，比如下面两个方案，右边的方案运用了闭合原则，将标题放在未闭合的线框线上，却起到了很好的分组效果。

3、色彩心理学

色彩心理学对于设计的重要性相信任何一个设计师都了解，这里不再赘述。

4、心流状态

心流(flow)是人们全身心投入某事的一种心理状态。人们处于这种情境时，往往不愿意被打扰，心流状态**产生极高的兴奋感和充实感。

把握这个心理状态对于沉浸式的交互设计特别有用，比如设计一款阅读类应用，一款大型网游，我们都希望用户能够不被打扰地沉浸到应用中去。这样的设计例子很多，比如游戏的全屏功能，比如使用safari浏览器时，向上滑动页面时自动隐藏工具类和地址栏。

safari浏览器

那么，如何让用户达到心流状态呢?心理学告诉我们至少要具备以下条件：

A、明确且可实现的目标：所以，我们应该记得始终让用户明确地知道他的目标，并且目标是可实现的。比如，你需要你的游戏玩家去消灭10个叫做强盗的怪，那就在任务菜单里写清楚“10个”和“强盗”，并且要保证这个任务是玩家有办法完成的。

B、流畅的任务：保持流畅的任务直到目标实现为止。比如我们通常**忽视网站的404错误页面，但是，如果在通知错误的同时告诉用户接下来该怎么办**更好。

告诉用户接下来可以怎么做的404页面

C、持续性的反馈：时刻告诉用户当前的状态、所处位置以及操作的效果。此类的设计包括很多，比如导航设计、转场动画设计、状态界面设计等等。

D、可控制的操作：尽管用户全心全意地沉浸到其中，但依然希望能够在需要的时候可以控制自己的行为。此类设计包括可撤销设计、防错设计等。

以上4个是目前我掌握的、我认为对于交互设计最实用的几个心理学**，除此以外，还有很多心理学**都能够运用到交互设计当中去，比如消费心理学等。这里我再给大家介绍一种有趣并且也挺实用的一种心理学**：目标趋近效应（goal-gradient effect）。

目标趋近效应指的是人们在接近目标时**加快行动。比如，咖啡店送你一张积分卡，每买一杯咖啡就得1个积分贴卡，等积分卡满的时候就可以换取礼物。下面是两种不同的方法：

• 积分卡有10个贴槽，给你卡时所有贴槽都是空着的
• 积分卡有12个贴槽，给你卡时已经贴上了2张贴纸

问：贴满一张卡需要多久，A和B是否相同？答案当然是不同，尽管同样需要买10杯咖啡，但往往B方案**更快地贴满。这就是目标趋近效应，离目标越近，人们就越有动力完成它。这在交互设计中也有使用到，比如我们刚注册一个网站时，网站**提醒我们已经填写了70%的资料，继续完善就**得到什么样的奖励，这就是利用人们的目标趋近心理。

原文来自：jeffrey’s blog

原作者：jeffrey

本文由 @maoliren  翻译发布于人人都是产品经理。未经许可，禁止转载。