总听见有人说:“做设计要学会活学活用”,但如何才能活学活用,这才是问题的关键!
所以今天菜心就来用一个简单的水波纹动效和大家聊聊这个问题。
大纲如下:
1.水波纹的动效原理
2.我们学的不是水波纹
3.总结
1.水波纹的动效原理
之前我有发过一个水波纹扩散的动效:
但是没有讲解原理,今天我们先来说说这个动效的原理,如果你动效很厉害,可以直接跳过了。
做一个循环动效最关键的一点,就是开始和结束的状态是一摸一样的:
无论过程怎么变,你必须要保证这两个状态一样,这样才能无缝循环起来,这是第一个知识点。
那过程是如何变化的呢?
其实这个动效一共有四个圈,只是最开始的状态,最里面的小圈是全透明的:
为了让大家更容易理解,我们把这四个圆圈用序号来表示,从里到外为1、2、3、4:
接下来我们就可以分析,这个动效过程发生了什么?其实很简答,就是1变成了2,2变成了3,3变成了4,4变成了全透明。
也就是最后的状态,我们只能看见2、3、4了,而最开始的状态,我们也只能看见2、3、4(1是全透明的)。一个循环就这样诞生了。
至于1如何变成2,2如何变成3?其实变化的属性就只有大小和透明度,让两个圆的大小、透明度一样就ok了。
当然,做这个动效,还是需要有一些动效软件的基础(如AE),如果不会的话可以先明白原理,留着以后备用!
2.我们学的不是水波纹
这一部思考其实挺重要的,如果我们仅仅把这种动效局限于水波纹的效果,那以后用到的可能性就会大大减少,所以我们可以进一步将这个动效提炼一个关键词——扩散。
这样,能够用到扩散效果的地方就比较多了,例如,太阳光的扩散:
雷达信号的扩散:
再比如,水波纹扩散的效果不一定是圈圈,条形的波纹也一样可以实现:
动效的原理都是一样的。
总结
如果我们只学案例的表面,那永远都学不完,因为案例是无穷无尽的,但如果能思考总结案例背后的共性和原理,我们就可以举一反三,这样成长的速度必然会快出很多,而且这也是提高我们“透过现象看本质”的一种正确锻炼方法!
对嘛?