第1章绪 论
1.1研究背景
在当今科技飞速发展时期，互联网产业逐渐表现出多样化的产业形态特征。互联网技术在不断的发展完善，不仅使大众信息交流的效率得到了一定的提升，同时也推动着许多产业服务链条的改进。目前互联网产业正处于持续扩展的状态，特别是：智能终端、自动价值等产业，因此新经济产业形态营运而生，并得到了巨大的发展。未来一段时间内，5G将得到进一步的推行，将会推动着新经济产业运转模式的变革。部分事物将会被重新进行定义，例如：手机，将不再只是单纯的电话，而是作为一个多媒体载体的形式存在。而汽车上的中控不再是冷冰冰的按键，也是一块可操作的终端产品。拥有图形用户界面的终端产品主要是手机APP与车机应用，互联网加快了他们的增长速度，据数据统计目前在我国第三方的应用程序提供下载的APP有数千万之多，因为中国有着全球最多的网民，手机及各种终端设备逐渐成为我们的生活必需品，在未来，人们肯定要在5G上开辟一个新的战场。但是由于产品的野蛮发展，带来的问题就是产品的各种体验极差，没有考虑用户的感受。
伴随着各种终端产品的界面设计在近年来受到互联网公司的追捧，界面设计是完成人机之间信息的相互传递和相互交流的一种用户体验式图形设计，我们使用产品的体验已经从原本生硬的交互体验逐渐变化成具有情感化的体验。
1.2研究目的与意义
在面对各种终端产品与软体应用的种类优化和用户体验的不断优化，产品的使用体验已经达到了一个的固定的状态下，各类产品已经变得同质化，需要一些东西让产品脱颖而出，这个问题是现在设计师所面临的主要问题之一，因为现在中国的多数产品不是从0-1的过程，而是在突破1-2的过程，在想方设法的提高用户的留存率。因为产品的功能交互和用户的日常生活密切联系，情感化设计在界面设计中变得非常重要，情感化设计可以让产品变得实用易用，增加用户体验时愉悦感，可以让产品在市场上竞争力。
本文研究的一个重要目标便是通过采用情感化设计的基本原则与方法实现用户情感体验的进一步提升，运用在各种终端产品上，因为现在是一个消费时代，产品泛滥的时代，是一个同质化很严重的时代，情感化设计能使用户在操作中获得良好的体验，从而改善产品的界面设计以及交互体验，甚至是人们的生活方式。
1.3研究方法
本文研究过程中采用的方法主要包括：
文献研究法：该方法主要是从以下两个方向进行相应研究工作的，即：图形界面设计、情感化设计等，网络文献资源主要是知网、万方等，并通过百度、谷歌进行相关资料的补充，并且去各种用户体验相关的文章资讯获取所需资料。
文本分析法：研究各类学者对与图形界面设计、情感化设计研究的文献，对相应的内容进行了整理归纳，具体分析研究了上述内容所涉及到的情感化设计与图形用户界面设计。
了解现在终端产品的发展过程及趋势，挖掘用户对产品的需求，搜集各类关于情感化设计与图形用户界面设计的相关文献，列出题纲，整理归纳，为图形用户界面提供参考原则，再通过调研分析情感化设计，获取原则以及方法。确保最后设计的产品拥有良好的用户体验。
1.4研究内容
本文所选择的研究界面为移动端设计，从提高移动化界面设计情感化体验的角度入手开展相应的研究工作。以下是对本文研究内容的具体介绍：
(1)对图形用户界面以及情感化设计等内容进行了解读与分析，归纳好图形用户界面的基本概念与种类，研究情感化设计的概念以及理论原则，细化分析图形用户界面中的情感化设计元素，研究它们之间是如何相互作用。
(2)分别从用户、设计师等角度出发，对手机应用界面情感化设计等方面的内容进行了深入的分析。
(3)从以下三个角度出发：视觉层、操作层、反思层对情感化设计进行了分析，了解更深层次的情感，研究它们存在产品中的必要性。
(4)基于情绪版等设计方法对移动端界面视觉等进行了改进与评估，对设计方案的可行性以及情绪版设计方法的具体效果等进行了检验。
第2章图形用户界面与情感化设计的概述
2.1图形用户界面的研究
2.1.1图形用户界面的概念
图形用户界面主要指的是通过图形显示等方式进行操作的用户界面，目前这一概念更多用于指移动终端的用户界面。第一个计算机图形显示系统诞生之后，视窗系统的概念被提出，即：Sketchpad（图2-1），其编写者为SAGE Project（X空军防空系统）和Ivan Sutherland，被认为是计算机辅助绘图程序的创始者。
图2-1 1963年的SketchPad
图形用户界面是一种用于实现系统与用户完成交互与信息交换功能的重要媒介，可以有效的进行信息内部形式与人类可接受形式的转换。用户界面是一种用于使用户与硬件之间得到有效沟通的软件，设计这一界面的目的是为了使用户操作硬件的效率得到进一步的提升，用户界面的定义十分广泛，指的是人机交互与图形用户接口，用户界面在人类与机械的信息交流领域当中普遍存在。图形用户界面是指对软件的人机交通，不仅具有较强操作逻辑，同时其界面设计也相对较为美观。UI设计不仅可以赋予软件的独特个性，同时也对软件操作的舒适性等的提升具有重要影响，能够使软件的定位与特点等得到充分的反映。
2.1.2图形用户界面的种类
目前互联网科技与通讯技术正处于不断发展的状态，通讯电子消费产品，特别是：手机、电脑等在人们日常生活当中的重要性不断增大。电子消费产品的图形用户界面对于软硬件系统与用户的数据传递与交互等过程具有十分关键的影响方面。通常情况下，可以将电子消费产品图形用户界面划分为以下两种基本类型
1、具体产品独有的操作系统用户交互界面
操作系统用户交互界面与电子消费产品是相互捆绑的关系，属于产品的组成部分。例如：某一品牌的收集或者电脑所具有的操作系统对应的交互界面，主要指的是开机的画面以及用户界面的布局、桌面背景与视窗排列方式等。
2、可运行于不同品牌和型号电子产品的软件
软件是基于互联网、电脑或者手机等前提下存在的，其盈利模式与传统的货币交换存在着较大的差异，免费软件通过免费的推广模式，虽然没有从用户处得到相应的利益，但是却能够通过互联网广告或者增值服务等获得相应的利润收入。
2.2情感化设计的研究
2.2.1情感化设计的概念
情感化设计当中的情感主要是指人对外界作用所作出的具体反应。在这类需求得到充分满足时，人们便容易产生相对愉悦的感受，但是当遇到相应的问题时，不可避免会产生一些负面情绪，例如：厌恶等，此时需求处于未满足的状态。情感化设计便是为了使用户需求得到满足而进行的设计过程，设计的开始阶段，可以将其视作为一种创意工具，在设计完成之后以及运营中，可以变成一个原则尺度来把控。
情感化设计的概念最早是在2005年由Donald. A. Norman提出的，他指出：产品不仅只是具有功能性的导向作用，同时也需要关注用户的体验，在时代发展的推动下，设计需要考虑的因素也在逐渐增多。因为人与机之间沟通越来越重要，这个过程又与人们的生活息息相关，因此情感化十分关键。他认为特征层次主要包括以下三类：本能的、行为的、反思的，并对日常生活当中，情感对决策的重要影响进行了论证。
2.2.2情感化设计的理论研究
情感化设计其实从古至今已经有漫长的历史，通过对国内外文献有关情感化设计内容的大体浏览，目前一般可以归结成三种理论体系：Desmet的产品情感反应模型、Donad.A.Norman的三层次理论和山本健一的“感性工学”
（1）Desmet的产品情感反应模型
曾经在北欧的代尔福特理工大学工业设计学院攻读博士学位的著名荷兰工业设计师PieterM.A.Desmet，他所研究的项目是“情感化设计”，简单解释起来就是主要研究产品设计和该产品给人所带来的情感刺激之间的关系，Desmet的产品情感模型包含以下四个方面，包括产品评估、产品关注、产品刺激和情感，该模型简单概括来说就是向参与者展示一张和参与者目的、个人态度和喜好相符合的产品图像，通过让他们用动画的方式去表现被刺激产生的情感，观察参与者是否感受到了某种情感。
图2-2 Desmet的产品情感反应模型
（2）Donald. A. Norman的三层次理论
Donald.A.Norman教授对于情感在设计的重要地位和作用是通过设计的三维度来阐述的，包括本能、行为和反思，侧重在这三个设计维度进行设计创新，这将会给消费者耳目一新的感觉，进而充满惊喜，最终导致消费冲动。设计的三维度之间并不是并列存在的关系，而是各有各的不同之处。首先就是生物因素本能，它作为情感加工的起点，它能够对外界环境变化进行迅速的判断，在产品对消费者带来感官刺激之后，它迅速进行反应，例如产品的好坏、设计是否新颖，或者是产品是安全还是危险，把这些信号适当传递给肌肉系统。行为和本能相比就是更为高级的存在，它作为控制大多数人类行为的因素，消费者需要从中习得购买和使用技能，也就是在对产品的购买和使用中激发情感，获得满足感、成就感等。三维度中最高级的存在就是反思水平，它是通过本能和行为所引发的消费者本身情感更加复杂的交织，包括个人背景、文化经历、知识、意识等许多因素。三者的关系简单概括来说就是反思控制行为、行为控制本能。Norman教授在书中所指的设计并不是表象中我们所理解的例如游戏、社交、软件或服务方面的设计，而是一种更加广义的设计。三维度理论并不是对设计进行具体指导，更多是以哲学方面的理论去解释消费者对于产品设计的行为倾向。
（3）山本健一的“感性工学”
1986年，日本马自达汽车集团前会长山本健一在X密西根大学进行的题目为“汽车文化论”的演讲中首次提出了“感性工学”。“感性工学”用我们能够能理解的方式来解释就是将“人”的感性与“物”的设计理性以工程技术结合在一起。这种理论通过对消费者对于产品的感性态度和期待将其应用在产品设计的特性上，生产出符合期待值的产品。感性工学也是基于人因工程的面向消费者的产品开发技术。这项技术的应用可以将模糊的感知需求和图像转化为详细设计的元素，感性工学从以下3个方面进行研究:首先是根据心理学和人因工程去探讨顾客的感觉和需求;其次，通过定量和定性分析，对于消费者模糊的感性产品期望中找到其所期望的设计特性;最后是感性工学的模式和人机系统的建立。
日本是感性工学的发源地,感性工学起初是在汽车行业进行了应用,后来该理论趋于成熟，开始广泛应用在各个行业，例如在住宅、服装、家电产品等，通过该理论的应用取得了很多成果[17220]。通过感性工学在产品设计中所取得的巨大成功，这项理论逐渐传播到了X、中国、西欧等国家。虽然感性工学现在还存在一些缺陷，例如不同的个体对于感性的理解有差异，如何去处理个体间的不同；感性术语和产品特性之间如何去用定量的方式表示两者的关系等，但是目前感性工学还是最具有人性化的产品设计方法。
第3章图形用户界面中的情感化设计元素分析
3.1情感化设计的层面划分
本章将利用在业内较为公认的Donald.A.Norman的三层次理论模型为基础（图3-1），他将人类大脑活动部分划分为三层次：本能、行为和反思。本能作为先天的部分存在；行为控制人类日常的动作；反思是大脑的思考部分。本能层面就是在界面设计的视觉层面，消费者对于产品设计之间的交互行为对应的就是行为层，反思层面指的就是界面设计的产品意义、思想影响、体验的分享、文化价值、用户的感受。
图3-1 Donald.A.Norman的三层次理论模型
3.2视觉本能层面的情感化元素分析
本能层面就是在界面设计的视觉层面，用户或消费者通过对图形用户界面的感知引发情感。根据Norman的三个层次理论，这种情感就主要体现在这三个层次上。本节以视觉层面包含的五个因素为依据对图形用户界面的情感化因素进行解释分析。图形用户界面的美观因素，一般是指人直接能够一眼看到的，符合人们审美的要素，包括界面的布局，文字，颜色，图形与动态特效，这些因素从视觉上直接影响用户的情绪。
3.2.1图形用户界面中的布局
界面的布局和定位：图形用户界面中的布局主要是将能通过视觉看到的元素进行安排。设计界面的元素分为：图形放置的方向、放置的位置和图形如何进行排列。这些安排好之后，在界面中能为用户呈现出便捷清晰的优点，提高效率。
(1)方位
界面中各个元素的不同朝向在我们需要传达与方向有关的信息的时候十分重要，方向在很多时候在界面提醒作用、引导用户的操作。所以有的时候他需要被用户容易察觉。
(2)位置
位置是一个相对的概念，位置常常用来表达层级之间的信息传达，特别是移动端界面，界面较小，位置更加的关键，一般信息呈现从左上角开始，位置还与人机工程学息息相关。
(3)排列组合
排列组合最重要的就是视觉焦点，排列组合就是分清主次，将元素与页面之间的关系结构排列清晰，条理分明，层级清晰的板式布局会让页面的信息呈现更为明确，减少用户接受、读取和分析复杂信息的学习成本，还会提高了用户使用产品的效率
3.2.2图形用户界面中的文字
文字的比重非常大，在图形用户界面中图形的标题和正文都是以文字进行阐述，文字的大小、颜色和文字字体都需要和界面的设计相适应，不能出现突兀的情况；文字是向用户传递信息的介质，因此文字信息无需过于繁琐，应简单明了令用户知晓，最终达到文字传递信息的目的，减少用户的理解效率，提高用户的体验。在界面中设计文字一般要3点原则：（1）文字要简单明了，文字的使用不能过于专业化，避免用户无法理解文字的含义的现象发生；（2）在使用文字时，尽量少用否定句，否定句是强调作用，会增加用户的思考时间，只有想向用户提供警示时，才可以使用否定句，其余应多使用肯定句；减少使用被动语态；（3）文字段落格式应符合要求，内容简洁清楚。
3.2.3图形用户界面中的色彩
对于用户来说，色彩能够为用户提供不同的视觉感受，通过不同的色彩搭配能加深用户的印象，从而刺激用户的好奇心和点击率。色彩分为三要素：色相、纯度、明度。通常分为主色、辅色和点缀颜色，主要颜色能主导产品的定位和风格；辅助颜色则是衬托作用；点缀颜色一般会用主色系的互补色与对比色，起到画龙点睛的效果，不同的颜色有着不一样的寓意在里头，例如色相的冷暖能让人冷静或者兴奋；纯度的高低能让人愉悦或者压抑；明度的轻重让人沉重或者轻松。
3.2.4图形用户界面中的图形与动效
图形是界面中常常需要用户理解的元素，它主要分为形状、尺寸。
（1）形状
形状对用户的意识与行为有很大的影响，图形是设计语言的构成的主要部分，图形是传递信息的重要符号。图形可以使具象或者意象，可以让用户通过对自然界的认识与经验来解读形状，图形因为比文字更加形象、直观，在某些特定的场景比文字更加高效。
(2)尺寸
尺寸的大小是相对的，界面如果有太多相似的图形存在的话，使用尺寸这个变量能更好的表达重要性，尺寸的大小也可以提高一些控件的可用性，提高使用产品的效率。
图形设计应遵循如下3条原则:(1)使用简单明了的图形来表示整体象征含义，使图形的形态简洁易懂;(2)根据物体来采用隐喻手法设计图形，更加符合用户的认知程度;(3)不同设备终端下分辨率也有所不同，需要相应的适配。
动效在越来越的产品开始运用，适当且合理的动效，会为整个页面增加趣味性和亮点，动效对人们的视觉冲击力相对更为强烈，可以很好抓住用户眼球，吸引用户的注意力。
3.3交互行为层面的情感化元素分析
3.3.1图形用户界面中的交互方式分析
现在交互方式层出不穷（图3-2），一个好的交互方式会让用户使用操作时感到丝滑顺畅、轻松易用。反之，用户使用产品的时候就会感觉交互方式不流畅，感到疑惑。在界面设计中，应该要采用大众较为熟悉、容易理解且不与用户现有操作习惯的操作方式，尽可能避免不必要的教学，降低用户的学习成本和进入门槛。
图3-2 常用交互方式
目前移动设备的尺寸越来越大，用户虽然在大屏幕的情况下获得了比较好的视觉体验，但是不能够单手操作，相应的也减少了用户的体验。手势操作一般分为手机操作和信息输入（图3-3）。为了根据用户的不同需求提升产品的使用体验，满足用户的单手操作需求。一般握持移动设备分为三种，双手持机操作、单手持机操作和一手持机一手操作的方式。见下图，有三种颜色，即红色、黄色和绿色。绿色区域是三种操作方式中可以单手操作的区域，黄色区域在单手操作中需要拇指伸展才能达到的区域，红色区域是单手操作中最难达到的区域。比较单手操作方式的操作区域，绿色区域最少，在实际使用时，单手使用的情况却是最多，所以要在设计过程中多多考虑用户的单手握持。
图3-3 用户操作手机范围
3.3.2图形用户界面中的情感体验元素分析
界面的交互操作层面能为用户提供高效率和优质的产品体验，在设计产品时（操作方式的设计）要兼顾三要素：产品操作的功能性，产品操作的理解程度，产品操作的使用是否方便。在实际操作过程中，我们对产品自然而然产生种评价，对于操作性难的产品，我们对其评价一般是负面的，会减少对该产品的使用次数。只有设计出令用户满意的产品，才能够提高大众用户对产品的整体评价，提高产品的外在形象。
3.4反思层面的情感化元素分析
一个人的反思行为能够对产品呈现出不同的体验效果，在充分理解了产品的操作方式，会加深用户的使用体验，提高效率。产品能够激发人的情绪、记忆分为很多种，一般化分为正面、负面情绪，情感化设计的目的就是希望利用用户的情绪进行设计，从而达到更好的用户体验。
（1）正面情绪
在情感化设计中，用户在使用产品时获取到更多的正面的、积极地情绪，是设计师所愿意看到的，这样可以拉近人与产品之间的距离，使二者之间的交互具有情感。一般来说想要增加用户的正面情绪就需要提高使用产品的愉悦度，愉悦度包含了用户可控性、互动分享和参与。适当的让用户使用产品时产生共鸣感也是一个很好的方法，共鸣感有三种表现方式：周围参照、品牌关联与对比记录。
（1）负面情绪
在设计中，对待人们的负面情绪要比正面情绪更加谨慎，因为我们要顾及到可能引发的负面情绪，尽量避免，或者寻找对应的举措。例如游戏类界面常常出现的连续签到活动，我们知道如果断签了用户会有一定的负面情绪，所以设计师常常会添加一个补签功能，利用用户的负面情绪进而推动自己产品。还有填写表单的时候，出现红色的错误提醒和解释，以及不可用的灰色按钮都会警告提醒用户，让用户产生灰心失望、精神处于高度准备状态的情绪，从而阻止行为层面的错误操作，进入反思层面 ，进行反省和纠正错误。因此单纯的去注意用户的负面情绪还不够，更要巧妙地去利用它。
第4章图形用户界面情感化设计的原则与方法
4.1图形用户界面情感化设计综合分析
图形用户界面设计中最重要是方便使用性，合理的界面设计能够提高用户的操作效率，在保证方便使用的前提下，如果能在保证易用性的基础上增加趣味性与情感化设计，两者相互搭配，合理的应用起来，理性搭配感性，在实用易用的同时直达用户内心传达情感因素，可以让用户体验到美好的情感体验，这才是设计的艺术魅力精髓。
网络时代的便捷，让我们和电子产品的交流越来越密切，例如，网络电视、平板电脑等等，这也就让情感化设计有了用武之地，机器没有情感，在设计电子机器的同时加入情感，能够提高用户的产品体验，从而提高用户的生活水平。在设计过程中，我们要尽量避免用专家角度，时刻把主流用户放在前面，因为主流用户才是用户体验的重点，专家角度的用户过于追求完美的结果。前面的所分析的图形用户界面情感化设计的各种具体因素，几乎都归纳出来了，但情感化设计需要有一个尺度来把控，所以需要有一些设计原则来使情感化设计与界面相适应。
4.2图形用户界面情感化设计的原则
4.2.1视觉层级设计原则
我们在设计过程中要保持站在用户的角度上，要保证用户观看的界面是美观的、舒适的，适当的时候添加积极的情感让用户有共鸣感。图形用户界面情感化设计的视觉层面包括布局合理、图形辨识度高、文字传达明确、色彩搭配合理、引导联想。
（1）布局合理，结构层级清晰，布局不仅仅只是为了视觉的好看，要考虑是否能让用户可以正确迅速的进行识别与交互操作。界面的布局需要准守四个原则：平衡原则，因为拥挤的界面会让用户出现错误接收，所以维持布局总体的平衡；预期原则，界面中的元素的处理应当统一化，保证预期的动作让用户得知；顺序原则，需要正确的排列与分段；规则化原则，画面需要统一性、各种文字、图形等元素需要统一规范。
（2）图形辨识度高，易于识别，设计时要在界面中突出重点，图形的形态一定要进行一定的隐喻，这样可以贴近用户的认知范围，图形要主次分明，尺寸大小合适，纹理清晰。
（3）文字传达明确，文字的用语要简洁，少用专业用语，使用通俗语言，在按钮控件中的文案尽量使用描述操作的动词，格式合理与信息内容清晰。
（4）颜色搭配趋于合理，情感寓意表达明白准确。设计时，颜色是界面设计的一个极其重要的属性，要安排好图形的主要色彩与次要色彩之间的有机关系，以防影响界面最后的视觉效果;不同颜色的所代表的情感都是不同的，设计师们在设计界面时，要考量用户的心理和产品的功能及其其他综合需求，选择适合的配色。
（5）引导联想，在界面中要寓意明确，能够准确的表达寓意，激起用户的情绪化记忆。可以采用一些隐喻，引起用户的联想，赋予界面趣味，提高产品认知度，引起情感的共鸣。
4.2.2操作层级设计原则
界面的交互操作上必须是易于理解、容易上手的，这便需要界面要有条有理，尽量精简、指令要清楚。如果界面复杂混乱，用户容易操作错误，太复杂的话，容易提高用户的门槛，这不是好事。
（1）有效的传递信息：信息的形式比较复杂，可能是图形、文字，也可能是指令、颜色等。确保使用较为通俗的语言，尽量少使用专业术语、语义不清晰的符号与图形。多使用解释说明，因为现在界面功能越来越复杂，及时的解释说明可以很好的解决用户认知错误的问题。
（2）反馈及时与容错：人与产品之间是不断的进行获取信息与反馈信息的，反馈如果及时准确，将为用户带来愉悦，效率提高。反之，则容易让用户产生厌恶、焦虑的情绪。产品的容错性是指能够提供返回操作的命令方式，用户可能会误操作，这是产品应该要提供可返回的步骤，让用户继续操作下去的可能性。
4.2.3反思层级设计原则
在界面的反思层面，主要有三个方面
（1）通过引起用户的记忆，加深用户对产品的印象，产生共鸣。
（2）提高用户使用产品的操作体验，简单的操作体验能够提高用户的感受，能给用户一种了然于胸的能力。产品具有趣味性，能够提高用户的依赖度。产品具有分享功能，能够满足用户的归属感。
（3）用户和产品之间拥有共鸣，在该产品和其他产品的对比中，品牌的关联可以增加用户对产品的好感与信任，对比记录影响用户的购买意向决策。
4.3图形用户界面情感化设计的方法
在图形用户界面的设计中，通常会建立情绪版的方式来获取设计方向或者形式的参考，情绪版主要是调查研究并分析总结能够引起用户情感共鸣的元素，例如色彩、图像、视频，前期的调研如果足够准确，那么对于中后期产品的开发研发将会有参考价值，它能够让开发出来的产品取得用户的喜爱。一般来说情绪版分为三个步骤：
（1）确立产品设计主题
开始阶段最重要的就是确立产品的设计主题与设计风格，可以通过定义关键字来逐个进行，需要结合前期的用户研究调研来获取与明确相关的主题的情感语义词汇。
（2）情感关键词的收集
在收集情感关键词时，尽可能的让流程各个阶段的人员参与进来，这样可以发散思路，通过头脑风暴可以了解到每个人心中的定义。情绪版中关键词不必收到束缚，多发散思维来与团队相互讨论理解。
（3）情感关键词的提炼
在提炼关键词的时候，要从三方面入手：视觉映射、物理映射、心理映射，可以慢慢的从一个大的概念开始缩小，这个过程主要是帮助设计师从用户的角度去理解。
（4）情绪版图片的收集
固定关键词后，要利用互联网及生活，大量收集可能涉及的图片，然后再通过图片背后的语义来新增删减。
（5）情绪版的输出
收集素材对其进行整理得出结论，有5个内容的设计能够对用户产生影响：界面的色彩，图形大小，画面质感，构图安排和字体。
（6）设计输出
最后根据情绪板进行视觉设计，在设计之前，要先进行总体的勾勒，提取主色来获取相对应的配色方案，再根据画面的分配状况来进行设计，为之后正式创作打基础。情绪版能够令项目组每一位成员了解设计的目的，根据目的来完成设计效果。通过该方式能够令不同的设计师创造相同的设计效果。
第5章图形用户界面情感化设计实践
5.1设计项目概述
随着生活水平与经济能力的提高，很多一二线的人士对于生活态度以及生活方式开始发生一些变化，会注意生活中的细节、会去做一些事情让自己拥有更好的生活方式，在针对拥有较多电子产品的青年阶段人士调研过程中，发现一个新的亚文化-每日常携带，很多人喜欢将自己每天出行时或者工作时的物品做一个整理，然后再优化使工作的效率变高或者生活的质量变好。这个日常携带（EDC）最早由X一些户外玩家开始流行，他们建立一个叫EVERYDAYCARRY的社区网站，相互在里面交流每个人的日常携带，逐渐形成一个导购评测的社区，翻包文化就是从这里开始，而在中国，一些拥有较多电子产品的人士也开始涌入了这个日常携带的概念，他们与户外玩家的目的不一样，他们是想要优化或者更新每天出行时所带的物件来增加生产力与获取更好的生活方式。所以他们常常会去查看相同职业或者相同爱好人士是怎么样的每日出行装备。所以我们将设计一款资讯类产品来满足这些人士的需求。
5.2需求分析及确立目标
在这些数拥有较多电子产品的人士中，常常会去查看每一个物件的导购评测或者相互搭配的方式等等，需要去看相同职业的人士是怎么样的每日出行装备、现在仅有一些贴吧或者碎片化的文章能提供给这些人查看，所有他们的需求就是要有一款可以有整体化的社区交流、导购评测的产品，可以更快的检索别人的每日出行装备。在功能上需要有资讯类的文章、导购向的产品栏目以及社区向的交流功能。其设计目标就是让需求人士抛弃原本到处去每个网站或者社区去检索关于日常携带的信息，而采用整体化的产品，一站式将资讯类文章及社区交流整合在一起。
5.3情感化设计
5.3.1本能层面
（1）此产品的logo使用了带有棱角、深蓝色的图形，为用户留下科技、稳定、专业的感觉。
（2）tab栏的图标采用面性，点击与未点击采用视觉差异较明显的透明度变化，能够让用户更清晰明了。金刚区采用温和圆形的统一样式，使用户在使用产品时不会产生压迫感。
5.3.2行为层面
（1）logo中图形部分由字母E组成，与包装盒元素组合在一起，便于理解寓意。
（2）界面咨询文章采用feed流的方式，给人干净、利落的印象；背景采用淡灰色，与图形与文字相互错开，具有更强的可读性；可以点击的文字与图形内容将尺寸大小最大合理化，方便用户的点击以及滑动。
5.3.3反思层面
（1）logo背景使用纯白，与图形深蓝色做出对比，相互对应，引起联想。
（2）在点赞、评论、分享时，增加微动效，通过这种反馈可以增加产品与用户之间的情感沟通；对于各个模块的层级相互错开，用户可以马上清楚每个模块的位置，让用户有良好的掌握感；进而对自身开始评价或者反思。
5.4架构
因为此产品为个人创建，在绘制界面的架构时缺少比较重要的团队讨论步骤，所以关于产品的头脑风暴需要加大更多的精力，把思维发散，才能将整个设计过程中每个交互操作流程以及用户问题的回馈都能清晰明了。标签栏分为五大类，首页、动态、产品、信息、我，可以满足用户对于咨询与社区交流的需求。（图5-1）
图5-1 日常携带的交互架构
5.5低保真原型功能流程说明
低保真原型最重要的就是要清晰功能的流程走向与跳转，传达的内容主要是使用产品的基本流程与整个界面中的排版方式与内容的设置。
（1）登录与注册
图5-2 注册与登录原型图
登录页面中弱化注册流程，输入手机号后检测到未注册的话将会自动注册账户，减少用户的操作步骤。未输入与输入中时下方的确认按钮有状态变化，使用户更加清晰明了。（图5-2）
（2）首页与文章
图5-3 首页与文章原型图
用户是需求的集合，在首页设计中将功能布局细化，划分为搜索栏+轮播图+金刚区+推荐文章，为用户群体提供便携化的操作界面，满足用户对于互联网产品的行为习惯，文章内容模块采用单大图来吸引用户。（图5-3）
（3）动态
图5-4 关注与推荐原型图
关于动态页面划分为关注与推荐，左右滑动即可切换，这个模块利用社交属性来提高用户的留存率、减少用户的流失，关注模块提供给用户一个分享装备、记录生活的平台，推荐模块可以利用大数据推算的数据来吸引用户留存。（图5-4）
（4）产品
图5-5 产品与用户点评原型图
关于动态页面划分为关注与推荐，左右滑动即可切换，这个模块利用社交属性来提高用户的留存率、减少用户的流失，关注模块提供给用户一个分享装备、记录生活的平台，推荐模块可以利用大数据推算的数据来吸引用户留存。（图5-5）
（5）消息
图5-6 消息与用户聊天原型图
消息页面是动态模块中社区交流的延展，主要将系统级的提醒整合在一起（通知、点赞、评论），与其他用户交流单独排列，方便用户进入更深层的交流。输入方式增加表情功能与添加图片视频功能，提高交流的多样性。（图5-6）
（6）我
图5-7 用户中心原型图
用户中心主要将自己的创作与收藏整合在一起，由于此页面的点击率较低，所以将设置类子功能平铺在一级页面。（图5-7）
5.6高保真视觉效果展示
（1）启动ICON
图5-8 启动ICON
图标灵感来自于产品的开箱盒子，利用边缘组成E字母，代表这个日常携带EDC中的首字母E，深蓝色的渐变代表着产品属性是科技、稳定、专业。（图5-8）
（2）启动页
图5-9 启动页
启动页使用人物扁平插画，具象人物能引起用户的共鸣。（图5-9）
（3）登录与注册
图5-10 登录与注册页面
优先提供手机号登录，能够减少用户的操作步骤，按钮的状态随着用户的输入而变化。将第三方登录方式置于下面。（图5-10）
（4）首页与文章
图5-11 首页与文章页面
（5）动态
图5-12 关注与推荐页面
（6）产品
图5-13 产品与点评页面
（7）消息
图5-14 消息与聊天页面
（8）我
图5-15 个人中心页面
第6章总结
本文讨论的是在这个产品同质化的市场，情感化设计是如何与界面设计中相互联系的，宏观的分析了存在于界面设计中属于情感化设计的元素。再通过文献以及所整理的理论概念析出关于情感化设计的基本原则与设计方法。最后通过实践来探讨在终端的界面设计中如何将情感化设计使用上去，还有进行对产品的反思，了解用户与产品之间是如何紧密相关的。
本论文的见解是强调情感化设计的地位在界面设计中，在保证产品的视觉设计和交互体验在满足基本的功能下，优先去着手用户的情感需求，毕竟每个人都希望在使用产品的过程中可以感觉到这个产品非常地实用、易用并且还能感受到一个愉悦、舒适的场景，这才是一个产品。
参考文献：
[1]楚孔闯.认知心理学下的移动端产品中反馈设计的情感化研究[D].北京交通大学,2017.12-13
[2]增田宗昭.知的资本论[M].中信出版社,2017.30-39
[3]陈震.交互设计对于移动设备用户体验的影响—以情感化设计为视角[D].复旦大学,2013.15-17
[4]唐纳德·A·诺曼.设计心理学3:情感化设计[M].中信出版社,2015.49-70
[5]臧澈.基于信息认知的移动应用程序界面的情感化设计研究[D].华东理工大学,2013.21-26
[6]R. Porcelijn, M. B. van Dijk. Emotional Design; Application of a Research-Based Design Approach[J].Know TechnPol,2007.141
[7]顾振宇.交互设计:原理与方法[M].北京:清华大学出版社,2016.11-12
[8]马超，郑晓东.App界面视觉图形的情感化设计研究[J].科技视界,2018.49
[9]Trevor Van Gorp, Edie Adams. Design for Emotion[M].USA: Morgan Kaufmann,2012.21-22
[10]戴小乐.APP交互界面设计初探—“理性设计”与“情感化设计”分析[J].艺术科技,2013.263
[11]贾尔斯·科尔伯恩.简约至上[M].北京:人民邮电出版社,2018.36
[12]杨丽，胡依娜. APP产品情感化设计研究—基于用户体验[J].高等财经教育研究,2017.81-83
[13] Alan Cooper, RobertReimann,DavidCronin. About Face 3 [M].USA: John Wiley & Sons,2007.461-467
[14]刘津，孙睿.破茧成蝶2:以产品为中心的设计革命[M].北京:人民邮电出版社,2018.37-55
致谢
大学四年的学习生活即将画上句号，回顾这四年在学校的学习、生活以及工作，受到太多人的帮助与支持，感谢在大学生活这条路有你们的帮助，在你们帮助下，我在只是增长的同时，也越发清楚我自己的将来发展的目标以及方向。
本论文在王祎老师的严格指导下所完成，从题目的选取、设计的推进以及论文的撰写修改都离不开老师的悉心指导。
首先我，最要感谢是这4年来对我悉心指导的所有老师，感谢她们在课堂、在工作室教我如何做产品，她们严谨的授课态度以及提供给我的宝贵意见让我对自己未来的人生计划有了一定的规划。
其次，我要感谢我的室友，他们是我背后的护盾，感谢他们这一路对我的关心以及理解，给予了我源源不断的设计技巧。还要感谢我的家人，给予了我一个美好、温暖的成长环境，可以让我专心推进自己的梦想，给了我不断奋斗的动力。
最后，再次感谢所有对我批评以及提出建议的所有老师和同学！
1、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“文章版权申述”（推荐），也可以打举报电话：18735597641(电话支持时间：9:00-18:30)。
2、网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友投稿，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务。
原创文章，作者：1158，如若转载，请注明出处：https://www.447766.cn/chachong/97080.html,
