FW制作照片连续滚动效果

[复制链接]
查看: 522|回复: 0
gggds 发表于 2009-12-27 13:42:34 | 显示全部楼层 |阅读模式
  本文中我们建立一个具有胶片形式的动态影视Banner,首先制作一个具有胶片效果的边框,接着使用帧面板制作GIF动画效果。主要熟悉Fireworks MX 2004中组合、帧面板、修改画布大小、动画面板等使用。文章末尾提供原文件供大家下载参考。 ' x9 `; m$ n  M5 n, @5 d
4 {3 v. @3 \9 w! i

. N$ n& e% ~  }# T6 N  下面我们看具体操作步骤。    1) 新建一个353×51的文件,设置背景颜色为黑色,如图1。   ?% F' K5 r1 [1 h* O9 N* y+ i0 E

% o' u# e' n0 H- e$ N4 P' S; p+ p, H$ i3 f- I2 t* I( G! [
图1? 新建一个文件- ~+ [" n  M3 r9 _1 d
    2) 由于图像相对较小,为了方便编辑需要改变视图大小,点击\\\"视图\\\"菜单,选择\\\"缩放比例\\\"150%,如图2所示。
! J- ~' {' ?( z. C' H8 A
% [) K. m4 {. W& J2 M) L, c) D5 |* m* a4 O8 k8 S1 B
图2? 改变视图大小- t9 d8 b* G! P+ Y* V: e2 i
    3) 点击工具箱的 图标,在图像上画一矩形,并设置填充色为白色,得到图3。, B7 p( T; F8 c  ~& K: l

# e5 q# U& h4 B5 r; v5 e
  X+ N8 ^: T6 J$ Q7 [/ o% M图3? 画一矩形+ t& k) [7 R1 }3 |/ D6 {
4) 选择矩形并按Ctrl+C复制,然后Ctrl+V粘贴。并用方向键移动复制所得矩形到适当位置,按Shift键选择两者并组合,得到图4。7 Q/ {6 B8 b8 u+ F
3 o2 d  E$ Z7 C% _  N( H
3 S6 D1 y% |* F
图4? 复制并组合矩形
4 Y- v: ~7 j$ {5 W  v4 L  5) 不断重复步骤4)得到如图5所示。这样就做出了一个胶卷的样子了,下一步就为其添加一些\\\"相片\\\"。
  n/ X3 u2 K4 e, T. _) H# j5 Z! i" P  w/ }( N- d8 K
9 x% f7 C% n2 x* _' [
图5? 重复复制矩形得到的图片- z$ b0 y# k' u6 j" V
    6) 导入一个Banner.gif图片,如图6所示。
