交互设计师也要懂心理学?我读书少,你不要骗我!

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

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个积分贴卡,等积分卡满的时候就可以换取礼物。下面是两种不同的方法:

A、积分卡有10个贴槽,给你卡时所有贴槽都是空着的;

B、积分卡有12个贴槽,给你卡时已经贴上了2张贴纸;

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

原文链接:jeffreyblog.com/archives/116

  1. 交互设计讨论群 Ⅰ群:156360020
  2. 交互设计讨论群 Ⅱ群:247123791
  3. 交互设计讨论群 Ⅲ群:147868955
  4. 交互设计讨论群 Ⅳ群:362796793

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/17456/

(0)
iouedioued
上一篇 2016-09-06 14:09
下一篇 2016-09-07 09:10

相关推荐

  • 【交互】浅析交互设计

    点击上方"人人都是产品经理"可以订阅哦由于在工作中会经常探讨交互该怎么做以及如何做出高效的交互,今天就整理下自己的思路,和大家一起探讨下交互其实分为两种:一种是酷炫的动效,一种是隐形的操作反…

    2017-08-04
  • 交互小技巧!浅聊四个主流的页面间跳转动效

    最近一直在做交互规范总结的工作,在不断梳理页面间跳转逻辑的同时,发现页面间的逻辑关系并不能和页面间跳转的动效很好的结合上。虽然只是零点几秒的切换动效,却能在一定程度上影响用户对于页面间逻辑的认知。为了输出详细的规范,花了大量时间把玩现在公司线上的产品以及国内外优秀的APP,尤其是苹果、谷歌自己开发的APP。(如果某些方面在设计规范中并没有给出答案,就在原生APP中找答案吧!)

    2017-05-29
  • 酱课程丨交互设计第③期 · 原来交互设计师是这样工作的,和你想的一样吗?

    交互课程第三期来啦!查看前两期点击这里——交互设计第①期 · 这个老师只用一张图,就解决了所有设计专业都会遇到的问题!交互设计第②期 · UI/UX傻傻分不清楚?分分钟带你搞懂交互设计下的六大Job Titles!通过前两期课程,同学们了解了双钻图——一套完整的设计流程指导框架、定义了什么是交互设计、它所涉及到的领域以及与交互设计相关的六大Job titles。现在大家对交互设计已经有了一个大致的理解,设计流程框架也是现成的,下面就要进...

    2018-05-04
  • 在交互稿中,应重视「键盘类型」的标注

    在交互稿的标注中,我们经常会忽略键盘的说明,这是不对的。键盘在用户的交互过程中起到了非常重要的作用,尤其在多个输入框的场景下。

    2017-05-13
  • 在设计过程中,设计师如何输出一个更落地的动效呢?

    优秀的动效设计更能让用户从中感到惊喜,让用户感受到产品的温度和调性。

    2017-05-05
  • UI设计中下拉刷新有什么讲究?

    最早的下拉刷新 设计源自于Tweetie 这款应用的设计,设计师Loren Brichter 是这种令人欲罢不能的交互的缔造者。现在,下拉刷新 的交互几乎无处不在,但即便如此也让人无法轻易忽视它带来的快感。从Twitter 到 Gmail,从QQ到新浪微博,它几乎存在于你触手可及的每一个应用当中。

    2017-05-16
  • 产品思维~02·用户体验与结婚教练

    今天继续分享《得到》app梁宁的大师课程产品思维30讲,感兴趣可以下载《得到》app继续关注,在文后会附上《得到》app的下载方式。其实梁老师真的很幽默也很形象,来用结婚教练的例子来类比产品的用户体验,同样的结婚也好,创业找合伙人也罢,都是非常重要的长期关系,改变一个人那是非常难的一件事情,那么如何去观察和判断一个人就显得尤为重要。如果没有受过专业训练,那么眼睛看到的很可能是不真实的,你的感觉以及情绪很容易被某个点所牵制,而且在你没有强...

    2018-04-26
  • Hello UED!

    今天,UED.xyz正式上线,我们期待能尽快成长,以期能承担帮助国内交互设计师寻找灵感和创意的站点。 我们会专注交互设计,我们的域名是https://www.iamue.com和UED.xyz,请记住我们网站叫艾欧交互学堂。 如果有同学…

    交互设计 2014-09-02
  • Adobe的UX设计系列:如何为移动应用设计错误状态

    人非圣贤,孰能无过。当人们操作用户界面的时候,错误难免会发生。有时候是因为用户做了错误操作,有时候则是由于应用本身出了问题。无论原因如何,出现的错误以及对其处理的方式,都对用户体验产生巨大的影响。糟糕的错误处理方式以及无用的报错信息会让用户感到万分沮丧,甚至会导致用户放弃继续使用你的应用程序。

    2017-05-15
  • 设计思维常用的五种工作方法

    什么是设计思维呢?顾名思义,设计思维就是设计师用来思考问题和解决问题的方法。如何培养设计思维?今天这篇用两个实战案例帮你一窥设计思维的奥妙。

    2017-05-06