养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

[Flash动画教程]掉落的小球(2)

时间:2024-10-21 07:48:46

女徒弟天仿瓤僭蚋资聪慧,没有经过丝毫的指导,看着第一篇教程自己独立完成了那个效果的制作,最可怕的是她做的效果居然比我的还好,让我大感后生可畏。好徒朕如侗畅弟能催生出勤快的师傅,所以我决定写第二篇。上一篇我们做了一个小球掉落的动画:小球从高处掉落然后掉在地上被摔扁了。而真实的情况是这样的:小球掉下来,速度越来越快,到地面会反弹起来,然后继续掉落,反复多次后最终停在地面上。这个物理过程用运动学的思想解释就是小球下落时受到重力加速度影响而加速下降,反弹后受到重力加速度影响而减速上升,那最后停下来是因为掉落上升都有受到阻力,反弹有能量损失,最终停了;用能量学的角度解释就是重力势能转换成动能和弹性势能以及摩擦做功,能量一直相互转化,而损失一直叠加,最后消耗殆尽停了下来。以上都是高中物理学知识,设计高一下学期和高二的物理内容,不懂得同学可以回去翻翻书了。我们今天就是要模拟这个过程,旨在学习如果制作缓动效果和大小变形动画。

工具/原料

FlashCS5.5(我用这个版本,CS3以上都可以)

方法/步骤

1、打开上次那个小球动画文件,如下图所示,这个作品的效果是小球掉下来并且摔扁。

[Flash动画教程]掉落的小球(2)

2、在之前的基础上,我们首先要做的是让小球加速下降的效果。单击时间轴上的引导动画那个箭头任意部分,然后在属性面板(Ctrl+F3)找到“补间/缓动”这一项,将数值调成-100,然后ctrl+enter测试:

[Flash动画教程]掉落的小球(2)

3、是不是发现小球一开始速度较慢,最后加速下降到地面并且变形了?这就对了!

4、那么减速上升呢?有聪明的同学估计已经按捺粲茸锿枋不住抢答了:如果将“缓动”数值调成“100”,那么效果就是缓慢运动到终点,效果跟之前鹚兢尖睁的相反。但凡能提到这个答案的,我都赏他一朵小红花。回到时间轴,我们在20帧按下F6,插入一个关键帧,按下Q键,然后将这个小球变形到圆形。要想反弹,首先要返回原来状态嘛。

[Flash动画教程]掉落的小球(2)

5、在继续做反弹之前,我教大家拖一根辅助线,以方便我们设定位置,让小哆蚝馆填球回到原来的地方。按下Ctrl+Shift+Alt+R,打开标尺功能,回到第1帧,在上面的标尺上按住鼠番舸榆毛标拖出一根青色的线,此线名曰:辅助线,正好拖动到小球的下方,那么这根线的位置,就是小球的下方位置。

[Flash动画教程]掉落的小球(2)

6、我们继续在32帧按下F6,插入关键帧,按下V键,单击选中32帧这个小球,按住shift键,将其向上拖动,到达初始高度下方一个球高度的位置,因为有能量损失,所以它无法达到最初的高度,在20和32之间插入补间动画。

[Flash动画教程]掉落的小球(2)

7、Ctrl+Enter(下次不打这个命令了,直接说“发布”)发布影片,小球已经反弹了,但是下降的过程是加速的,反弹上升的过程很僵硬,因为是匀速的,不是减速的。

8、鼠标单击20和32帧之间的补间动画,在属性面板(Ctrl+F3)将“缓动”数值设成100,然后发布影片测试。

[Flash动画教程]掉落的小球(2)

9、是不是有点意思了?

[Flash动画教程]掉落的小球(2)

10、接下去我们要继续这部分掉落和上升的动画的重复操作,来实现多次掉落和反弹的效果,因为操作方法都一样,所以我不重复了,直接截图时间轴的最终效果,因为运动时间一次比一次少,所以补间动画的长度也越来越短。

[Flash动画教程]掉落的小球(2)

11、到此为止其实今天的任务已经基本完成了。不过好的老师都是要延伸学习内容的,虽然差学生很反感这一点,但是他没有选择:我决定做两个引申,一个是近大远小的大小变化,另一个是近处清楚远处模糊的颜色变化。

[Flash动画教程]掉落的小球(2)

12、在第一帧,我们单击选中小球,按下Ctrl+T打开自由变换面板,我们将小球的比例改成60%,发布测试一下,发现小球从小变大,似乎从高处掉下来的。

[Flash动画教程]掉落的小球(2)

13、按照上一步的方法,对于后面每一个在高处的关键帧的小球执行同样的操作,将小球的大小全部改小,然后发布测试,发现小球实现了高处掉落的变形效果:

[Flash动画教程]掉落的小球(2)

14、接下去我们做色彩清晰度变化,在第一帧选中小球水貔藻疽,在属性面板单击“色彩效果/样式”的下拉列表,选中alpha选项,(alpha鹚兢尖睁的英文意思是:透明度,不信你可以自己谷歌翻译)。我们将透明度调成60%,然后发布测试一下,发现小球第一个掉落时从透明变成不透明,从小变大,似乎从天空中掉下来似的。

[Flash动画教程]掉落的小球(2)

15、按照之前设置大小的作法,给每一个在高处的小球透明度都设成60%,然后发布测试:

[Flash动画教程]掉落的小球(2)

16、现在你忘掉制作过程,单纯观察这个动画效果,想象一下从高处掉下的一个小球。最主要的是,这个动画效果是你自己做的,恭喜!

© 一点知识