* G5 g' t* U) i* G0 s; W( ]. ^
# A# s' }/ y8 W- I2 L4 i7 C" ~, Y' {. N
* h( I& f* {* J( j' |9 @图6? 导入一个图片
0 [. ]$ \7 g( m& m" I; ^    7) 选定导入的图像并点击工具箱的 图标,改变导入图像的大小使其与\\\"胶卷\\\"符合,得到图7。; u+ e% c, b2 B3 E& V8 D/ @

  s8 q+ w2 |! }2 e2 n
: `3 Y( @; K# p( H; A图7? 改变导入图像的大小( F: z& W2 Y( ~+ J1 n
  8) 重复步骤6)和步骤7),导入其他一些图像,并按方向键排列导入的图像,恢复到100%视图最终得到图8。
; H0 Q# Z1 J! d' f/ K* Z7 R6 B+ f4 h" C! H/ K, I
+ R6 k# C( ~! G+ R/ ?3 d6 D8 @
图8? 导入所有图像后所得图像, c, o5 m9 Z2 h; ?( o- N  D
    9) 保存文件为Banner.png,下一步来制作一个滚动的Gif图片。打开Banner.png图片,单击\\\"选择\\\"菜单,选择\\\"选择全部\\\"下拉菜单,选定所有的元素。如图9所示。
  ^3 Y$ F: F& X% J/ y" y
; v" m- K# i$ C& ?2 N3 c# k1 q, U5 b7 n, q
图9? 选择所有元素5 B( i: w# E1 P" T( N' @, p
10)选择\\\"修改\\\"|\\\"组合\\\",将所有元素组合成一个对象,如图10所示。
2 j- L* U7 |" d& H" z/ y% y9 a
/ S: R, q0 p/ y" |' V. ^  W
图10? 组合所有元素  11)为了实现滚动效果,需要图像右边移出时,左边有图像能够补进。需要两幅相同图像来制作滚动效果。首先选择\\\"修改\\\"菜单,然后选择\\\"画布\\\"|\\\"画布大小\\\",修改画布大小为706×51,得到图11。
* n% P  X& U; B& w8 u6 ?/ s/ F5 R6 ~3 X3 R- m  r

) v* F  U: s9 p( a9 g???????????????????? 图11? 修改画布大小  12)选择所选组合,按Ctrl+C复制后再按Ctrl+V粘贴,然后排列好两个对象并再次组合,得到图12。
4 ~. I  _) ~, L: Z  @: \
  N8 M; l( e5 o8 W4 h, R  s
3 t9 c9 t+ D' I) U0 I/ Y8 a" V9 \图12? 复制并排列组合元素  13)按Ctrl+X剪切所选组合,修改画布大小到353×51,再按Ctrl+V粘贴组合,将所选组合右侧与画布右侧对齐,得到图13, y. B8 q, |' O4 b) H9 Y  ~
5 k$ u2 k$ _' y. h6 H7 \! z
- H; b7 X+ w" e) x; Z8 E/ u

, ~3 p( {% ^3 K. ?$ M% m8 }图13? 恢复画布大小并右侧对齐画布与图像(图片较大,请拉动滚动条观看)  14)在开始制作滚动动画。首先选择\\\"修改\\\"菜单,再其下拉菜单中选择\\\"动画\\\"|\\\"选择动画\\\",得到如下图所示窗口。将\\\"移动\\\"设为\\\"353\\\",使其恰好能够左右衔接上。并将\\\"帧\\\"设为70,如图14所示。4 Z$ d  V- ?5 w: N- R
( p) f: d: c7 {+ d6 t2 p
" x9 y$ o" Q( E) t: K
图14? 动画窗口的参数设置1 F& M1 u. Q) i( @# N) R
15)单击\\\"确定\\\"会跳出如图15所示窗口,单击\\\"确定\\\"会得到图16。
" k/ s8 D$ t: T! n& o) A% i2 {4 u0 t+ X

( G7 Q. p  {. T) x$ N4 H3 A图15? 跳出窗口
: }: O! o! B, `' a% E2 P* x" L2 x?, ^8 \% z$ H7 s: H9 q; q
' a& l% a# M! s# ?- b+ q# N

* G  d" K6 `7 h/ m6 m" T- c( L* A
图16? 动画元件窗口(图片较大,请拉动滚动条观看)    16)打开帧面板,选择第一帧,按住Shift键并拖动至第七十帧,单击鼠标左键选定所有帧,双击帧面板右侧,修改\\\"帧延时\\\"为\\\"10/100秒\\\"。如图17。
, k" A  `4 g  I  [) [# _3 o& M" d* {! ?+ k" ?
* g8 Q' {( P6 v8 p4 C
图17? 选择所有帧并修改\\\"帧延时\\\"  17)下一步就可以播放动画,看看效果如何了。点击绘图面板的 图标播放动画,效果如图18所示。+ k. z; r4 r7 A4 [; J  ~# Q
- I; ~) _9 t0 A8 g9 Y6 U
$ E; |: {; D0 L) q
图18? 播放动画  18)最后一步导出图像,将做好的图片保存为Banner.gif文件,如图19所示。 原文件下载
, r4 g& Z3 N& ?7 r! i/ C4 c8 I6 E/ Y" T5 V' Z0 {$ y5 J4 D
( M& x+ A% m0 b# k/ K+ y8 _
图19? 将图像保存

本版积分规则

精彩图文

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