fireworks透视动画制作

  大家看看下面的动画,用fw如何制作?请看……

  第一步:进入fw工作环境,新建文件,背景色自定。我们首先要做上部的动画。选择菜单项"insert --> new symbol",在弹出的对话框中,选择"animation"选项。
  第二步:编辑该symbol。在symbol的编辑区首先画出一个正圆(配合shift键),clone它(复制-->粘贴也可以),一共做出8个圆;然后如下图所示将这八个圆均匀环形排布,你可以先做一个圆不要填充色只要描边色,来作为均匀排布八个圆的辅助线。这一步一定要细致,因为将来形成的动画的细致程度如何,这一步影响很大。将八个园均匀的排列在圆形辅助线上,(园的数目越多,平滑度越好,当然生成的文件也就越大)。最终效果如左图所示<--(记得最后把辅助线删除)

  第三步、将这个调整好的symbol拖到舞台上(也就是主编辑窗口),然后用自由缩放、旋转工具将该symbol做相应的变形处理,使得其空间感强烈些……你可以自由处理啊!也可以参考下图的调整形式。

  第四步、选中变形后的symbol,然后选择菜单项的"modify-->animate-->settings";

  接着就会弹出下图的对话框,这里就是我们要设定动画的具体选项设置了!

  下面我们一一来说明各项的具体含义:
  frames:数值也就是你的动画所要生成的影桢数目;
  move:就是你的动画移动的像素值;
  direction:配合你的move值来决定move的方向;
  scale to:动画缩放比例,产生由大变小,由小变大的动画效果;
  opacity:不透明度,可以生成渐隐渐现效果,或者相反的效果;
  rotate:动画旋转角度,cw是顺时针,ccw是逆时针旋转;
  明白了各项的含义,我们的动画制作起来就简单多了……各项的设置如下:"frames:13";"rotate:170"。其他的各项不作调整。
  第五步、设定完成后ok!会弹出下图对话框,ok即可!好了,现在你可以点击快捷工具栏的播放按钮来看看你的动画效果了!

  补充介绍:除了上述方法来设定动画,还可以通过浮动面板中的object面板来做相应调整,具体不做赘述!

  第六步、做通过透视产生的阴影的动画。
  当然你可以按照上面的方法再新建一个symbol——重新画一个浅色的圆,然后沿园环排列,然后把这个symbol拖到舞台,设定,做成阴影动画……
  但是实际上我们没有必要再次新建一个symbol,我们还是使用刚才的symbol就可以啦,还是在第一帧插入symbol,然后通过自由缩放、旋转工具调整它的形状,直到你满意为止!然后将它放到适当的位置,最后设置动画选项:还是通过"modify-->animate-->settings"或者"object"面板选项来具体设定,"frames:13";"rotation:173";"opacity: 38 to 38" 在这里我们将其opacity选项进行了设定,将其透明度做了调整,这样也就是我们所需要那种阴影效果啦……ok!!第一桢的具体设定如下图:

  补充说明:产生阴影效果的方法,除了调整opacity选项之外,还可通过调整layer面板的opacity来改变透明度;还有可以通过"effect-->adjust color-->hue/saturation"来做调整。
  第七步、保存,输出动画,记得格式要选择 animated gif。好了,一切完工了,不是很复杂吧……呵呵!这里有png格式的源文件(38k),有不明白的地方,大家可以到留言板留言……
png格式的源文件
  后记:想来想去还是用flash做了一个同样的效果,感觉不如fw做的出色,至少目前flash还没有出现针对这种透视动画处理的很好的方法……有兴趣的朋友可以看看源文件 这里(23k)!下面是flash做的动画效果。

Flash源文件下载

时间: 2024-10-30 07:54:36

fireworks透视动画制作的相关文章

