基于移动端设备用户界面载入模式的情感化设计研究

张小娟 翟思贤

（山东工艺美术学院视觉传达设计学院，山东 济南 250399）

移动设备普及的时代，第五代移动通信技术的进步和新型通讯工具的发展带给移动设备用户界面设计更多的可能性。设计由关注产品功能、性能到更加关注用户体验和情感需求，文章在现有移动终端设备用户界面载入模式的基础上，对页面载入过程中移动用户的情感化需求进行了梳理，围绕页面载入模式的用户情感化需求及具体设计实现手法展开论述，探讨具体交互设计实践中的可行性界面设计策略和方法。

1 移动终端设备的页面载入模式

加载是人机沟通过程中，等待数据呈现和机器给予互动反馈的过程，加载的逻辑可以简化为：用户触发页面指令、页面向服务器发送请求、服务器接受请求并反馈数据、页面呈现。在这个过程中，用户仅参与触发指令操作，后台运行过程为用户不可视部分，这就易出现用户主观感知时间与实际运行时长的差距。Nielsen[1]提到，0.1 s 是让用户感受到系统在瞬间做出反应的极限，是用户可以即刻接受的显示结果，不需要任何附加反馈；1.0 s 是不会打断用户思路的极限，所以0.1～1.0 s 延迟，用户即便感受到流畅操作中增添了阻塞感，也并不需要设置任何特别的反馈形式；出现注意力分散的峰值是10 s，超出这个时间用户将希望在等待的同时可以执行其他任务，这个过程更需要给予用户预期反馈。移动终端设备中用户可视载入模式主要有两大类型：模态加载与非模态加载，见表1。

表1 移动终端设备的加载类型和使用场景

（1） 模态加载。模态加载内容需在全部加载完后呈现，过程会中止用户操作，也无法执行其他操作，迫使用户陷入等待状态。一般采用简单的图标或配合提示文字，模态加载方式缺乏人性化，易使用户陷入等待焦虑。

（2） 非模态加载。非模态加载只出现在需要获取数据更新的部分，其加载过程不影响用户对于该页面的其他内容操作，是对用户“可容忍等待时间”的有效应用。下拉刷新属于典型的非模态加载方式，用户手动更新内容，加载过程中会配合toast 提示完成加载提示，该类加载方式普遍适用于各种类型的APP 界面，其主要目的是更新、满足用户发现新内容的需求（图1）。

图1 模态加载和非模态加载。

2 人机界面交互过程中页面载入模式的情感化需求分析

Norman 在《情感化设计》中提到情绪体验的3 个层次，本能层、行为层与反思层[2]49-70。本能层更注重产品给予用户的第一感觉，如漂亮的外形设计引人瞩目；行为层注重产品使用过程中带来的乐趣和效率；反思层则是用户结合自身体验和思考后，对物品产生回忆、情感及个人满意度等。特色是一款产品独一无二的“性格”，无法避免的加载界面可以作为体现自身品牌特色的环节，将加载过程中的视觉张力强化、图形动态化或嵌入游戏化机制赋予加载过程趣味性，让用户具有更强代入感的同时，会减缓用户对于时间流逝的感知与舒缓情绪焦虑。情感体验是指用户操作产品时所产生的情感，通过与用户的沟通调动用户的情绪，为用户带来积极、愉悦的个性化体验[3]。加载过程不应该被草率的“圆形旋转加载图标”代替，枯燥的加载环节也可以让用户眼前一亮。打破加载的模式化设计，通过趣味性手法满足用户对于情感化设计的需求，将用户注意力转移到新奇设计上去，避免用户因缺乏反馈而带来的等待焦虑。

2.1 人机界面交互过程中页面载入失败状态融入情感化设计的案例

