Fireworks MX制作像素动画

众所周知,Fireworks MX是一款非常优秀的GIF格式动画制作软件,但是很多朋友在制作动画的时候除了文字的移动,渐变很少做其他的效果,实在是对Firewrks MX强大功能的极大的浪费。其实只要我们有一些想象力,多在动画形式上下工夫,可以制作出很多与众不同的动画作品。

  下面我们就以一个简单的像素动画为例子,看看怎样只使用几种最基本的编辑工具来制作特具特色的像素动画。

  步骤1:

  打开Fireworks MX,使用菜单命令File-New新建一个文件,在弹出的文件属性对话框中设置此文件的大小为宽88像素,高31像素,背景色为透明(如图1)。

图1
  步骤2:
  在工具栏上选择矩形工具(如图2),并且设置其填充色为深红色,边框色为无(如图3),绘制一个矩形。在Properties面板上调整矩形的大小与位置,使其居中对齐(如图4)。

图4
  步骤3:

  在Properties面板上的填充选择区域中选择Texture为Grid4,并调整其透明度为50%(如图5)。此时的矩形效果如图所示(如图6)。

 
图5  图6
  步骤4:
  使用圆形工具(如图7)以边框色为白色,填充色为无绘制一个小圆,并放置在画面的右下角(如图8)。
图8
  使用矩形工具以无边框色、深红为填充色绘制一个小矩形,放置在文件的上端。

  步骤5:

  在工具栏中选择直线工具,在Properties面板中设置直线的宽度为2,线形为Hard Line。在图形上点一点,并使用同样的方法点出不同的小点,并调整其位置最后形成一个像素小人(如图9)。

图9
  步骤6:

  打开Frame and History面板,点击右上角的三角按钮,在弹出的菜单中选择Duplicate Frame复制一个Frame,在弹出的Duplicate Frame对话框中如图进行设置(如图10)。

图10
  步骤7:

  向右侧移动像素的位置,并改变小人的造型,向左适当移动圆环的位置(如图11)。

图11
  步骤8:

  使用同样的方法复制Frame3、Frame 4、Frame 5、Frame 6,并且改变小人与圆环的位置,最后每一个Frame 上的图形分别如图所示(如图12、13、14、15)。

 
图12  图13
 

 
图14  图15
  步骤9:

  在Frame and History面板上双击Frame 1,将时间间隔调整为25毫秒(如图16),并且用同样的方法调整所有Frame 的时间间隔。

图16
  步骤10:

  点击“播放“按钮,可以看到整个动画的效果,像素小人飞身跃过滚动的圆环,只要你稍加改变就可以得到更多的不同动画。

转自:动态网制作指南 www.knowsky.com

时间: 2024-12-05 18:08:19

Fireworks MX制作像素动画的相关文章

Fireworks MX制作下拉菜单

菜单|下拉 随着网站页面极其功能的复杂化,越来越多的网站使用下拉菜单进行导航.熟悉Javascript的朋友都知道,所谓下拉菜单其实是通过Javascript控制每一个元素的可见属性实现的,当然这需要专门编写大段的代码.但是要是使用Fireworks MX就不需要这么麻烦,所有的代码都是由Fireworks MX自动生成的,你要做的只是美化一下界面,再简单的设置一下下拉菜单的选项就可以了. 下面就来看看怎样使用Fireworks MX增强的下拉菜单功能制作出让人羡慕的下拉菜单. 步骤1: 打开一

Fireworks MX制作一面饱经风霜的奥运五环旗

在每届奥林匹克运动会开幕时,运动场中间都要高高地悬挂一面奥林匹克旗帜,这面旗中间有五个圆环组成的图案.奥林匹克旗帜五个圆环连接在一起象征五大洲的团结,象征全世界的运动员以公正.公平的比赛和友好的精神在奥林匹克运动会上友好相见,欢聚一堂,以促进奥林匹克运动的发展.今天笔者利用Fireworks MX制作出这见证历史.对人类的文明产生了深刻的影响.饱经风霜.锈迹斑斑并嵌套在一起的奥运五环.同时也希望2008年在我们中国举办的奥运会能将这奥运五环再一次擦亮! 1. 打开Fireworks MX,设置文

使用Fireworks MX制作泡泡球效果