Fireworks礼花动画制作教程学习

  Fireworks 不仅具备编辑矢量图形与位图图像的灵活性, 还提供了一个预先构建资源的公用库,本教程是关于Fireworks礼花动画制作教程的讲解,该文章中包括动画制作的8个步骤,以下请看正文: 1. 新建一文档,画布大小为 200 * 200,底色为黑(#000000). 2.用画圆工具画一个圆形,大小为 10 * 10,Fill 为 None,调节 Stoke . 3.选中刚画好的圆形(其实这时已经就是静态的礼花了),按 F8 键转换为 Animation Symbol. 4.调节弹出

Fireworks教程:动画制作的技巧

  不得不承认fireworks的强大与便捷.这几天的学习让我感觉以前学的知识都只是皮毛中的皮毛. 齿轮图是用fw本身的动画元件制作的.比较粗造.但能做出来已经是一种安慰了.至于修饰.相对不会那么困难.难就难在对教程的理解. 旋转球体是通过fw的扩展3d Primitives制作的.昨天在经典闲逛发现有人在挖06年的坟,结果挖出了宝.赶紧下载了扩展安装上去试验了一下.一开始的旋转球体总是第一帧和最后一帧衔接不理想.慢慢地发现其中规律.原来每一帧的y轴刻度都比上一帧按9刻度递增.如第一帧的y轴刻度

Fireworks创意遮罩动画制作

本例使用Fireworks遮罩效果制作动画,对遮罩层的制作是本例的关键. 本实例用到的一些基本操作包括:钢笔工具.帧(Frames)面板.羽化填充(Feather).遮罩(Mask). 制作这类遮罩层有两种思路: 1.将人物脸部精确的抠出来,转成灰度,然后使用反色.用这种方法做的效果可能是最好的,能够以人物面部的明暗影响滚动的文字,使文字若隐若现,但完全在Fireworks中做是比较困难的,尤其是在抠图上最好能借助Pototshop,以达到最完美的效果. 2.使用圆形工具和钢笔工具绘制出脸部的大

Fireworks MX 2004 制作GIF动画(3)

3.使用"洋葱皮"功能 在动画制作当中使用"洋葱皮"功能可以方便地查看当前所选帧之前和之后的帧内容.从而为动画的制作带来方便. 点击"帧"面板左下角的小箭头 按钮,即可弹出"洋葱皮"功能选项,如图6-10与效果图6-11. 图6-10 图6-11 启动"自定义"项可以自行设置显示的帧数及不透明度等,如图6-12. 图6-12 而"多帧编辑"则是允许同时编辑多个帧的对象,从而免去了在多个帧

Fireworks MX 2004 制作GIF动画(1)

GIF动画的实现,是由逐张图画在不同的时间段快速地显示出来,由于人眼有0.1秒的视觉暂留,所以图像看上去就像是动了起来.而每一张图画就叫作"帧",它是组成动画的基本单位. GIF图形动画为网页增添许多活泼生动.复杂多变的图形元素,因此GIF动画在网页制作中被广泛应用,甚至大家喜欢的 QQ动态表情 大多也是Gif动画呢. Fireworks正是制作GIF动画很好的工具,这一部分我们看看Fireworks MX 2004在动画制作方面的特色. 1.制作GIF动画 我们先来做一个简单的五帧动

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

今天我们来学习用Fireworks制作一个精彩的动画,从这个例子中我们可以学习套索工具的使用和外部图像的输入方法,同时你还会实际接触到动画制作必不可少的概念如Layer(层).Frame(帧).Symbol(符号)和Instance(引用),以及如何合理地使用它们. 为了使动画看起来更加真实,我们采用飞机和降落伞的照片作为素材,如果你能仔细地按照下面的方法操作,就能做出和本例一样近似于电影画面的精彩动画. 第一步:导入飞机图片并去掉背景.打开一个新文件,Width=250,Hight=120,背

用Fireworks 4.0制作旋转文字动画

旋转  Fireworks与Dreamweaver.Flash一起合称网页制作三剑客,可是如果我们没有学会很好地利用它,那就与未出鞘的宝剑一样,难见光芒.所谓万事靠积累,只有多学多练才能让剑客真正发挥威力.今天就让我们来看一下如何利用Fireworks 4.0制作一个旋转文字的小动画,希望能对您有所帮助.    1.建立新文件:     启动Fireworks 4.0,按Ctrl+N键新建一个工作区,设置工作区宽度(Width)为400,高度(Height)为300,颜色为黑色,其余依照默认值.

图文教程:详解Fireworks中的动画制作

教程|详解 有过FLASH动画制作基础的朋友一定知道,在FLASH中将绘制的图像转换成的"图像元件"或"动画元件"是可以通过软件的内建指令,产生运动及其它变化的效果.而在Fireworks中也沿用了这种动画制作方式,从而大大减省了GIF动画制作时的繁琐性.而在本篇教材中,我们也只针对软件直接生成的动画效果进行分析,不对手工分桢的动画制作进行讨论. 一.动画的基本运动 在Fireworks中,动画的运动方式可分为四个基本动作: 1.直线运动:图像由A点直线移动至B点:

详解Fireworks中的动画制作

详解 有过FLASH动画制作基础的朋友一定知道,在FLASH中将绘制的图像转换成的"图像元件"或"动画元件"是可以通过软件的内ㄖ噶睿硕捌渌浠男Ч6贔ireworks中也沿用了这种动画制作方式,从而大大减省了GIF动画制作时的繁琐性.而在本篇教材中,我们也只针对软件直接生成的动画效果进行分析,不对手工分桢的动画制作进行讨论. br> 一.动画的基本运动 在Fireworks中,动画的运动方式可分为四个基本动作: 1.直线运动:图像由A点直线移动至