Norman 在《设计心理学》中提到[2]15-19，设计师需要尽可能关注到可能出错的地方，考虑到计划也许不会按部就班地如期而至。在具体设计中，提示用户加载失败的状况，适当融入一些具有品牌特色形象表达或者积极性的趣味展现，是关注用户体验的表现。情感化设计关注人的物质与精神需求，可以充分缓解用户与屏幕交互失败的挫败感，也可以调节消极体验，特别是基于时间消耗之后的加载失败尤其需要情感化设计。“哔哩哔哩动画”加载失败界面中体现出的情感化设计值得参考，图2（a）中的Web页面形式是早期“哔哩哔哩动画”关注用户情感化需求的设计体现。页面左下角通过具体动态文字来表示加载进程，右上角通过富有趣味性的“颜文字”和俏皮的话语来展现加载失败原因，对得知加载失败结果的用户合理安慰，用户需要沟通来得知本身并没有被冷落，暖心的设计会冲淡对加载失败所造成的负面情绪，这是关注人本身感受和情感需求的智慧[4]。

图2 “哔哩哔哩动画”载入失败案例示意。

图2 （b）是手机应用APP 页面，通过两个卡通形象来体现加载过程，符合“哔哩哔哩动画”的自身品牌形象。以两个卡通形象的动作作为加载动画，积极给予用户页面加载状态的反馈，在加载过程中，两个卡通形象是站立状态，告知用户正在飞速运转中，加载失败时，卡通形象的动作也会发生变化，他们会作出面部朝下的卧倒状态看上去像是在表示歉意，并配合文字告知用户加载失败的具体原因，帮助用户明确问题所在[5]，以便做出相应的行动措施。

关注用户情感需求，给予用户“温暖”的回应。“故事性”设计更具吸引力，往往能激发用户好奇心。加载如同反馈，用户与界面的每一次互动都是一次交流沟通的过程，设想现实中人与人之间的对话，长篇大论换来一片沉默，演讲者定会在瞬间体会到挫败感和失落感。情感是互通的，在人机交互上也是如此，交互设计是一种特殊的互动，注重人文关怀而不是仅停留在形式设计上，通过设计拉近人机距离[6]，设计的表达方式要更加人性化和情感化。

2.2 马斯洛需求层次理论中的情感化体现

马斯洛需求层次理论[7]将人类需求像阶梯一样排列出8 种需求系统：生理的需要、安全需要、归属和爱的需求、尊重的需要、认知需求、审美需求、自我实现的需要、超越需要，见图3。位于高层次的“生长需求”包括“认知需求”“审美需求”“自我实现需求”等，它们不同于基础生理需求可以通过直观方式获得满足，是由社会条件、经济条件以及政治条件等多元条件下的需求共同构建起来的。需要更多情感化元素融入的交互设计，形成结合情感化设计的用户体验模式，是当下设计迫切所需的[8]。

图3 马斯洛需求层次理论金字塔。

（1） 功能性原则。就像是人对于食物、水、空气等方面的生理需求，用户对产品的基本需求体现在对产品本身的功能性上，这是用户在选择符合自身情感需求之前的最基本的前提，高级需要的出现前提是必须先满足部分低级需要，不能因为注重情感需求而忽视产品最基本的功能性要求，否则将忽视交互设计产品本身的完整性，产品的基本功能设置永远是产品成立的第一步，只有在用户研究的基础上确立核心功能和基础功能，才有研究如何进一步提升产品用户体验设计的基础。

（2） 同感性原则。在满足最基本的功能性原则之后，则要进一步考虑用户需求以制造更多产品优势，不同产品可以满足用户一种或者多种的需求层次，结合“生长需求层次”进行审美、价值、认知等不同情感元素的融入，更有目的性和针对性地满足用户需求。比如一张纸，用户对于它的功能需求就是能够在纸上记录文字或者图画等内容，但因为纸的材质不同会有不同程度的问题。例如：有的纸很薄，写起来容易破损或者渗透；有的纸色泽不好，长时间用眼会使眼睛疲惫。为了改善这些问题和迎合人们对于舒适健康环保的情感因素，于是市面上产生了各种各样的纸，甚至针对特殊的纸张还搭配特定的笔，这些都是在人们的需求之下而衍生出来的产品，也正是因为情感化元素的融入，设计才能更好地为用户服务。

