基于用户体验设计中的微交互设计应用研究

2021-11-28 13:09刘佳琪
科技与创新 2021年16期
关键词:界面设计界面动画

刘佳琪

(武汉文理学院,湖北 武汉430080)

信息技术的发展为APP中界面设计提供了强大的动力和技术支持,伴随着技术的发展与提高,移动端、网页端设计也作出了相应的顺势改变,其理念从功能至上到用户至上,更注重细节的描绘,风格从扁平化到3D立体化,颜色从纯色到纹理化,展示形式从静态到动静结合。在一次次改变创新中,人机交互就成了一门值得所有设计者和程序员思考与研究的学问,UI设计由此孕育而来,新的设计潮流也就顺势应运而生。如今,用户在数字空间里消费越来越多的学习内容,在碎片化的时间里获取信息来源,导致用户不太喜欢阅读抓不到重点的内容和看起来毫无规律可循的文本内容,此时,微动画的出现让信息变得更为直白,界面变得更为自然。

1 微交互概述

微交互是指通常关注于单个事件或者单个任务,这些交互元素遍布于整个APP的各个角落[1]。这些微交互存在的目的是让用户感觉顺畅、愉悦,设计师借此创造出吸引人或者令人高兴的瞬间,或者说,让用户在这一刻感受到人性化。在应该要做和即将发生的内容处,利用动态效果引起用户的注意,创建出流畅、轻视觉的转场效果,达到可以指导用户进行复杂的操作,带给用户审美愉悦感的效果。在UI/UX设计中,很多设计都是可以远程操控和虚拟,微交互设计的机制起到重复、强调、情感设计的目的,让用户参与其中,感受其中的乐趣,成为该APP的忠实用户,这三点正好与乔丹金字塔用户体验维度模型将体验分为三个维度——功能性、提示性与愉悦性要求相一致[2]。

1.1 重复

重复作为微交互设计的基础要求,通常只关注单个事件或任务,数字界面毕竟不是现实世界中真实的硬件机构,用户更多的借助交互过程中的即时视觉进行反馈,让用户确定完成了此项操作,从操作中得到视觉上的“认可”,从而强化了“确信感”,常见的案例通常是在按钮的交互设计上,通过改变按钮的颜色、外观、虚实,达到完成动作捕捉的目的。用户首次与微交互进行交互时,心情和需求应该不会与往后保持一致。随着产品的不断迭代升级,微交互也应该作出相应的改变与调整,此时重复的就只有功能、视觉方面需要作出改变,以便更好地吸引用户持续使用。

1.2 强调

强调作为微交互设计的细节之处,以帮助和刺激用户的行为。在互联网产品中往往可以通过视觉、听觉、触觉或是它们的组合来进行反馈[3]。通常场景下,满足三感即可给用户留下深刻印象,微交互设计作为界面设计中的自然部分,所有的内容都统一于一个主题,将所有微观和宏观的交互设计联系在一起,将动画化的对象不同状态之间转换,达到看起来平滑,传达信息准确的目的,常用的案例通常在提示弹窗中运用,通过红色的“大X”来警告错误,清晰有力的副本与微交互相结合,产生更大的提示效果。通过强调告诉用户做了什么,做错了什么,还需要做什么,正在做什么,结束了什么。

1.3 情感设计

真正的设计是要打动人的,它具有传递感情、勾起回忆、引起共鸣的作用,通过微交互设计中的小幽默、小惊喜,无论规模如何,都是将情绪反应带入用户体验的一种肯定方式,用户能更好地了解之前和当前的状态,使得应用有了“情绪”并同时增加了必要的细节,建立起产品和用户之间的情感纽带。例如在MailChimp中创建和发送电子邮件的网络服务,通过图形化的语言展现发件人的紧张与慎重,为用户在使用过程中增添了意想不到的幽默与积极性。微交互设计作为一种开放式互动经济形式,主要强调活动给用户带来独特的审美体验,在产品设计中所占比例将会越来越大,设计出更多符合用户心理需求的微交互设计,是未来微交互设计必然趋势。

2 基于用户体验的微交互设计设计原则

微交互设计最重要的因素是站在广大用户的角度上去思考产品,它们的存在是为了让用户拥有更好的用户体验。在设计上通常只关注单个事件或任务,通过细节的处理将普通的移动端设计成功地引起用户的注意。此时微交互设计不仅作为一种好玩、有趣的细节亮点,还成为引导新用户使用的切入口。通过微交互四大模型——触发、规则、反馈、模式和循环,达到引导用户积极参与,显示产品状态,提供错误提示,加强品牌形象的目的。提供完整反馈预防用户出错,与产品无缝交互,增强用户体验的效果。

2.1 一致性

