Fireworks创意遮罩动画制作


  本例使用Fireworks遮罩效果制作动画,对遮罩层的制作是本例的关键。

  本实例用到的一些基本操作包括:钢笔工具、帧(Frames)面板、羽化填充(Feather)、遮罩(Mask)。

  制作这类遮罩层有两种思路:

  1、将人物脸部精确的抠出来,转成灰度,然后使用反色。用这种方法做的效果可能是最好的,能够以人物面部的明暗影响滚动的文字,使文字若隐若现,但完全在Fireworks中做是比较困难的,尤其是在抠图上最好能借助Pototshop,以达到最完美的效果。

  2、使用圆形工具和钢笔工具绘制出脸部的大概轮廓,使用羽化填充制作遮罩层。

  这里我们采用第二种思路,以下边左边的遮罩动画为例,讲述这种创意动画的制作方法。至于第一种思路,有兴趣的朋友可以自己试试。

  

  step1: 打开一幅人物图片如图1。最好选择脸部轮廓较明显的图片,这样更方便完成这个效果。点击层面板上的小三角形,选择“Share This Layer”,将该层置为共享层。

图1
  step2:新建一层,选择圆形工具,去掉填充色,只要边线的颜色,拖出一个近似于脸部的椭圆,然后用钢笔工具在椭圆上相对于脸部不规则地方添加几个控制点,调整如图2。在这一步中尽量放大图像视图,这样有助于做出比较精确的遮罩层。(请参阅贝赛尔曲线造型操作详解

图2

  step3: 选择上一步绘制好的路径,使用羽化填充,并且去掉边线,如图3。注意一定要用黑色填充,遮罩层的最终效果如图4所示:

图3图4
  step4:用文字工具输入一些文字如图5。

图5

  选择该文字,按F8键,将其转化为符号,在弹出的对话框中选择Graphic,取名为Symbol 1,如图6。

图6

  step5: 从Library面板中托出两个Symbol 1,排列成如图7一样的位置。注意两个Symbol 1之间结合最好和谐融洽一点,这样在做动画时就会比较流畅。


图7

  step6: 同时选择两个Symbol 1,执行“Modify/Animate/Animate Selection”命令(快捷键Alt+Shift+F8),弹出如图8的对话框,将Frames参数调为8,点击OK,两个Symbol 1成为了一个整体。图9是此时的帧面板,自动产生8帧的动画。


图8         图9
效果如图10所示。

图10

  step7: 选择前面绘制的遮罩层,在层面板中调整成顶层,然后同时选择遮罩层和Symbol,执行“Modify/Mask/Group as Mask”命令,这时的整个图层如图11所示。

图11

  step8: 现在基本工作已完成了,最后在输出时选择“Animated Gif”格式就OK了。看完本例后,赶快扩展你的想像空间吧,用简单的技术做出更有创意的动画,如前面的眼睛动画,PNG图下载

时间: 2024-10-02 22:12:34

Fireworks创意遮罩动画制作的相关文章

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

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

详解Fireworks中的动画制作

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

Fireworks动画制作基本类型

Fireworks在Gif动画制作和处理上有它独到的强大功能和灵活简便性,它的内置指令能够生成的动画形式比较简单,大致可以分为两个类别:一是基本运动类,二是特效运动类,但是只要我们熟练掌握,并添加进自己的创意,一样能做出很酷炫的动画效果. 注意:在本篇中只针对软件直接生成的动画效果进行分析,不做手工分帧动画的讨论. 提示:在FW中有两种"符号"可以通过软件内建指令产生运动及其它变化的效果.一是"图形符号(Graphic Symbol)",二是"动画符号(A

Fireworks制作字体遮罩动画

用Fireworks制作字体遮罩动画是一件非常轻松的事情,下面我们不妨一起动手试试. 完成效果 1.选择一幅图像作为Mask字体的底层动画. 2.把上一步骤的图复制/粘贴2次,然后把3幅图合并,这样会使动画更加连贯. 3.选中这幅图,然后在菜单中选择:Insert--Convert to Symbol,或按F8, 然后选择Animation,将它定义为动画.在动画参数设置里只要填Frames播映的帧数就可以了,我们在Frames那里填10. 4.选中箭头所指的红点,向右拖动. 5.拖动后,调整好

Fireworks礼花动画制作教程学习

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

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

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

ppt如何制作遮罩动画效果

  ppt制作遮罩动画效果的方法 1.在计算机桌面上的PowerPoint2016程序图标双击鼠标左键,将其打开运行.并点击"空白演示文稿"选项,新建一个空白ppt演示文稿.在打开的PowerPoint2016程序窗口,选中副标题占位符,按Delete键将其删除.如图所示; 2.在标题占位符中输入我们需要的文字,选中这些文字,打开"插入"菜单选项卡.在插入菜单选项卡,依次点击"文本"组中的"艺术字",选择"渐变填充-

fireworks透视动画制作

大家看看下面的动画,用fw如何制作?请看-- 第一步:进入fw工作环境,新建文件,背景色自定.我们首先要做上部的动画.选择菜单项"insert --> new symbol",在弹出的对话框中,选择"animation"选项. 第二步:编辑该symbol.在symbol的编辑区首先画出一个正圆(配合shift键),clone它(复制-->粘贴也可以),一共做出8个圆:然后如下图所示将这八个圆均匀环形排布,你可以先做一个圆不要填充色只要描边色,来作为均匀排

FW MX 2004教程(6):动画制作

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