Fireworks MX制作像素动画

[复制链接]
查看: 237|回复: 0
gggds 发表于 2009-12-27 03:10:53 | 显示全部楼层 |阅读模式
 众所周知,Fireworks MX是一款非常优秀的GIF格式动画制作软件,但是很多朋友在制作动画的时候除了文字的移动,渐变很少做其他的效果,实在是对Firewrks MX强大功能的极大的浪费。其实只要我们有一些想象力,多在动画形式上下工夫,可以制作出很多与众不同的动画作品。  下面我们就以一个简单的像素动画为例子,看看怎样只使用几种最基本的编辑工具来制作特具特色的像素动画。: l1 Z3 K2 D$ y+ D
( b1 F+ y& Z% B2 F, E
此主题相关图片如下:
# t2 `! S- M: ?. V6 a* M" u! ^2 v1 }1 z) c5 B# J) x' z" B" B% S( O
 步骤1:  打开Fireworks MX,使用菜单命令File-New新建一个文件,在弹出的文件属性对话框中设置此文件的大小为宽88像素,高31像素,背景色为透明。
( m: i! e9 a7 S2 f' Y  步骤2:  在工具栏上选择矩形工具,并且设置其填充色为深红色,边框色为无。
$ H7 @) E0 t  P6 G# i
: T, o; t1 _' A7 X1 S; q* W* s此主题相关图片如下:
, l6 E( Q. [! l% [6 a  f/ C' R$ O/ s! Y( A* c& s  V/ ^2 ?$ Q
  绘制一个矩形。在Properties面板上调整矩形的大小与位置,使其居中对齐。
6 X- e$ o3 Z% |0 Z* n; H6 R4 R/ h9 T9 V' f& f* ^$ Y% B# [
此主题相关图片如下:
+ m' W) A: I* Y" _, ]3 s/ v
) X7 U# K! q, r  w- s3 y  步骤3:  在Properties面板上的填充选择区域中选择Texture为Grid4,并调整其透明度为50%
5 W7 J4 E! G! p6 H2 ^; j. V" F" Y& I$ p0 s
此主题相关图片如下:
. K* s4 |% T8 r6 U- s7 G% j: L
5 k' k1 m. ^+ H/ J/ _9 {此时的矩形效果如图所示:) X: t, \- x" ~& P6 U& o
" a+ u7 G$ M8 }. M
此主题相关图片如下:
2 @( d9 S& m4 M" k0 z. t- _' R- L$ Z5 A6 O( L0 A# I; D
  步骤4:  使用圆形工具以边框色为白色,填充色为无绘制一个小圆,并放置在画面的右下角。
; J% K. }6 D6 l: I: k! ]  U% a" F; Y% C+ t/ }: ?
此主题相关图片如下:
: Q2 T5 g$ G, m; }
- w2 A/ E9 M! C' q9 H9 l: y: c
2 v, w! M' ~" \0 a9 a. Z0 Y8 D& ^  使用矩形工具以无边框色、深红为填充色绘制一个小矩形,放置在文件的上端。
$ M: c. }' _4 N  ^5 {  步骤5:  在工具栏中选择直线工具,在Properties面板中设置直线的宽度为2,线形为Hard Line。在图形上点一点,并使用同样的方法点出不同的小点,并调整其位置最后形成一个像素小人。; H, x  K* c* z

/ e2 c" R! e; y" n, d! X, Q此主题相关图片如下:
( X2 H: X% n4 l( b, V/ V% P6 i$ [! {3 Y$ S! L, o
   步骤6:  打开Frame and History面板,点击右上角的三角按钮,在弹出的菜单中选择Duplicate Frame复制一个Frame,在弹出的Duplicate Frame对话框中如图进行设置。2 K7 A8 h( P3 \( D6 e6 S
7 X* F# w7 v, Q0 _8 }  `" Z7 v
此主题相关图片如下:
8 [) t  r: |6 Z" t# C/ ~% J9 Z/ k( q4 e" {) I$ }' O2 p( L- h

. d( D  s4 f8 v: D! y2 T  步骤7:  向右侧移动像素的位置,并改变小人的造型,向左适当移动圆环的位置。9 J  ]2 [1 y" h2 L0 f

' @/ ]* W  ]: Q4 `, |此主题相关图片如下:
( e4 n9 u; ]+ L: ?( N9 x, a! G( o0 n/ X% @$ |5 D. {( c0 b: Q% \
  步骤8:  使用同样的方法复制Frame3、Frame 4、Frame 5、Frame 6,并且改变小人与圆环的位置,最后每一个Frame 上的图形分别如图所示:
6 R$ g9 O) ~0 G( T5 `6 b/ X4 p: D6 e, ^% L; N9 @2 ], T
此主题相关图片如下:
9 u, d! T  S7 d+ r. F& w( o0 s1 W- R( b9 H4 i
8 A" Z" I1 V2 \( c+ @
# [! H" c: p2 K# Y7 M/ y" W+ ?% p
此主题相关图片如下:+ h7 x5 a# X3 y* o: v  `, T* Z9 v

' o+ y$ l9 w; G' [. O+ g$ K7 {
6 I/ J) h( ~1 p
+ E- r3 j$ u0 M2 e5 x此主题相关图片如下:/ q( Y9 V9 ~$ l% x. G
5 x; d& T0 |( _9 [" _

7 o; K9 Z% B. l4 S4 B  c0 N! @5 n- g' L8 X# r# W' r) W
此主题相关图片如下:. S8 V4 |# c. e+ E, P& [  `4 S
) G5 r5 B; `- K) e) @
' w* i8 _. n# i+ f  i* w7 c
  步骤9:  在Frame and History面板上双击Frame 1,将时间间隔调整为25毫秒,并且用同样的方法调整所有Frame 的时间间隔。
+ p$ F& B; _/ U3 e2 ]: \4 q9 F# d0 g, q$ v6 T" U
此主题相关图片如下:
/ H/ D  h! D8 Y7 f9 S, H: D- ~3 I# U

: O5 G2 ^% l$ s( z  步骤10:  点击“播放“按钮,可以看到整个动画的效果,像素小人飞身跃过滚动的圆环,只要你稍加改变就可以得到更多的不同动画。

本版积分规则

精彩图文

Copyright   ©2015-2016  展示网  Powered by©Discuz!  技术支持:凡尚展览     ( 粤ICP备14065977号 )