学动效设计课程的心得体会

动效设计为本学期的专业课之一，通过学习了解到了动效设计。首先，什么是动效设计？动效设计是指通过图像、文字、音频等元素的动态变化来增强用户体验和传达信息的设计过程。动效设计可以应用于各种媒体和平台，包括网站、应用程序、电视广告等。

动效设计的目的是提供视觉上的吸引力，吸引用户的注意力，同时增强用户对界面的交互性和可用性。动效设计可以通过改变元素的大小、位置、颜色、形状等来引导用户注意，也可以通过动态的过渡和转换效果来提供更流畅的用户体验。

动效设计还可以用于传达信息和故事。例如，通过动画效果展示产品的功能和优势，或通过角色动画来讲述一个故事或传达一个观点。动效设计可以通过配合音频效果来增强表达效果，创造更丰富的感官体验。

在动效设计过程中，设计师需要考虑用户需求、品牌形象和目标市场。他们还需要了解设计原则和技术，以便有效地传达信息并创造出吸引人的动效效果。同时，设计师还需要与开发人员和其他团队成员紧密合作，确保动效设计的实施和集成顺利进行。

总的来说，动效设计是一种创造性的设计过程，通过动态元素的运动和变化来提高用户体验和传达信息。它在各种媒体和平台上都有广泛的应用，并对用户的参与和注意力起到重要的作用。

动效设计课程旨在教授学生如何使用动画来增强用户体验和传达信息。课程涵盖了动效设计的原理、技巧和工具，并通过实践项目帮助学生掌握动效设计的基本技能。

在课程中，学生将学习如何使用动画来增强用户界面的交互性，改善用户体验。他们将学习如何设计和创建流畅、自然的动画效果，以提高用户界面的可用性和吸引力。

课程还将介绍动效设计的原则和理论，如时间、空间、速度、延迟等。学生将学习如何运用这些原则来设计有效的动画，并如何在设计过程中考虑用户的感知和认知。

在课程的实践项目中，学生将有机会应用所学的动效设计技能。他们将设计和创建动画效果来展示产品功能、提供交互反馈或增加品牌的个性。

总之，动效设计课程将帮助学生掌握动画设计的基本原理和技术，以及如何运用它们来改善用户体验和传达信息。这门课程对于那些希望从事用户界面设计、交互设计或用户体验设计的学生来说是非常有用的

动效设计是一门非常有趣和创意的设计领域，它可以为用户界面和用户体验增加动态和生动的元素。在学习动效设计的过程中，我从中获得了以下几点心得：

1.熟悉设计软件和工具：学习动效设计需要掌握一些设计软件和工具，如Adobe After Effects、Principle等。这些工具可以帮助我们创建各种动画效果和交互效果。

2.学习基础动画原理：学习动效设计需要了解一些基础的动画原理，如关键帧动画、缓动函数、过渡效果等。这些原理可以帮助我们实现更加流畅和自然的动画效果。

3.观察和分析优秀的动效作品：学习动效设计需要不断观察和分析优秀的动效作品，如设计师的作品、网站和移动应用的动画效果等。通过观察和分析优秀的作品，我们可以学习到一些设计思路和技巧。

4.实践和尝试：学习动效设计需要不断实践和尝试，通过自己的实践和尝试，我们可以逐渐掌握动效设计的技能和方法。在实践的过程中，我们还可以发现和解决一些问题，提高我们的设计能力。

5.注重细节和用户体验：学习动效设计需要注重细节和用户体验。一个好的动效设计不仅要有流畅和美观的动画效果，还要考虑用户的感受和体验。因此，我们需要不断优化和改进我们的设计，以提供更好的用户体验。

总的来说，学习动效设计是一个不断实践和探索的过程。通过不断地学习和尝试，我们可以不断提高我们的动效设计能力，并创造出更好的用户界面和用户体验

为什么要做动效设计，当然是能够为产品带来价值才会去投入资源去做，那么带来的价值是什么？在大多数的认知里，动效能吸引用户的注意，那么自然能为产品带来点击或跳转等价值，但这仅仅是动效赋能产品价值中的其中一种，动效的意义针对产品和用整体可以分为两块：

其中很多因素是互动或者呈因果关系的，比如引导用户操作可以减少用户对产品的认知成本，提升产品易用性也变相提升了用户和产品的互动性，为产品注入活力也会让用户减少部分不可避免的不适感等等，两者是相辅相成的

举个简单的例子，POP 弹窗的设计大家都不会陌生，POP 弹窗的出现往往目的是为了引导用户点击跳转至新的模块，最终目标都是引导用户去点击弹窗上的行动点；上图示意的静态弹窗往往是市面上大部分弹窗的出现方式，很明显的对比下动态弹窗和行动点让人的点击欲望更强烈，固然结果自然是动态的点击率比静态的要好

动效的种类