微交互作为界面设计的一个小分支,可以插入到界面中的各种地方,但在设计上需与界面整体风格相一致,在主色、次色以及整体的色调、元素的尺寸大小和关系中保持一致,并且要足够引人注目。微交互设计的动态效果不是无缘由的,是有一定的目的性,是代表一个品牌的形象定位。它们需要在主题的基础上遵循规则和模式,正如语言有其调性,有其风格,微交互设计也应有其调性。例如微信在发送“生日快乐”文字信息的时候,双方聊天界面都会有“蛋糕”掉落,通过这一微动态,在不影响画面的整体效果的基础上调动情感和感官的体验,在不给用户带来不和谐和陌生的感觉的基础上,增加了画面的趣味性。

2.2 功能性

微交互设计在界面设计中不是独立的个体,而是存在于某个功能或某个应用场景之下的,利用动态设计表达操作之后的反馈,达到用户的使用目的,此时更适用KISS原则——微交互设计应该是小而简单的。微动态设计的存在并不影响整体的设计风格,作为设计细节丰富页面效果。比如在iOS系统中,用户按住某一个应用的图表时,手机系统会作出轻微的振动响应,通过振动提醒用户,界面中图标的左上角“X”的出现,也是提醒用户,可以做出下一步指令。当然也通过振感提醒用户,避免做出错误的指令。通过微交互设计提供感官反馈,让信息变得通俗易懂,使界面变得更加自然,辅助用户完成页面操作。

2.3 愉悦性

微交互设计除了建立在行为的基础上,也需要在体验中产生共鸣。现如今科技的进步,基于语音的微交互也渐渐出现在我们面前,用户开始期待移动端出现新的动画、动效和移动交互。我们甚至会对突然的“智能”感到惊讶,在环境、用户研究和设计中重复使用。从苹果公司开发的“Hey,Siri”,到现在小米公司开发的“小爱同学”,还有“Google Home”,在用户说完“hey,Google”后,设备会显示一个由四个点组成的动态画面,通过一种视觉反馈,传达给用户设备正在运行的状态,利用动态效果避免重复工作,导致系统死锁,用户对产品产生厌烦的情绪。

3 基于用户体验的微交互设计设计的方法

在经典的尼尔森十大启发式当中,“系统状态可见性”可以说是当今交互设计领域中,最为重要的原则之一。让用户对产品拥有知情权和一定的控制权,可增加一定的信任度,这也是启发式设计最为重要和吸引人的地方。微交互设计想要做到这一点就必须站在用户体验的基础上进行创作,探索用户、产品、环境之间的关系。

3.1 整合合理的组织信息

Jakob Nielsen提出了关于界面设计状态的启发,“系统应当在合理的时间里,通过合适的反馈来保持告知用户将要发生的事情[4]。”根据用户画像了解用户的行为习惯以及使用需求,对页面进行针对性的、人性化的设计,让用户使用起来更为方便高效。当信息特别烦琐时,可考虑信息图表的形式将数据可视化,将重点数据进行强化设计,对用户而言不仅把握了趋势,也把握了重点,找到交互行为和内容之间的关联性,节约用户时间,提升效率,为用户创造更为流畅的交互体验。

3.2 打造有意义的转场

微交互动画最基础的应用是转场。一般的动画内容仅仅会从一个状态到另一个状态,优秀的动画则是通过动画展现页面的连续性,通过共享内容建立起两种状态。著名的魔术师Dariel Fitzkee曾说:“魔法既身藏于细节,又体现于表演。”交互设计也是如此。最好的交互设计往往没有被用户注意到,用户已然习惯它们的存在,无缝衔接着用户与应用程序,为了更好地服务用户,每一个微交互设计都必须融入到整体设计当中,给用户带来乐趣和新奇点,不和谐和陌生的感觉会引发用户反感情绪。借助节日、活动等契机,预测用户行为,持续优化功能。在特殊的日子制造出符合用户需求的小惊喜,在不影响用户使用的基础上,对界面进行相应的颜色或元素替换,烘托气氛。给用户适当的提醒,通过细微的动画更能使用户集中注意力,传递出产品的人情味。

3.3 人性化设计

交互设计作为人与人、机器、系统和环境等交互行为的外在行为设计,通过揣摩用户,针对其用户画像的心理特征,设计出符合用户认知的模型[5]。而“微交互”设计的特性之一在于不断地节省用户时间,让产品更容易让用户接受。在用户体验的“短平快”效应中,从小细节处入手,更具有人性化地协助用户更好地完成任务。

4 总结

微交互设计必须满足长期使用的原则,避免用户长期使用后产生厌烦的情绪。这就要求设计者在制作微交互设计时,首先要了解用户,理清逻辑,将其前后逻辑步骤进行串联,了解不同情境下的操作顺序,站在用户角度上去思考,将复杂的应用数据和功能简化为相互联系的微交互设计。充当产品与用户相互沟通的桥梁,刺激不感兴趣的用户成为自己的忠实用户。

猜你喜欢
界面设计界面动画
Clifford hits the big screen
中医养生APP界面设计
“共享员工”平台界面设计
中国传统元素在界面设计中的应用
不同截面类型钢管RPC界面粘结性能对比研究
微重力下两相控温型储液器内气液界面仿真分析
国企党委前置研究的“四个界面”
我的动画梦
界面设计中的图形创意方法
动画总动员