浅谈产品细节设计中的情感化设计

2016-02-16 21:22 3 1 收藏

在这个颜值当道,屌丝闪边的时代,拼不过颜值拼内涵,只有知识丰富才能提升一个人的内在气质和修养,所谓人丑就要多学习,今天图老师给大家分享浅谈产品细节设计中的情感化设计,希望可以对大家能有小小的帮助。

【 tulaoshi.com - 平面设计 】

一篇可以让你会心一笑的好文。今天腾讯的同学总结了那些细节里特别打动人的产品设计,创作者的独特创意与巧妙匠心都大放异彩,这篇文章中提到的细节都会让人心头一亮,你会禁不止惊叹:这才是真正的好设计呐。

原研哉在他的《设计中的设计》中有介绍过这样一个案例:日本机场原来是用一个圆圈和一个方块表示出入的区别,形式简单并且好用,但设计师佐藤雅彦却用一个更温暖的方式来重新设计了出入境的印章:入境章是一架向左的飞机,出境章则是个向右的飞机。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

通过一次次的盖章,将这种温暖的情绪传递给每一位进关的旅行者们。在他们的视线与印章相交的那一刻,会将这种温暖转化为小小的惊喜,而不由自主且充满善意的『啊哈』一下。一千一万次的『啊哈』就会伴随着这一千一万次对旅行者的善意与好客。这便是产品中的细节与用户直接情感化传递的结果。

一兰拉面是在日本非常受欢迎的拉面店,在顾客吃完面并把汤喝完会看下碗底有这样几个字この一滴が最高喜びです(你最后一口是对我们最大的肯定),他们用这种简单的细节打通了产品与顾客感情的传递,顾客在喝完最后一口面汤是对店主的肯定,并也因为对店主的肯定同时获得了店主的感谢。

产品中的情感化的细节经常会成为产品与用户之间情感传递的桥梁,这种传递情感的细节不仅可以增加用户对产品的好感度,更可以让产品更加深入人心,利于产品口碑的传播,有时候可能仅仅一句文案,一个动画,一个彩蛋都可以打动用户,使其与产品产生情感上的共鸣,这便是产品细节中的情感化设计的作用。

以下便是情感化设计在网页或者App上的实际运用:

情感化设计可以加强用户对产品气质的定位

Timehop是一款让你回顾那年今日的App,它可以帮你把去年今日写过的Twitter,Facebook状态和拍过Instagram照片翻出来,帮你回顾过去的自己。

Timehop为自己的产品塑造了一个蓝色小恐龙的吉祥物形象。许多小恐龙贯穿于界面之中,用吉祥物+幽默文案的方式来将品牌形象的性格特点和产品气质传达出来。 用户在打开App时就能感受到小恐龙的存在,闪屏中一个小恐龙坐在地上说了句Let’stimetravel,立马将用户从情感上带入了App的主题时间之旅。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

有趣的地方还有很多,类似下图,在默认情况下是露出一半的恐龙在向你招手,小恐龙边上是一句不明意义的文案Mymombuysmyunderwear(我妈妈给我买了我的内衣),当你继续向上拖动时,会发现一只穿着内裤的恐龙,用户就会马上明白上面这句幽默文案的含义。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

类似的地方还有下图,在设置页面顶部向下拖动会有一只摇动的小恐龙,在用户顺着他的引导不断下拉,拉到头,会发现这是一个对话的气泡,蓝色的小恐龙说了句Youmadeittothetop!(你拉到了最顶端!),产品诙谐有趣的气质便从这些隐秘于界面细节之中的设计传递给了用户。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

一个产品能获得用户的青睐不仅要有强烈的需求、优秀的体验,更主要的是让产品与用户之间有情感上的交流,有时对细节的巧妙设计将会极大的加强用户对产品气质的定位,产品不再是一个由代码组成的冷冰冰的应用程序,拉近了与用户的情感距离。

情感化设计帮助用户化解负面的情绪

情感化设计的目标是让产品与用户在情感上产生交流从而产生积极的情绪。这种积极的情绪可以加强用户对产品的认同感甚至还可以提高用户对使用产品困难时的容忍能力。注册登录是让用户很头疼的流程,它的出现让用户不能直接的使用产品,所以在注册和登录的过程中很容易造成用户的流失。巧妙的运用情感化设计可以缓解用户的负面情绪。

在Betterment的注册流程中,在用户输入完出生年月日后会在时间下面显示下次生日的日期,一个小小的关怀马上就让枯燥的注册流程有了惊喜。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

在Readme的登陆页面上,当你输入密码时,上面萌萌的猫头鹰会遮住自己的眼睛,在输入密码的过程中给用户传递了安全感。让这个阻挡用户直接体验产品的墙变得更有关怀感,用卖萌的形象来减少用户在登录时的负面情绪。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