动效的种类大致可以分为四种：转场类、展示类、引导类和反馈类。很多产品设计中我们最常见的往往是以这四类动效或衍伸的动效为主，下面给大家介绍不同种类动效的样式和意义

转场类

转场类动效用于页面层级的跳转或场景切换,帮助用户理解界面间的变化和层级关系，也让界面更加真实生动；避免页面场景的瞬间切换导致用户产生变化盲视（视觉刺激的突兀变化会阻止用户注意到新的信息）；简单来说就是在产品页面切换中让用户有一个心理预期，看到哪些东西变了，新增了哪些东西要注意的，而且整体切换看上去非常的丝滑舒适；经常用到的手法以缩放、透明度、旋转等平滑的效果为主，来搭建层级与层级间的关系和切换

展示类

展示类动效更多的如字面意思——常规场景用作展示，其目的是能够在第一时间吸引到用户的视觉，突出产品核心功能和特点，引导用户的视觉流向，去帮助用户更好的理解产品；主要在产品的KV版头、网页以及品牌传播等场景中出现

Driiible作者：Robert Berki

引导类

引导类动效底层逻辑为通过界面中某些元素的变化，拉开与不同的元素的视差，引导用户进行下一步操作，能够自然而然的聚焦用户视线，降低其他视觉元素的干扰，目的是帮助业务达成某个模块的KPI，或者引导用户相关的操作，产品中常见的就是新手引导、Toast提示等

反馈类

反馈类动效是在用户进行行为后及时给出相应的反馈，更多偏向于用户体验侧；底层逻辑是以视觉表现的形式传达给用户当前时下的操作反馈，给予用户一定的心理预期

Driiible作者：tubik

动效设计思维的建设

我们在产品设计中接手动效之前，除去明确的业务目标，（譬如业务明确某个模块进行动效制作：“我就要这个按钮动一动来提升CTR！”等此类情况）作为一名设计师应该建立一套完整的动效设计思维

以整个产品设计的周期细分下来，建立具体的动效设计思维是以「分析」>「执行」>「跟踪」为主要流程；前期通过分析业务逻辑和场景，通过了解动效设计背后的目的和商业策略；然后制定视觉稿和动效方案定稿，执行并且交付给程序猿小哥哥开发走查；最后通过数据验证沉淀并且制定一系列的规范

以产品思维看动效设计

以上建立了自己完善的动效设计思维，但仅仅是基于执行层面上的，只满足于产出很好的动效方案，但是作为一名设计师是远远不够的，我们应该带着产品思维去看待动效设计；产品思维涵盖面很广，涵盖了全局的思考性以及方方面面，所以动效设计要真正意义上的对产品产生价值，还是需要依附产品思维去做设计

动效的一致性

产品设计当中除了颜色、品牌等视觉层面的表达需要统一性外，动效也是需要有一致性的，只不过用户很难直观地从视觉上感知到，但是作为一款成熟的产品，强化用户对品牌产品的印象，动效的一致性是不可缺少的

纵观整个产品侧，可能部分模块无法清晰感知，但是只有确定了动效的一致性，才能使产品整体看起来更加统一和完整；比如TIM，在整个产品中统一了动效的形式和速率，以及贴合了产品品牌的表达，在整体的操作体验上有了关联和一致性，体现了动效设计对于产品来说真正的价值

规范&组件化

产品设计当中为了解决迭代、开发或者合作效率等问题，常常会制定一系列相对应的规范和建立组件库，动效也有相对应的规范和组件库，而在关系上规范和动效组件是制约产品动效一致性的。制定动效规范和组件的纬度分为：速率和时间

首先是速率，一般情况是使用软件和开发语言里自带默认的速率，比如常见的缓动、缓入缓出等，但有一些产品为了拉开差异化会自行定义速率的参数来表达，然后整个产品都遵循这个参数来制定动效；比如全局的参数定义，甚至能细化到 POP 动效的参数定义、点击态动效的参数定义等

其次就是时间，控制每一个模块的时间，包含内容的出现消失、什么时候该强化、什么时候循环或者静止，针对不同的场景划分进行统一规范，甚至可以制定相对应的模版，之后进行动效产出的时候，既保持了产品的一致性，也能提高工作上的效率

全局思考

设计服务行业，那么针对不同的行业需要考虑的点不仅仅是当下的场景，保持对产品全局的思考才能对动效设计有全新的认知；了解当下动效设计的「前置链路」、「当前行为」和「后置链路」，用户在唤醒动效前的动机是什么，为什么会触发动效的行为，触发动效之后用户想达到怎样的目的等要做全局的考量

正因为有了对产品的全局思考，才让当下产品越来越「人性化」，往往你只是做了第一步操作，就衍生出了后续的选项，让用户感到「省心省力」；动效只是这其中的一个环节，作用都是锦上添花的，所以更加说明全局思考的重要性；需要考虑到周期、成本、实现、用户行为、用户心理、是否真真确切要用到动效设计等等因素，最后才能敲定动效的设计策略