UI设计 动效设计12大法则 动效设计12大法则.docx

动效设计12大法则 【项目目标】 1. 知识目标 （1）了解手机动效制作的挤压与拉伸法则。 （2）了解手机动效制作的布局及呈现方式法则。 （3）了解手机动效制作的跟随动作与重叠动作法则。 （4）了解手机动效制作的最美的弧线运动和次要动作的重要价值法则。 （5）了解手机动效制作的控制时间节奏和夸张惊喜法则。 （6）了解手机动效制作的动画的吸引力和设计技巧法则。 （7）了解手机动效制作的动画的运动纵深和平衡与重量感法则。 2. 能力目标 能理解手机动效制作的12个法则。 能运用手机动效制作的12个法则设计自己的手机动效。 3. 素质目标 培养学习者初步的手机动效的设计思维，增强学习者对手机动效设计的认知，提升学习者的动态设计素养。 首先来给大家介绍一下关于十二法则的出处，十二法则其实是源于这一本书，这本书是迪士尼九大元老联合写的这么一本动画的书，叫做《生命的幻象》，不管是有没有生命，但是只要是有动画，一定会用到这十二法则，我们先向这些老前辈做一个致敬，然后我们开始法则。 挤压与拉伸法则 首先第一条挤压拉伸，听起来这个名字好像是个挺怪的东西，好像怎么就挤压了怎么就拉伸了，我们经常看一些快速奔跑的画面时候，在在第一帧的时候会有瞬间的拉伸，而且拉伸的幅度大的超乎想象，然后再弹回来，但是你连续播放的时候你会发现这感觉挺爽的，那么这就是拉伸的规律，当我们使用它的时候，其实我们要注意几个点，第一，挤压拉伸它是发生在瞬间的，非常的快，如果它发生的时间很长，那么这个感觉就会变得很差，大家可以想象一下，一个小球或者说一个图标落到地上突然啪，变成一滩，然后再等了十几帧之后再慢慢弹起来，那个感觉就没有弹性了，也就是说它的持续时间变得太长了，所以挤压拉伸一定是发生在非常短的时间里面，才会产生弹性，让你觉得是个瞬间的，才会产生力量。第二，它还可以模拟运动模糊，第三就是它体现的是能量与弹性的变化，体现的是力量的感觉，这三点一定要注意，瞬间的，模拟运动模糊，还可以产生力量。 二．预备动作法则 接下来我们来看看预备动作法则，那么在十二法则里面只要排在前面的都是我们用的最多最常用的一些法则，第二条叫做预备动作，啥叫预备动作，很简单，比如说我要扇某个人一个巴掌，那么首先我得把手抬起来，然后我得扇，扇完了以后我的手还得停下来，所以一说到预备动作其实包括三部分：第一预备，告诉观众要做什么，展示预期。这包括预期的时间与动作幅度，观众的心理时间契合。第二动作，告诉观众做了什么。动作可以很快，但是不能没有预备。第三缓冲，告诉观众动作做完了。缓冲是释放动作残余能量，是动作收尾部分。 三．布局法则 布局原理的运用，其实是考查你，对整体设计的一个高度，如果你有很好的布局观念的话，其实你具有了总监的素质，你可以指导整个团队去制作一个非常吸进人的画面，能够让观众一眼就看到，你产品的核心部分在哪。布局包括以下四个方面的能力，第一，画面构图，以及视觉核心引导的设计。第二，角色的形象和性格的设计。第三，表演的舞台调度，以及观众注意力的引导。第四，前期设计的所有工作都是为了布一个超大的局，吸引观众。 四．呈现方式法则 当我们做一个比较复杂的动画的时候，你先做个最大几个运动幅度，然后，你再中间插入新的关键帧，然后运用我们软件里面洋葱皮的功能去检视整个动画的效果，最终完成整个动画的动态，这样你的动画的细节，清晰度，还有这种效率都得到了最大保证，而且得到最好的效果。迪士尼动画师将原画与中间张都绘画出来，对于关键帧与中间张都加以控制，这就是逐张动画法和关键张动画法的结合，这种制作方法是比较优化的制作方法，主要有以下优点，第一，结构清晰的原动画法与自然流畅的逐张画法的有机结合。第二，按部就班与自由发挥的平衡，冷静与热情的平衡。 五．跟随动作与重叠动作法则 我们来看一下跟随动作和重叠动作的规律。所谓的重叠，比如我们的手在运动的时候,比如说我在画面里面速度很快，我手直接过来了，那你手直接过来的时候其实是很僵硬的，如果你能让一部分先动另外一部分在动，也就是说我的根部先运动，梢部在运动，这样你的运动就显得柔软一点看起来更漂亮，这就是重叠。那么跟随是什么意思呢，跟随就是当你物体运动运动的时候其它的部分会跟在后边，那我们想一想其实有点像辫子、尾巴、或者是绳子比较柔软的物体，运动总是一部分先动，然后带动其他部分运动，也就是动者衡动，静者衡静。总结来说，运动的时候，运动总是一部分先运动，然后带动其他部分运动。运动之间有带动关系，总是一部分带动其他部分跟随运动。 六．渐快与渐慢的法则 我们来看渐慢与渐慢的法则，这个原理叫做slow-in、slow-out，或者说叫慢入和慢出，渐入和渐出。最明显的一个案例就是钟摆，当你看到钟摆的时候，钟摆的两端会比较慢，中间会比较快，那这样的运动看起来会比较舒适，那么这一条原理其实告诉我们