（3） 趣味性原则。“生长需求层次”是马斯洛需求层次中较高级需求，这一部分不仅要满足用户对于“尊重需求”“归属与爱的需求”“安全需求”“生理需求”，更要进一步满足用户对于审美、价值、认知的追求。人们对产品的需求在于产品本身所赋予的情感价值理念，摆脱了对于产品功能本身的单一需求。趣味性设计可以直接带给用户乐趣和愉悦。例如，以击鼓动效助力进度条加速，可以调动用户参与热情、提高互动率。趣味情节与内容的呈现方式中融入个性化、趣味性元素或故事性元素，可以触发用户的回忆，从而建立情感连接和意义共鸣影响用户情绪，故事性、趣味性、游戏化的动效设计会唤醒兴奋情绪，激发用户好奇心与兴趣，增强用户的参与感和互动性，提升用户的满意度和愉悦感。

总结马斯洛在《Religions, Values, and Peak-Experiences》中的分析，单一满足用户对于使用功能的需求已经不足以满足用户对于更高层次需求的现状，认知、审美等高层次的需求也进一步推动设计发展。如果说基础设计满足用户对于功能的需求，那么情感化设计便对应着更高层次的需求部分。人工智能下的人机交互，智能语音助手可以根据用户提问内容，用玩笑或是笑话的形式回答用户问题。它们逐渐融入情感化元素，可以通过模仿，用人的话语节奏和语气，更为人性化和趣味性地与用户互动。这无疑会提升用户使用体验甚至是产品的使用率，同时还满足了用户情感化需求，能够让用户产生情感上的共鸣，总体上提升产品的交互体验设计。而这些改善人工智能交互的策略是趣味性基于情感化设计理论的具体实施方法。

3 载入模式的情感化设计策略

以下为载入模式的情感化设计策略内容（图4）：

图4 载入模式的情感化设计策略。

3.1 趣味性与信息性融合

（1） 提供趣味化概念加载模型。通过设置概念模型，有效地引导用户明确实现目标和期望，迅速、准确地供信息反馈，适当融入情趣性设计元素，具多感官、游戏化[9]、趣味性，调动用户感知、认知与情感，创建积极的用户体验[10]。线下的餐饮行业会在顾客等待时赠以零食和饮品，确保顾客不会因为基本需求而导致愉悦感丧失。在以移动终端设备为媒介的APP 设计中，贴心的设计和有效的反馈也是好服务的一部分。设计要符合科学的精确和简洁，同时更多是将人的情感和生活联系在一起后的用心注入。打破固有加载模式展示更多的可能性，如将普通的线型进度条通过更为丰富的视觉表现形式呈现，可以将IP 形象融入线型进度条中奔跑，尝试更多富有创意和智慧的动态效果，取消千篇一律随处可见的加载符号或者单调的提示文字，形成包含情感和智慧的精致加载。趣味性事物可以吸引转移用户对于时间感知程度[11]，新鲜感的视觉设计能够有效地避免在执行单一的加载过程时用户消极情绪激增，促进用户“流”状态的发展和维持[12]。

（2） 等待合理化或超越期待。促进人机交互沟通合理有效，明确适当的等待是用户不可避免的环节，载入模式的解释和反馈作用需要让用户有效地理解正在运行的后台行为，提高用户可接受范围内的容忍度。峰值理论指出，决定人们对某项体验的记忆取决于高峰与结束时的感受，该理论意在指出，要想人们对于某项体验的整体感受呈现愉悦，务必需重视用户在高峰与结束时的感受。这也为页面载入状态用户的等待提供了有意义的经验，有助于化苦恼的等待为积极的情绪体验，如图5 所示。

图5 趣味进度条载入。

3.2 创新互动方式

（1） 让人们保持忙碌。Norman[13]在《设计心理学》中提到“排队等待的6 个原则之一——让人们保持忙碌”，该策略便是由此展开思考。嵌入游戏机制，如通过“助力按键”方式让用户的手指忙碌起来，用户点击会得到相应的反馈，将情感通过设计元素具象化，内容可以是触发动态化效果，反馈信息可以是加速成功等，用游戏化应对焦虑情绪分散用户时间感知。如此像是迂回战术的设计，在博得用户一笑的同时可减少用户对于等待时间的心理感知，将被动的等待转换成主动参与。助力按键赋予载入模式游戏化，设计让用户保持连贯一致的操作感，而不是将用户置身事外[14]，有效地避免了“画面动不了，用户无事可做”的痛点，强化交互体验，以争取到更多的加载时间。

