Fireworks制作草生草长之草样年华gif动画(1)

[复制链接]
查看: 295|回复: 0
gggds 发表于 2009-12-27 03:12:42 | 显示全部楼层 |阅读模式
gif文件:6 `& `1 b! C0 u. v" ^. Z

+ C9 W* K/ I5 f7 P% z
" v1 A4 V$ G6 W4 P; f( t6 y2 ?8 j% [  B6 ]: p; X3 G! l
png源文件:! u) B9 J  t/ [/ t) G9 J# E

9 ?. N- ^2 X/ f, e$ g$ Y4 v7 {. j$ S/ j; E' y# V. Q
8 d8 h' s: ]( j# ^+ b
作品名称:《大学四年纪念-草样年华》作品格式:gif动画创作原因:为纪念草样的大学生活作品介绍:用草周而复始的贱生表达大学四年颓废中有理想的生活状态by RockHward2007.7.12+ F/ b6 `7 X: C9 [' b% g

* _% n: ~# K4 u2 Z& w$ q6 Z6 ]3 d3 E5 x' g, h; w

: u+ ?6 Y) T; D- {, ]6 M3 J* V1 |1、为动画准备元素% \2 ~3 @* o  f
在这一节里,你将会为这个gif动画准备好各个图形元素,包括一个背景、一个标题和一个签名。
0 e2 t' Z2 K, V, a* p$ m# V! z5 ~) o1 Q6 h/ K& q
; K' ~9 }/ L% b; }
  p9 X/ J9 ]: i% a! |; X# d
1.1
! T! o5 r. B6 T0 t/ D
    " U6 j* M; k8 r2 P
  • 新建一个250*70px黑色背景画布的文件。 " v, ~; c% h9 z, i- w
  • 如下图,绘画一个符合画布大小的矩形,填充如下图所示,注意填充手柄。
( S7 h! ~& D- b6 `0 ?& O
1 R; N& F8 D) B& V

