情感化设计

通常而言，情感总是与逻辑、理性相对立，但是，代表着标准化生产的“工业化产物”
如果拥有了情感和情绪，则更容易受到消费者的欢迎和推崇。20世纪后，大规模生产几乎渗透到每个行业，其中有明显的情感化设计趋势。如大众甲壳虫汽车，它的外形像可爱的“脸”，仿佛在冲我们微笑，它圆润的线条表达出友好、欢乐的态度，让每一个用户都很容易地与之产生情感联系。当下，不仅仅是工业产品，各种互联网产品都希望能与用户建立情感上的联系，为用户带来身心上的愉悦。
情感化设计，最早出自美国认知心理学家唐纳德·A.诺曼的同名著作《情感化设计》（Emotional Design），该书阐述了情感在设计中所具有的重要地位和作用。书中诺曼由浅入深地将情感化设计分成了三个层次：本能层、行为层、反思层。诺曼认为：“将情感融入产品设计，将解决设计师们的长期困扰，即产品的实用性和视觉性的主要矛盾。”情感化设计是一种以关注用户内心情感诉求为中心的设计理念，其首要目标是促进人与人之间的交流，情感化设计可以使用户从生理、心理和精神理想方面享受到产品带来的价值。
当我们看到鲜艳的花朵、璀璨的烟花时，总是忍不住赞叹“真漂亮！”这就是基于人类天生的情感而作出自然的、潜意识的反应。人类对于美好的事物，总是本能地接受并且产生好感，本能层次是先于思考和逻辑判断的，它是用户对产品的视觉和第一印象的直接反应。
本能层次的设计就是感官层面的设计，通过对外观、色彩、声音、材质、气味等多个方面进行设计，把控外在的优秀品质，良好的本能层设计可以刺激用户本能的感官反应，让用户感到愉悦和兴奋。网站本能层次的设计，关乎网页的版式设计、色彩搭配、装饰元素等视觉界面效果是否美观，能否让用户打开网站的第一眼就被吸引。
本能层次的设计决定产品能否给受众带来良好的第一印象，而这样的印象能否继续，关键就在于行为层次的设计。行为层次的设计是一种极其含蓄和理性的情感化设计方式。网站行为层次的设计关注的是交互过程的使用效率和使用体验，它需要遵循交互设计的基本原则，要求网站交互设计满足功能性原则、易理解性原则、易用性原则、感受性原则。网站行为层次的设计决定用户能否产生继续浏览的欲望，强调如何使用交互元素为用户作出最合理、最简洁、最清晰的使用指导，并运用丰富的交互动效让网站的互动变得更加愉悦，凸显交互过程中用户的主体地位，将用户的生理感受、心理感受和网站的特点有机地联系起来。
反思层次是意识对于客观事物的反应，是人类的最高层次的情感。这与马斯洛需求层次理论中，人类的最高需求也就是自我实现的需求是相通的。反思层次的设计可以让用户与网站之间建立长久的情感纽带，帮助网站提高用户的忠诚度，出色的反思层次设计可以让网站与用户产生情感交流。网站反思层次是用户的情感反思与共鸣，体现在网站的感官记忆和行为记忆在用户心中根植下的深刻印象，使用户因为网站的内涵、趣味等因素触发情感的共鸣，可以通过“个性化”设计、“惊喜感”设计、“成就感”设计让用户达到情感体验的峰值，使用户产生有意识的考虑和基于经验的反思，从而让用户得到最高水平的情感体验。
情感化设计的三个层次是相互作用的，在满足了本能层次之后，就会出现行为层次的互动，进而再促成反思层次的思考，在网站设计中应当注意三个层次的相互作用、相互影响、相互平衡。每个网站都有自己的情感表达方式，如政府网站严肃庄重，娱乐网站活泼轻松，生活服务类网站贴近生活。本书将带着对“人”的关怀去思考网站的情感化设计，同时结合不同国家的优秀设计案例，去分析如何做好网站情感化设计，通过多种设计手段和设计思维与用户建立情感连接，运用整体逻辑、全局思维打造出令人身心愉悦的网站。
由于编者水平有限，书中难免存在疏漏和不足之处，敬请广大读者批评指正。
编 者

《网站情感化设计》以唐纳德·A. 诺曼的情感化设计三层次理论为依据，结合众多案例介绍了以用户情感为中心的网站情感化设计的理念、方法与技巧。全书共分十章，主要包括网站的版式、色彩和装饰元素的情感化设计；网站交互情感化设计的基本原则，以及网站交互元素、交互动效、基于用户心智模型的情感化设计；如何引发用户的情感共鸣、加深用户的情感印象及获得峰值体验的情感化设计。作为一部理论与实践相结合的网站情感化设计的著作，全书内容丰富、图文并茂、专业性强、覆盖面广，网页设计师可以从中学到各种相关知识点与技巧，学会打造一个个令人赏心悦目的网站，掌握提升网站品牌形象和商业价值的方法。 《网站情感化设计》既可以作为高校数字媒体艺术设计、产品设计、计算机技术、心理学等专业的师生进行网站情感化设计的参考书，也可以作为网站设计初学者和爱好者进行互联网品牌形象设计、宣传和营销的工具书。

