当前位置: 首页 > 图文教程 > 平面设计 > FireWorks > Fireworks教程:打造漂亮渐变网格马赛克背景

FireWorks
Fireworks命令插件:Change Text Size
Fireworks CS3体验之Pages面板
Fireworks绘制打印机图标
实用Fireworks企业标识不扣图反白法
Fireworks打造质感金属锁图标
Fireworks CS3基础教程:切片和优化功能的运用
Fireworks快速简单打造网页“闪字”动画
Fireworks打造逼真梵高之光特效
Fireworks轻松打造质感Vista LOGO
Fireworks教程:打造一个没有钨丝的灯泡
用Fireworks 8的位图工具打造精美网页效果图
疯狂的补间&元件&路径 制作仿3D光亮DNA桌面(试用版)
Fireworks CS3教程:蒙版的运用基础
网页设计翻译教程:图标缩小后变形的解决办法
fireworks教程:用笔触绘制“毁灭顶峰”效果
Firework教程:教你制作特殊的切角图形
Firework教程:韩式风格手提袋的绘制
Firewoks教程:制作液体金属表面文字效果
Fireworks教程:电视雪花动画效果的制作
Fireworks教程:制作一个简单的网页新闻播报框

FireWorks 中的 Fireworks教程:打造漂亮渐变网格马赛克背景


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-22   浏览: 129 ::
收藏到网摘: n/a

这是即将出版的Fireworks CS3经典教程的部分章节,主要是介绍网格效果的制作,第一种制作方法是参考网友的帖子来制作的,第2种效果是原创,请多支持,谢谢!

网格化图像效果在设计中也很常见,效果如图4-127所示。这种效果适合作为网页或者通栏的背景图像。具体的制作方法如下:


图4-127 网格化图像效果

1、在Fireworks中打开素材图像,如图4-128所示。


图4-128 打开素材图像

2、按快捷键【Ctrl+6】,把图像的显示比例放大到原来的1600%,如图4-129所示。


图4-129 放大显示比例

3、按键盘上的【Print Screen】键截屏,然后在Fireworks中创建一个新的画布,按快捷键【Ctrl+V】,把截取的屏幕图像粘贴到画布中,如图4-130所示。


图4-130 复制截取的屏幕图像

4、使用【裁剪】工具裁剪需要的部分,然后在【属性】面板中添加2到3次【锐化】滤镜即可。

可以基于这个图像效果为背景来设计网页通栏,效果如图4-131所示。


图4-131 网页通栏效果

除了类似于像素风格的效果以外,还可以制作水平或垂直的颜色条效果,如图4-132所示。具体的制作方法如下:


图4-131 制作好的颜色条效果

1、启动Fireworks,新建一个画布,尺寸任意。

2、使用【矩形】工具,在画布中绘制一个和画布同意尺寸的矩形,并且填充线性渐变色,颜色为白色过度到任意色彩,效果如图4-132所示。


图4-132 给矩形添加线性渐变色

3、切换到【两幅】的预览窗口,打开Fireworks的【优化】面板,在【优化】面板中选择格式为“Gif”,【索引色调色板】为“最合适”,【颜色】可以选择“16”或“8”,这里选择的是“8”,效果如图4-133所示。


图4-134 对图像进行优化

4、和上面的做法一样,按键盘上的【Print Screen】键截屏,然后在Fireworks中创建一个新的画布,按快捷键【Ctrl+V】,把截取的屏幕图像粘贴到画布中,如图4-135所示。


图4-135 复制截取的屏幕图像

5、使用【裁剪】工具裁剪需要的部分,然后在【属性】面板中添加2到3次【锐化】滤镜即可。

6、如果需要不同颜色的效果,可以直接使用【色相/饱和度】滤镜来进行调整,不需要重新制作。