（2） 对体验进行设计[15]。根据Nielsen 提出的对于“用户容许计算机响应时间总结”可知，载入模式的连贯性是创造用户愉悦感的关键。用户情感赋予体验色彩，情绪上的影响给予设计反思，以用户体验为设计出发点、人性化的设计、情感化的体现。设计注重人与机器之间的情感交流，实现人的自我价值认同，设计应更加具有实用性并能够适应用户多样性需求。可以通过调节或触发的方式带给用户更良好的情绪体验。考虑用户在交互场景中已有的情绪感受，以此调节消除消极情绪或强化积极情绪。

3.3 多感官通道设计

（1） 情景化融入。加载是无可避免的时间，消费者的愉悦感是必要的感性需求。把注意力集中在用户知觉上的多样化乐趣等认知需求，让用户感受到品牌亲和力，满足用户追求新颖刺激和多样化的感受。通过情景化环境带入，有目的性地将品牌形象渗透在内，促进品牌概念与形象的深层融合，用户会更愿意将某些产品与产生愉悦情绪的品牌形象相联系，激发用户对品牌的认知好感，提升品牌整体印象价值，形成反思层设计且与用户建立长期的情感维持，加强品牌认知度，开拓品牌产品附加值。

（2） 从视觉、听觉入手的个性化元素。创意性让互动方式更具体验感。用户对个性表达、思想表达的需求日渐提升，在个人物品、服装、家居、软件等生活的每一部分都应关注商品对个人特色的呈现与传递。马克·纽森常常通过鱼类尤其是深海鱼寻找产品灵感，苹果鼠标的创意实则源于一滴水。战斗机的设计故事是设计师看到鸟在天空翱翔，就知道他要制造的新战机不是将各组件连接在一起，而是全新构造的设计。设计背后的故事是隐藏在产品背后的个性化价值体现，体现设计师思想和情感的也是提升品牌形象的关键竞争力。

3.4 给予退出加载选项

人为差错往往来源于糟糕的设计,在进行无法避免的正常加载过程中，基于用户心理需求，应当给予用户选择退出的权利。“取消”选项便是尊重用户选择权的体现。设计明确最长加载时间，比如Nielsen 总结容许计算机响应时间中提到的致使注意力分散的峰值是10 s，规定10 s 为加载时长限度，超出既定时间则视为异常状态，需及时给予用户异常状态反馈。考虑到更为广泛的用户群体要面对不同性格的用户，在面对仿佛瘫痪的加载界面时，用户可以选择继续等待，也有权一键结束漫长的加载。

4 结论

用户认知、审美等高层次的需求不断推动设计发展，过渡自然顺滑，目标明确、实用且美观是多数用户对于载入模式的基本期待。根据Nielsen 对于用户容许计算机响应时间的总结，10 s 是用户注意力集中在对话上的极限，载入模式作为承上启下的部分，如果上下衔接不畅，用户还得不到任何安慰性或者预期性反馈信息，毫无疑问会严重影响用户体验感。通过用户对载入模式的情感化需求分析，总结移动终端设备APP 载入模式的具体案例和马斯洛需求层次理论中的情感化体现，由此探讨载入模式的情感化设计策略和可行性方案。趣味性与信息性融合，设计为用户提供趣味化概念加载模型，辅助用户了解加载状况，有效反馈信息内容；等待合理化或超越期待，让用户感受等待是可以被容忍的，等待是值得被期待的，为用户提供一个等待意义，有助于将枯燥的等待转变为积极的体验。创新互动的方式，嵌入游戏机制让人们保持忙碌，人们对于时间和距离的心理感受由心理因素决定，等待赋予趣味，等待便不是一个沉闷的过程；对体验进行设计，关注用户需求，激发和确保用户积极的体验情绪。进行多感官通道设计，情景化融入和挖掘个性化元素，设计策略上从多感官入手给予用户积极情绪体验，在设计中给予用户退出加载选项，保障用户有自我选择需要的同时，增强用户的被尊重感。移动终端设备页面的载入模式在设计实践中，可以根据需要选择模态加载和非模态加载，并将可行性策略融入载入模式以增强用户体验。