Fireworks教程:网格化图像效果(1)

[复制链接]
查看: 339|回复: 0
gggds 发表于 2009-12-27 03:11:41 | 显示全部楼层 |阅读模式
网格化图像效果在设计中也很常见,效果如图4-127所示。这种效果适合作为网页或者通栏的背景图像。具体的制作方法如下:
, g5 |1 Y" G) E% \) T1 w8 s: M# N* i. C! B

4 ~$ m4 j; }4 E1 K6 R4 a' T  {图4-127 网格化图像效果% _' T5 A7 w+ |  D! l7 w2 z# X% m
1、在Fireworks中打开素材图像,如图4-128所示。( C& ]3 z) C+ ~1 A% s

$ r* c" }; V! g4 y3 S2 B$ U9 J# `+ R7 Q
图4-128 打开素材图像
" ~1 `; l% n- i9 L: o% x2、按快捷键【Ctrl+6】,把图像的显示比例放大到原来的1600%,如图4-129所示。2 P! ~* S/ Y1 ]) q# Q6 Q( j* A: g( c

3 v  f1 ~) f) e# o8 p
1 i" x5 L7 A% L# w图4-129 放大显示比例
" t: j: S* @+ Z3、按键盘上的【Print Screen】键截屏,然后在Fireworks中创建一个新的画布,按快捷键【Ctrl+V】,把截取的屏幕图像粘贴到画布中,如图4-130所示。
, M6 H* i( R0 M2 j
% I* d# [* H3 f. w9 `8 Z/ T9 Z
4 P# H5 U3 E! x图4-130 复制截取的屏幕图像% l2 c0 N* I+ |2 v
4、使用【裁剪】工具裁剪需要的部分,然后在【属性】面板中添加2到3次【锐化】滤镜即可。4 N3 a9 D6 {0 K0 y7 N
可以基于这个图像效果为背景来设计网页通栏,效果如图4-131所示。
$ g+ N+ P6 V" K$ ^
+ M- u: |# ]9 y3 L8 j/ q
- b- M$ l$ L( x6 g! _7 A图4-131 网页通栏效果8 G9 y2 M7 |) \: e- T( O8 K5 p6 X
$ J9 l2 ^5 i  Q  a$ N
除了类似于像素风格的效果以外,还可以制作水平或垂直的颜色条效果,如图4-132所示。具体的制作方法如下:: x& T+ ?2 ?1 U6 k

; C, o! n- c6 ?4 a' l. c$ P1 B( {7 B8 M) q
图4-131 制作好的颜色条效果  s! ~; a* I+ j+ M0 |
1、启动Fireworks,新建一个画布,尺寸任意。
  }! d* K- p6 b% J5 [" D6 S2、使用【矩形】工具,在画布中绘制一个和画布同意尺寸的矩形,并且填充线性渐变色,颜色为白色过度到任意色彩,效果如图4-132所示。- U! ?( h8 f" D& a& q! |6 y0 ~

' q5 E3 I: B6 K- }7 f# `, B  H  k
图4-132 给矩形添加线性渐变色
. C8 q+ B1 F1 h) s* E3、切换到【两幅】的预览窗口,打开Fireworks的【优化】面板,在【优化】面板中选择格式为“Gif”,【索引色调色板】为“最合适”,【颜色】可以选择“16”或“8”,这里选择的是“8”,效果如图4-133所示。
; Z; ~3 P3 v( y; K% b
% p$ d5 w6 S2 X' G, ?1 S5 A6 L$ _5 w- l: H& y
图4-134 对图像进行优化
  @! o8 X3 K% g5 W. d- t* y4、和上面的做法一样,按键盘上的【Print Screen】键截屏,然后在Fireworks中创建一个新的画布,按快捷键【Ctrl+V】,把截取的屏幕图像粘贴到画布中,如图4-135所示。8 g( e, e7 L  E0 @
' K% F/ W. j. i2 I& i/ e4 g! D$ |

% A1 N* a% e5 ^0 {, t5 [7 m图4-135 复制截取的屏幕图像
/ F; K4 R- E$ G& T9 ~5、使用【裁剪】工具裁剪需要的部分,然后在【属性】面板中添加2到3次【锐化】滤镜即可。
1 E  \6 Z. a4 t- s( P; ]( r6、如果需要不同颜色的效果,可以直接使用【色相/饱和度】滤镜来进行调整,不需要重新制作。

本版积分规则

精彩图文

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