免費論壇 繁體 | 簡體
Sclub交友聊天~加入聊天室當版主
分享
返回列表 发帖

新手教程:做投篮动画~

最近忙着店里的事情,很少上论坛。(其实是压根就没怎么上论坛。)
  今天难得把FLASH装了,那就做个动画给大家看,希望能给刚开始学FLASH的人一点帮助。

  今天要做的动画是“投篮”。主要学习的是引导层的概念。
  那么,下面开始。

  1:新建文档
  
1.jpg
2014-6-20 13:30

  2:我暂时没有想好要做几层,所以先新建1个图层,并且命名为“背景”“动画”。请注意图层顺序!
  
2.jpg
2014-6-20 13:32

  3:新建图形元件。
  
3.jpg
2014-6-20 13:34

  
4.jpg
2014-6-20 13:34

  4:绘制背景,在绘制的时候请把图层设置好了,并且修改图层名称!(这里我就不多画了。大家将就看吧)
  
5.jpg
2014-6-20 13:40

  在绘制的时候建议把不用的图层锁起来。
  
6.jpg
2014-6-20 13:40

  线稿层顾名思义就是线稿,绘画的时候将填充关闭
  
7.jpg
2014-6-20 13:42

  提供一下我的绘画参数
  
8.jpg
2014-6-20 13:43

  渣画技,可以不用在意这些细节的。。。。
  
9.jpg
2014-6-20 14:13

  5:画完线稿后将线稿全部框选起来,复制。点击颜色层,按ctrl+shift+V 将线稿复制到相同的位置。然后在颜色层填充颜色,最后框选全部区域,去掉线框。
  
11.jpg
2014-6-20 14:30

  
12.jpg
2014-6-20 14:30

  这里把图层调整一下位置,把线稿层放到最上面。如图:
  
13.jpg
2014-6-20 14:30

  继续绘制阴影
  
14.jpg
2014-6-20 14:38

  其他的就随便画了。懒得画太多了。。。
  6:返回场景,将画好的背景从库里拖入背景层中。
  
15.jpg
2014-6-20 14:40

  
16.jpg
2014-6-20 14:40

  将位置对其后锁定背景层
  
17.jpg
2014-6-20 14:41

  
  我想了下,投篮的时候,当球入筐的时候,篮网会产生互动,而且,篮网是在最上面的图层,这样在运动时才能遮挡住篮球。所以,在动画层上再新建篮网层。如图
  
18.jpg
2014-6-20 14:44

  所以,不需要多说,下一步是进行篮网篮筐的绘制。同样新建元件,不过是新建影片剪辑元件,因为这个篮网必须是会动的。SO,如图:
  
19.jpg
2014-6-20 14:51

  
20.jpg
2014-6-20 14:51

  放到合适的位置
  
21.jpg
2014-6-20 14:51

  
  7:开始绘制篮球
  绘制篮球应该不用多说,新建元件,影片剪辑图形元件都可以。
  
22.jpg
2014-6-20 15:00

  现在万事具备了。开始制作动画。
  
  首先按24帧每秒的动画来说,我想做个大概2秒左右的投篮动画,所以,基础帧数就是24X2=48帧。
  先做篮筐篮网的动画,我是这样想的,从篮球到篮筐大概1秒半的时间(我这样设置的),所以,篮筐动画从1秒半开始,也就是36帧开始。
  在篮筐篮网影片剪辑内,在地36帧的地方设置关键帧,由于篮球进过篮筐的时间较短,大概绘制个6帧左右的动画就好,36帧 37帧 38帧 39帧 40帧 41帧我采用单独绘制的方法(也可以使用补间动画,我就不多介绍了。)
  如图:
  我建立了六个关键帧,且全部动画长度48帧
  
24.jpg
2014-6-20 15:30

  
25.jpg
2014-6-20 15:31

  
26.jpg
2014-6-20 15:31

  然后回到场景内
  将篮球放入动画层(现在可以改为篮球层,反正你记得住是什么就行了。)
  
27.jpg
2014-6-20 15:33

  但是还不够,大家都知道,投篮是抛物线运动,如果使用补间动画的话,效果是直线,这样不科学!!!
  所以,我们要用到引导层来引导篮球进行抛物线运动
  在动画层上方建立新图层,绘制抛物线,为了让大家看的更清楚,我把背景隐藏起来了。
  
28.jpg
2014-6-20 15:59

  右键引导层,点选“引导层”
  
29.jpg
2014-6-20 15:39

  然后点住动画层(篮球层)将其拖到引导层下方,链接上。
  
33.jpg
2014-6-20 16:01

  到这一步基本难度就完了。在动画层第36帧的地方设置关键帧,在48帧的地方设置关键帧。其他图层在48帧的地方插入帧就行了。
  
30.jpg
2014-6-20 15:43

  选择篮球层第一帧,将篮球中心放在引导层的线的端点上
  
31.jpg
2014-6-20 15:52

  选择第36帧,将篮球放到篮筐中间
  
  然后在时间轴右键单击第一帧到36帧之间随意一帧,点击创建补间动画。
  
34.jpg
2014-6-20 16:02

  然后在最后一帧也就是48帧的地方将篮球拖到引导层线的最下端
  
35.jpg
2014-6-20 16:03

  同样,在时间轴36帧到48帧之间右键,创建补间动画
  
36.jpg
2014-6-20 16:05

  按Ctrl+enter 观看动画效果。基本动画制作到这结束。

  最后,吐槽一下,我发现2秒钟投篮太慢了。。最终动画我设置成48帧每秒才感觉正常。。原谅我,好久没做FLASH了,有点不会用了。大家有问题可以问我。
  放上动画成品: 投篮动画.rar (177.86 KB)
28.jpg
分享到: QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友

感谢楼主!非常有用!

TOP

返回列表