移动端UI交互式动效设计教学分析

吉袁媛

摘 要：移动端UI交互式动效设计是基于网络技术与移动终端诞生的一种新型设计手段，若是在大专院校中设置相应的课程，一方面可以革新教学方法，优化教学内容，调动学生的积极性和学习热情;另一方面可以满足互联网公司对交互式动效设计人才的不竭需求，提升用户的体验感。故此，本文对移动端UI交互式动效设计教学进行了浅显的分析。

关键词：移动端UI;交互式动效设计;教学实践

引 言

移动端UI是建立在用户与设备之间的桥梁。如今，深受用户喜爱的多种移动电子设备就是在移动端UI交互式动效设计的作用下实现信息传达，带给用户全新的体验，同时提升用户的黏性程度。对于日常的教学而言，不论是学校还是教师，都应重视UI交互式动效设计课程的开展与实施，在教学中要顺应移动互联网的发展趋势，运用多种教学方法进行授课。此外，为了保证学生后期就业，要求教师在教学中引导学生树立“以用户为中心”的意识，通过多种手段丰富学生的知识，拓宽他们的眼界，以促进学生创新能力、操作技能和综合素质的全面提升[1]。

1. UI交互式动效的简单介绍

材料设计语言（Material Design）认为：动效是以等同于动画的手法，赋予界面活力和生机，使其更具真实性与体验感[2]。通过对UI交互式动效的进一步研究，笔者依据自身的理解提出的观点如下：UI交互式设计是以界面元素为导向，设计精细且恰当的动态效果，指引用户操作，同时运用动态视觉化、相应触觉化等方式提高用户的操纵杆和代入感，以满足用户的多样化需求，为其带来良好的体验。

2.交互式动效设计的功能及分类

2.1交互式动效设计的功能。据了解，动效设计功能可分为两类，即操作功能和情感功能。其中，操作功能包括帮助引导、层级展现和使用反馈，引导用户对App的信息构建、界面元素之间的关系进行深入了解，其目的在于降低学习时间和学习成本，为用户提供便利的操作条件;情感功能包括流畅度、响应度和美观度。流畅度可降低用户因长时间等待而产生的焦虑感;响应度可强化用户的操纵感;美观度可强化用户代入感，增加用户体验。

2.2交互式动效设计的分类。首先，转场类。转场类动效适用于场景切换和层级跳转中，具有帮助用户理解界面间的变化和层级关系的作用;其次，展示类。通俗来讲，展示类动效就是产品的动态说明书，既可以帮助用户快速理解产品，又能保证其在短时间内可以灵活运用;再次，引导类。引导类动效可以通过界面中的元素变化，吸引用户的注意力，指导用户依据相应的提升步骤进行操作[3];最后，反馈类。系统的及时反馈会出现在用户通过交互触发界面行为时，依据用户的触发行为对相应的动态效果进行展示，其目的在于防止用户进行无意义的操作。

3.交互式动效设计教学应遵循的原则

3.1功能性。在进行交互式动效设计时，应关注动效功能，分析其存在的意义，同时要善于提出多种多样的问题，如设计移动端UI交互式动效的作用？如果替换成其他设计形式会出现何种情况？等。

3.2一致性。移动端UI交互式动效设计的一致性包括以下两点：（1）动效元素风格统一，为用户提供最佳状态;（2）動效节奏一致，确保产品中的动效元素有同样的时间、节奏和速度。在进行移动端UI交互式动效设计时唯有严格遵守一致性原则，才能缩短用户信息获取时间，帮助他们更好、更快地理解产品属性，从而强化用户的体验感。

3.3个性化。对于受众广泛的移动设备来说，独特的动效不仅可以防止产品雷同，在众多App中占据主导地位，还能吸引用户的注意力，提升其使用热情，同时形成品牌效应。比如说，因抖音所具有的视频短小精炼、功能丰富、易操作等优势，使其在众多的短视频社交软件中脱颖而出，并且享誉海外，即中国地区的“抖音短视频”和海外的“Tik Tok”。