, E3 h# E/ `) m* K  _1 H0 Q1 q  K. E6 `3 k4 I, ~; {+ O+ _, x8 ^7 A4 E, B
1.25 v) b+ V" K+ v( }% S' t% `

    8 J( _* n* r! C; C" D0 f
  • 将矩形所在的层命名为“grass”层。
    9 F( s. k! i. |7 f
  • 新建一个命名为“text”的层,在该层上键入你喜欢的标题和签名,选择你喜欢的字体,颜色自定。 + r+ X8 a4 T. l! q1 Z5 E& q
  • 然后将标题和签名的混合模式改为“变暗”。 " I# H, |, n9 \- E& E% K: {
  • 最后在层面板中双击“text”层,在“共享交叠帧”选项打勾。对“grass”层也钩选“共享交叠帧”。
- w5 K$ k. d6 J

# n" Y% h& _/ z- _' Q1 J; `
/ ]* O6 i% |2 X! j- P1 e0 }  q& B: j
7 X% ^$ s$ |+ E7 C. H2、草生草长动画制作
% x+ w9 I( X2 U2 O& t- {7 L' ^; @在这一节里,你将会完成模拟草的生长的动画制作。首先你将会制作一个动画元件,然后分两步,分别模拟草的消退和生长。$ i/ I8 [3 N* W+ Z5 \% L" x

1 t! u; g; }2 G5 \: ^; O0 h1 q/ x0 z1 S
% P! O( f5 s. @. Y
2.1
( ~% n7 @  x& d+ ^( n1 k$ e4 e

    ! a3 M2 g5 G9 o1 E& e
  • 在“text”层和“grass”层之间新建一个叫“move”的层。
    7 f+ H7 A$ p" z
  • 然后锁定“text”层和“grass”层。
    + Z7 _" i1 c3 s0 Y0 Y
  • 在“move”层上绘画一个如下图填充的矩形。
    ; W% O3 c# J. Q' F$ I. b
  • 混合模式改为“加热”。调节渐变填充手柄,使之如图所示。

1 V5 Z2 n0 |. v3 y9 f$ P' j) y( `" ~9 K& A7 C

' l5 G: n) M/ q9 Y% r; O1 E# x8 [
1 n, S; @, L: w2.2  a: z; \$ h  A5 W/ n
    ) {' u# o: k8 A
  • 选中刚才绘画的矩形,按F8转换为“动画”类型元件,元件命名为“草”。 % U! \  z7 ?+ L" e( Y3 X
  • 然后在“动画”设置对话框中“帧”设为“10”。按“确定”后会有一个提示窗口,也按“确定”通过。
# y3 w0 N. h$ i5 C) _

) ^3 X4 B, S' l  Z. ]8 C7 Q) t: V6 ?' a5 e5 Z" y
5 Z4 r/ J/ D8 j; }" j- g/ Y, T: c! k
' d# c% l) T+ ]4 V& o" H& P
) \# j. O! l% Y- Z
( C5 O6 t' I: _) k8 I4 {8 W

# Z# F: v. L8 ^! }7 A4 w2.3
: v0 \9 V5 P: O  P3 X6 _更改画布上“草”的动画实例的混合模式为“加热”。* B# {( |, a- F- a/ J' R. _$ E
[ol]9 D) v! i8 e. W1 o6 }
  • 按住shift,拖动“草”动画实例的红色控点,使之到达如图1所示的位置。
    " l& e" I1 }" R1 z  k
  • 单击红色控点,检查最后一帧是否如图2所示,否则继续按着shift拖动红色控点以达到图2的效果。[/ol]
    4 d5 o2 r& W8 N6 e" \9 G/ ~; B; r. I( J& U; x, T
    + c2 R1 F6 Y4 |3 S
    8 r) C# \, B; l# @6 K
    2.4
    % f) C5 J; j; V' a7 I& ?[ol]+ d7 {3 M* j8 `2 I2 X
  • 调节时间:打开帧面板,同时选中第2到第10帧,然后双击然后双击右方数字位置,弹出“帧延时”,输入“10”。双击帧1,输入“100”。 ) _  ~; o3 o+ ^# t/ \: k
  • 同时选中第1到第10帧,然后单击帧面板右上角的菜单,点选“重制帧”。
    ) e1 R, u, S" [
  • 调节时间:帧11时间设为“200”,帧12~18设为“10”,帧19设为“100”。[/ol]
    ) P& {( h) D$ z; m
    4 z& c# _% J& P8 c: z" |( d+ Y% L4 \8 Y
    ! r4 X+ [$ ~$ L5 T2 ?
    2.5现在要制作草生长的效果。选中帧11,选中“草”的动画实例,拖动红色和绿色控点,交换红色控点和绿色控点的位置。这样,从帧11到帧19就模拟了草的生长效果了。
    3 p& P: f( k4 L# w& q: F
    * P; G4 `, \- g! M( d  m
    + b' Z6 R, E2 f' {
    0 k  i9 d) i& C' M/ s  SEnd
      b. y% t3 |$ W4 F7 h' i最后选择gif格式导出gif动画。
    + D" }" K2 h: i) ~" z0 T技术总结
    ' s! w% [" V5 D$ o, e3 y1 ?" R利用Fireworks的混合模式制作gif动画,可以产生颜色变化多端的感觉。
    , @  }) f# b7 x, P! L0 H0 u下面是另一个作品《waste my time,waste my life》
    4 g' M3 S9 I* I0 q$ G* v6 e8 c' d' x# w& O; p
    : C8 R9 G! R( _" z) N- b8 B
    8 M* q+ W, C5 s& Z
    gif文件:7 Y6 _3 C( O0 t
    / F: C8 Y. t. p( f/ e8 h
      Q4 d3 X5 m( ]8 B/ N

      s- Q2 G* F/ P* hpng源文件:
    : ^$ S: E& ?' H5 _- \" d( y
    9 f4 v6 |& c% l' l, C0 C. Z! q
  • 本版积分规则

    精彩图文

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