当前位置: 首页 > 图文教程 > 平面设计 > FireWorks > Fireworks动画制作:飞机和降落伞

FireWorks
Fireworks命令插件:Change Text Size
Fireworks CS3体验之Pages面板
Fireworks绘制打印机图标
实用Fireworks企业标识不扣图反白法
Fireworks打造质感金属锁图标
Fireworks CS3基础教程:切片和优化功能的运用
Fireworks快速简单打造网页“闪字”动画
Fireworks打造逼真梵高之光特效
Fireworks轻松打造质感Vista LOGO
Fireworks教程:打造一个没有钨丝的灯泡
用Fireworks 8的位图工具打造精美网页效果图
疯狂的补间&元件&路径 制作仿3D光亮DNA桌面(试用版)
Fireworks CS3教程:蒙版的运用基础
网页设计翻译教程:图标缩小后变形的解决办法
fireworks教程:用笔触绘制“毁灭顶峰”效果
Firework教程:教你制作特殊的切角图形
Firework教程:韩式风格手提袋的绘制
Firewoks教程:制作液体金属表面文字效果
Fireworks教程:电视雪花动画效果的制作
Fireworks教程:制作一个简单的网页新闻播报框

FireWorks 中的 Fireworks动画制作:飞机和降落伞


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-22   浏览: 47 ::
收藏到网摘: n/a

 

  今天我们来学习用Fireworks制作一个精彩的动画,从这个例子中我们可以学习套索工具的使用和外部图像的输入方法,同时你还会实际接触到动画制作必不可少的概念如Layer(层)、Frame(帧)、Symbol(符号)和Instance(引用),以及如何合理地使用它们。

  为了使动画看起来更加真实,我们采用飞机和降落伞的照片作为素材,如果你能仔细地按照下面的方法操作,就能做出和本例一样近似于电影画面的精彩动画。


  第一步:导入飞机图片并去掉背景。打开一个新文件,Width=250,Hight=120,背景色为#0066FF。选择File > Import(导入外部文件),在目录中选择飞机的照片(本例使用的照片已事先调整好大小,为GIF格式),如图1。在工具箱中选择套索工具的Polygon Lasso,用鼠标细心地沿着飞机的外部轮廓一小段连着一小段地选取, 当选取的路径首位相连时,击下鼠标左键,轮廓线变为虚线,如图2。然后在主菜单中选择Edit > Cut,就把选取的飞机图像剪下并存入剪贴板中,再选择Edit > Deselect,Edit > Clear,清除掉剪下以后剩余不要的照片。

图 1 导入飞机图片
图 2 使用套索去掉背景
  第二步:把飞机图像变为Symbol。选择主菜单的Edit > Paste,就把刚才剪下的飞机图像拷贝到了画板上。点击一下飞机图像,选择Modify > Group,再选择Insert > Convert To Symbol,把飞机图像变为一个符号,在出现的对话框中,Name栏输入一个名字,如Plane(不要输入中文名),Type选择Graphic,如图3,再点击OK,就把飞机图像变成了一个Symbol(符号)。选择Edit > Clone,克隆出一个飞机的Instance,把新的飞机拉到上面一些,再选中原来的(第一个)飞机,选择工具箱中的Trasform按钮,拖动出现在第一个飞机周围的方框角上的小方块,把它调到较小,再把克隆出的(第二个)飞机拖到左上方画板边沿以外的位置,按着Shift键,把两个飞机都选中,如图4所示。

图 3 符号属性设置
图 4 同时选中符号和引用

  第三步:让飞机飞起来。选择Modify > Symbol > Tween Instances,在出现的对话框中,Step栏改为20,表示飞机从右下方飞到左上方的过程要用到20帧,勾上下面的小方框,如图5,点击OK。选择Window > Frames,打开帧面板,出现了一个有22行的帧编辑框,按着Shift键把他们全部选中,点击帧面板右上角的小三角形,选择Properties,在出现的对话框中把20改为10,使每一帧的播放时间由0.2秒变为0.1秒,再勾上下面的小方框,如图6。在帧面板的任意位置点一下鼠标,飞机的动画就完成了。按下屏幕右下角的播放键看一看,你会看到飞机由远处飞来,飞得越近就显得越大,最后从画面的左上方飞出。

图 5 动画的帧数设置
图 6 每帧的时间设置