3个层面分析:情感化设计怎么做?
2020-05-18 17:52:12 来源:怡和散文网

这篇文章跟大家分享了情感化设计的思路和方法,并结合丰富的例子,让大家更直观的感受情感化设计,以及情感化设计的妙用。

3个层面分析:情感化设计怎么做?

时至今日,大家都已经深切的明白情感化设计的重要性和必要性。但毫不客气的说,情感化设计依然是很难的一个环节,即使掌握了情感化设计的理论基础和设计思想,却时常还是感觉不知道从何下手,就需要结合大量的案例来具体领会。情感化设计的理论基础已附在文末《情感的艺术—诺曼·情感化设计》

一、案例分享:诺曼《情感化设计》的三层理论模型

下面以诺曼《情感化设计》的三层理论模型为依据,分别介绍每一层级上的设计案例。

3个层面分析:情感化设计怎么做?

1. 本能层

(1) 俏皮的设计

可口可乐的营销案例:字可能看不清,左图写着“你算老几”,当喝完可乐就会看见答案“我的知己”

3个层面分析:情感化设计怎么做?

(2) 情景化设计

这是苹果的天气设计,很多天气类软件都有类似的设计:展现的情景跟当前的天气状况是实时对应的,白天云朵会飘,晚上甚至能看见星星。

3个层面分析:情感化设计怎么做?

(3) 彩蛋给人惊喜

Chrome浏览器搜索“灭霸”,点击右上角的“超能手套”,网页开始消失。真的有一种灭霸打个响指的感觉。如果声音外放,还能听见音效。

3个层面分析:情感化设计怎么做?

(4) 小变化给人新意

下图分别来自B站、微博和即刻。在点赞后会发生一些与众不同的变化,给人带来新意。

B站会出现B站小电视、微博再给林志玲点赞后会出现vow的表情、即刻更是喂猫前后分别用小鱼和鱼骨代替。不同情境下点赞,还会出现不同的动态效果。

3个层面分析:情感化设计怎么做?

(5) 别出心裁的设计让人眼前一亮

一加用小人托起卡针,虽然好像并没什么作用,但能感觉到设计师用心了,用心的产品总能让人放心。

3个层面分析:情感化设计怎么做?

一加

(6) 安全感

readme、Bilibili在输入密码的时候,会遮住眼睛,我试着感受下潜台词:我不看,你放心输入吧。

3个层面分析:情感化设计怎么做?

readme

3个层面分析:情感化设计怎么做?

Bilibili

(7) doodle情感化设计

doodle先特指在logo上进行的一些创意表达,Google在这方面玩得最早也最多。

3个层面分析:情感化设计怎么做?

3个层面分析:情感化设计怎么做?

3个层面分析:情感化设计怎么做?

(8) 拟人化

Bilibili极力地在打造二次元形象,甚至能感觉到两位小姐姐的身高、体重、性格、心情,在Bilibili中就像有两位小姐姐一直在陪伴着。

3个层面分析:情感化设计怎么做?

Bilibili

夸克浏览器语音助手界面,两只眼睛忽闪忽闪的,可爱极了,像一只小精灵。

3个层面分析:情感化设计怎么做?

夸克

(9) 小游戏

Google浏览器在断网的时候会出现小恐龙游戏,也是很有趣。

3个层面分析:情感化设计怎么做?

Google浏览器

(10) 微动画

以google pay为例,它为每一笔交易奖励一张刮刮卡,这个微动画增强了感知。

3个层面分析:情感化设计怎么做?

google pay

2. 行为层

(1) 充分考虑用户使用场景