在经典论坛上(http://www.blueidea.com/bbs/)看到一个使用Fireworks MX制作透明泡泡球的效果,感觉非常不错,特摘录此教程,方便借鉴参考.(效果图为PNG文件) 1,使用圆形工具画出一个白色的圆.并其转化成位图.(编辑→平面化所选 快捷键:Ctrl+Shift+Alt+Z) 2,再使用圆形工具画出一个白色的圆,大小相比前一个制作的圆略小些.借助于排列工具,将小圆放到大圆的居中位置. 3,在图层面板中,选择转化为位图的圆,按住CTRL键同时,选择小圆图层.得到小圆

Fireworks MX制作指南-Windows XP风格按钮步步通

window|按钮 用过Windows XP的朋友都为它漂亮的界面所动心,现在我们用Fireworks MX只需几步即可制作一个赏心悦目的Windows XP风格的按钮. 第一步:外形/渐变填充利用矩形工具在画布中央拉出一个圆角矩形:打开填充面板(快捷键"Shift+F7")从下拉菜单中选择"线性":然后使用选择工具来调整按钮的渐变属性. 第二步:内侧阴影选中矩形图形,打开效果面板并从下拉菜单中选择"阴影与发光→内侧阴影":选择阴影参数(如图1)

Fireworks MX:GIF动画

 制作gif动画一直都是fireworks的强项,方便.快捷.自由是fireworks的特点.虽然还有其他的一些优秀的动画制作工具,比如flash,比如imageready.但在制作gif动画上,我一直都推荐fireworks,而不会选择其他的软件,甚至不主张用flash来制作gif.    flash的主要作用还是在制作矢量的swf动画上,gif动画则是flash的一块鸡肋,发色数不多.文件体积巨大.文字不清晰都是flash制作gif的最大毛病.     至于其他的一些傻瓜式gif制作软件,我

用Fireworks MX制作Mac风格边框

以前大家常用线条来表现浅浮雕效果,现在我们在Fireworks MX(以下简称FW MX)里可以用效果(Effect)面板来轻松制作. 如下图(Png源图)则是用线条来制作的一个Mac风格的边框,我们用FW MX打开源文件就会发现制作比较繁琐,有没有简单的方法来制作呢?答案是肯定的,方法就是用效果(Effect)面板!本例用来说明用FW MX制作边框的过程,希望能为FW MX爱好者提供一个新的思路. 一.边框制作 1.打开FW MX,建立一个340X110的新文件. 2.从工具栏中选择"矩形&q

Fireworks MX 制作燃烧效果

在photoshop里大家一般用刮风.波浪滤镜再加上通道等技术来做出很好的炙热燃烧效果,作为一个Fireworks爱好者,我更希望Fireworks也能做出这样美妙的效果.现在,Fireworks MX新功能提供了很强的像素图处理能力,我试着用其中的涂抹.淡化等工具制作燃烧效果,一样很不错. 一.首先建立一个500X400的画布,因为需要涂抹,范围太小不好操作,填为黑色. 二.在制作燃烧文字之前,我们先练习制作一组火苗,这对理解火焰的走势有帮助.拖画三个椭圆形,分别填充为黄.橙.红色,调整大小位

Fireworks MX 制作朦胧照效果

以前看到过在Photoshop制作过朦胧照的效果,感觉很新鲜,就尝试着在Fireworks中制作一下了,没想到制作的方法特为简单. 制作方法: 1.打开原图片: 2.选择原图片,将选择"编辑"菜单."克隆(Ctrl+Shift+D)",原位置克隆一张图片: 3.打开层面板,选择好第一张图片,在属性面板中设置好透明度,值为40%: 4.选择"滤镜"菜单."模糊"."高斯模糊",设置值为4: 制作完成,效果挺漂

Fireworks MX制作精细漫画头像

用FireWorksMX制作一款精细的酷酷的头象.学会了这一个等于学会了很多. 一.首先,在FW中新建一个120*120白底的文件. 没有特殊说明的情况下,铅笔设置都是1px柔化. 二.使用钢笔工具,画出人物基本轮廓的曲线. 如图: 三.画图的关键是使用钢笔工具修改,修改的操作过程如下: 先选黑鼠标,再选图,再选钢笔工具.然后钢笔工具单击在关键点上,这时鼠标左键不放松,继续移动钢笔工具,即可以修改.如果要修改与点相连的其中一条曲线,先点黑鼠标,再点需要修改的关键点,然后按住Alt不放,这时黑鼠标