钱默，重庆邮电大学传媒艺术学院老师。 硕士毕业于北京服装学院，数字媒体艺术设计专业 。    研究领域：数字媒体艺术应用。

第1章 网站版式的情感化设计 1
1.1 网站版式设计的尺寸 2
1.2 网站布局的情感化设计 6
1.3 网站视觉要素的情感化设计 10
1.4 案例赏析：五种不同情感的网页版式设计 19
1.5 小结 24
第2章 网站色彩的情感化设计 25
2.1 网站色彩的情感表达 26
2.2 网站色彩的情感魔力  29
2.3 运用色彩规律调和情感 32
2.4 商业网站色彩的情感化设计 38
2.5 案例赏析：不同类型的商业网站配色设计 44
2.6 小结 47
第3章 网站装饰元素的情感化设计 49
3.1 装饰图形的情感化设计 50
3.2 装饰插画的情感化设计 54
3.3 装饰动画的情感化设计 60
3.4 装饰视频的情感化设计 62
3.5 装饰转场的情感化设计 64
3.6 案例赏析：不同装饰风格的情感化表达 66
3.7 小结 72
第4章 网站交互情感化设计的基本原则 73
4.1 功能性原则 74
4.2 易理解性原则 78
4.3 易用性原则 79
4.4 感受性原则 85
4.5 案例赏析：Demophorius网站交互情感化设计 89
4.6 小结 92
第5章 网站交互元素的情感化设计 93
5.1 按钮图标的情感化设计 94
5.2 网站导航的情感化设计 100
5.3 重要交互控件的情感化设计 107
5.4 案例赏析：加拿大航空网站交互元素的情感化设计 113
5.5 小结 115
第6章 网站交互动效的情感化设计 117
6.1 使用户愉悦的动效很重要 118
6.2 创建愉悦的动效 122
6.3 实现愉悦动效的技术 132
6.4 愉悦动效的设计原则 134
6.5 案例赏析：创意机构网站交互动效的情感化设计 135
6.6 小结 138
第7章 基于网站用户心智模型的情感化设计 139
7.1 心智模型的概念 140
7.2 心智模型的特点 140
7.3 网站心智模型的获得方法 141
7.4 以用户画像反映心智模型 144
7.5 关注特殊群体的心智模型 146
7.6 案例赏析：商业网站用户心智模型的情感化设计 150
7.7 小结 153
第8章 引发共鸣的网站情感化设计 155
8.1 讲好故事增强情绪感染力 156
8.2 游戏化设计建立情感纽带 161
8.3 戳中痛点驱动情感共振 166
8.4 案例赏析：温馨友好的度假民宿网站情感化设计 172
8.5 小结 174
第9章 加深印象的网站情感化设计 175
9.1 感官记忆 176
9.2 行为记忆 180
9.3 特别的回忆：出错的艺术 185
9.4 案例赏析：充满“梦想力量”求职网站的情感化设计 189
9.5 小结 192
第10章 打造峰值体验的网站情感化设计 193
10.1 “个性化”设计 194
10.2 “惊喜感”设计 200
10.3 “成就感”设计 204
10.4 案例赏析：复古风格的海鲜订购网站的情感化设计 208
10.5 小结 211
参考文献 216

《网站情感化设计》以唐纳德·A. 诺曼的情感化设计三层次理论为依据，结合众多案例介绍了以用户情感为中心的网站情感化设计的理念、方法与技巧。全书共分十章，主要包括网站的版式、色彩和装饰元素的情感化设计；网站交互情感化设计的基本原则，以及网站交互元素、交互动效、基于用户心智模型的情感化设计；如何引发用户的情感共鸣、加深用户的情感印象及获得峰值体验的情感化设计。作为一部理论与实践相结合的网站情感化设计的著作，全书内容丰富、图文并茂、专业性强、覆盖面广，网页设计师可以从中学到各种相关知识点与技巧，学会打造一个个令人赏心悦目的网站，掌握提升网站品牌形象和商业价值的方法。 《网站情感化设计》既可以作为高校数字媒体艺术设计、产品设计、计算机技术、心理学等专业的师生进行网站情感化设计的参考书，也可以作为网站设计初学者和爱好者进行互联网品牌形象设计、宣传和营销的工具书。

钱默，重庆邮电大学传媒艺术学院老师。 硕士毕业于北京服装学院，数字媒体艺术设计专业 。    研究领域：数字媒体艺术应用。