VirginAmerica的注册流程非常的拟人化,在你输入Firstname以后你会收到HeyThere的打招呼,当你在把Middlename输入好后会出现Nicename的提示,好像有一个人在指示你完成注册步骤一样。亲切友好的文案相比冷冰冰的话语更能得到用户的好感与共鸣,人机的对话变得更加情感化。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

Basecamp则运用了一个更拟人的情感化方式在注册之中,当你在表单中输入文字是正确的时候,边上的卡通人物会开心的指着输入内容,当表单中输入错误时,小人的脸将变成一脸惊讶状。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

注册和登录对于一个互联网产品来说都是相当繁琐但又缺失不了的部分,这些流程阻碍的用户不能直接使用产品。对用户来说这便是在使用产品时候的墙,在这些枯燥的流程中赋予情感化的元素,将大大减少墙给用户带来的负面情绪,同时加强用户对产品的认同感,并感受到产品给用户传递的善意与友好。

除了这些温暖人心的设计,也有一些小技巧可以借鉴哟!《细节决定成败!提高用户登录体验的5个细节》

情感化设计可以帮助产品引导用户的情绪

在产品的一些流程中,使用一些情感化的表现形式能对用户的操作提供鼓励、引导与帮助。用这些情感化设计抓住用户的注意,诱发那些有意识或者无意识的行为。 在Turntable.fm中的订阅模式中有一个滑块,你付多少钱决定了猴子欣喜若狂的程度。在涉及到真金白银的操作中,给用户卖个萌也许有奇效。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

在Chrome浏览器的Android版中,当你打开了太多的标签卡,标签卡图标上的数字会变成一个笑脸。使用细微的变化友善的对用户的操作进行引导。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

在用户将要流失前,给予用户情感化的元素也许能挽留下一部分的用户。当你想取消订阅Spotify时,Spotify会在取消订阅的网页上为用户播放Jackson5的Wantyouback。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

有趣的文案有时比醒目的视觉元素更具有引导用户作用,当你在使用InVision切换到别的标签时,标题的标签会改成Don’tforgettoreadthis。

浅谈产品细节设计中的情感化设计,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

人类是地球上最具情感的动物,人类的行为也常常受到情感的驱动。在界面上融入情感化元素,引导用户的情绪,使其更有效的引发用户那些有意识无意思的行为,这种情感化的引导比单纯的使用视觉引导会来的更有效果。

结语

一个优秀的产品应该是有人格魅力且让人愉悦的,这种让人愉悦的积极的情绪便是由产品中那些多多少少的情感化细节来表现出的。那些让用户啊哈的细节,都将会成为积极的情绪所传递下去,影响的将可以能千千万万用户的体验与口碑。

来源:https://www.tulaoshi.com/n/20160216/1574633.html

延伸阅读
时代总是在螺旋式地发展变化中,设计潮流也是如此。随着移动端扁平化设计推进,越来越多的设计师不满足于仅仅是色块、图标和系统字体的枯燥组合,而把更多的心思投入到精益求精的视觉设计中。从平面设计引申过来的技巧在这时起到了画龙点睛的作用:一些细节上的处理,为移动产品的界面大大地提升了品牌逼格。 例如以设计精美著称的Yahoo的两款...
首先,我们先看一个例子。良好的设计如何使得一个平庸的文档脱胎换骨。下面是一张大学生的求职简历,再普通不过了,想要引起招聘经理的注意,恐怕很难。 秋叶老师对它进行了简单的排版,还是一张表格,还是黑白配色,没有使用任何图形元素,效果却完全不一样了。 真是令人眼前一亮,不由自主地想多看几眼。这就是优秀设计的作用:它让...
当我们动手开始制作界面时是否思考过这一点。设计师所设计的界面真的能和用户们的情感形成共鸣么?设计师只投入工作的热情,而不投入自己的感情,把感情化为工作根基的原动力。情感在于把握使用者的感情,而不是个人抒发情感。带着主观色彩设计出的界面与用户的情感形不成共鸣,此界面或许会是优秀的作品,但可能不是完美的产品UI。 个人觉...
文字是人类用来记录语言的符号系统。随着社会的发展,文字已经摆脱了在纸张上,版面上的简单呈现模式,当下的数码产品中有着更为丰富的应用。 大家都知道,界面效果虽然日趋拟物化和平面化,但现在往往很多细节还是脱离不了文字的显示,手机终端屏幕的限制和用户的学习成本也更深一步的决定了文字的不可缺少。 只是在界面设计中,这些文字更...

经验教程

169

收藏

69
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部