3.4以用户为中心。移动端UI交互式动效设计时不仅要有明确的目标，还要具有较强的针对性，以交互出发，立足于客户的角度进行思考，如操作目的、操作习惯和视觉呈现效果等。当用户在使用移动设备时，能够产生自主控制的意识，并非根据机械化的跳转而达到自己的实际需求。

4.移动端UI交互式动效设计教学存在的弊端及解决对策

4.1移动端UI交互式动效设计教学存在的弊端。

（1）缺少对动效设计应有的重视。在资源、资金、人才等因素的影响下，使得移动端UI交互式动效设计只能停留在设计阶段，难以进行深入的渗透和实施[4]。此外，部分公司缺少对动效设计应有的重视，并未给予资金和人力上的支持，导致动效设计效果与预期目标存在较大的出入。在这种情况下，即便大专院校为相关企业输送优秀人才，也是无济于事。

（2）过度使用动效。据了解，部分教师在实际教学中，过于注重动效在移动应用中的运用，没有结合自身情况对动效进行研究，生搬硬套动效具有的功能，并未考虑用户体验、品牌延展性等。在这种教学理念引导下设计出的动效，非但无法吸引用户的注意力，还会使其产生厌烦心理。

（3）感官反馈有限。在现实世界中，人们可以通过自己的五官与事物进行交互，而在移动网络中，用户在操作应用时，触觉占据着较大的比重。但在实际发现，教师在教学中过于强调视觉上的冲击，忽视了触觉、听觉等方面的精细化处理，导致用户的体验感降低。

4.2移动端UI交互式动效设计教学中的对策。基于移动端UI交互式动效设计教学中存在的缺陷，教师应做到以下几点：首先，加强校企合作。大专院校的办学宗旨不仅仅是为学业不佳的学生提供学习的机会，还在于培养优秀的技术型人才，满足社会发展对人才的多样化需求[5]。对此，学校在开展移动端UI交互式动效设计课程时，应通过校企合作的方式加强与企业之间的联系，在企业的用人需求和自身发展所需的双重作用下合理设置课程内容，这样既可以提高企业对移动端UI交互式动效设计的重视程度，还能解决移动端UI交互式动效设计中存在的现实问题。其次，优化教学过程。移动端UI交互式动效设计课程的开展与实施中，教师除了要革新教学理念，注重理论与实践的双向教学外，还要优化教学过程，告知学生在动效设计中要遵循针对性、适应性等原则，同时要具备一定的意识，如创新意识，站在用户角度思考问题的意识等。此外，教师还应引导学生在设计时要注重触觉、视觉和听觉的立体享受，适当控制动效的数量与幅度，这样有助于提升产品质量，收获用户的目光和青睐。

5.结束语

综上所述，对于移动端UI交互式动效设计教学而言，若想逐步实现人才培养目标，除了要遵循功能性、一致性、个性化以及视用户为中心等原则外，还要追寻当前移动互联网的发展方向，正式教学中存在的问题和缺陷，并施以可行性的对策予以解决，只有这样才能提高教学质量与教学效果，促进学生综合素质与能力的提升，最终满足企业的用人所需，实现大专院校的长久发展。

参考文献

[1] 孟旭，郑晓慧.移动端UI交互式动效设计教学探究[J].中国多媒体与网络教学学报（上旬刊），2019，（07）：161-162.

[2] 周扬帆.构建《UI动效》课程教学资源库的研究[J].科技创新导报，2018，15（20）：210-211，213.

[3] 余晓瑜.移动智能终端中的动效设计原则和设计方法[J].工业设计研究，2018，（11）：434-439.

[4] 葛田.基于移动UI界面的交互式设计探索[J].电脑知识与技术，2019，15（09）：207-208.

[5] 白旭，罗小芳.基于移动终端的智能交互式课堂教学模式研究与实践[J].中国教育技术装备，2016，380（02）：19-21.