Fireworks“外发光”特效的另类妙用
Fireworks软件的“外发光”是常用的一种特效,如果灵活运用可以解决不少平面设计中的小问题。
一、用Fireworks“外发光”特效消除图像边缘锯齿
二、用Fireworks“外发光”特效为文字描边
三、用Fireworks“外发光”特效羽化图像
四、用Fireworks“外发光”特效表现水晶按钮的底光效果
Fireworks打造精致个性的Vista样式按钮
EyeCandy滤镜打造旋转立体四叶草动画
完成效果如图。
效果图
Png图
1. Fireworks中新建一个150*100px大小的画布,用“星型工具”画一个四叶草图案,为它加一个“纯色阴影滤”镜。
按F8转换为“动画”元件,设为用21帧转过360度。不要忘了在帧面板中删除掉帧21。然后选中帧1。
图1
2. 这一步是核心效果。为这个动画实例添加一个EyeCandy4.0的“运动痕迹”滤镜,参数就自由选择了。
按下播放按钮就可以看到滤镜是如何模拟到3d效果的了。
图2
3. 最后新建一个层,放标题和签名,将该层置于顶部,钩选“共享交叠帧”。
一个仿3D动画的gif就3步被K.O.了。
Fireworks巧用素材制作石头字效果
Firewoks打造液体金属表面
效果如下:
1、Fireworks中新建20*50的矩形,黑白线性填充,羽化10:
2、选择笔触选项:
3、笔触选项参数如下,再点击高级,选择形状,参数如下:
4、选择内侧阴影,参数如下:
5、选择曲线,参数如下:
Fireworks滤镜巧绘极光字
第一步:在Fireworks中新建文件,大小自定,在这里我建的是(531*433)。背景为黑色,输入字体A(字体为ARIAL BLACK),颜色为(白色),选中字体A,将字体转换为路径(CTRL+SHIFT+P)。充填:(空),描边:大小(6),描边颜色:(白色),描边种类:(1素象柔化),边缘为(0)。得到如下效果:
第二步:选中字体,再选“效果--->Aline skin splat LE---->Edges”,属性如图:
得到如下效果:
第三步:选中字体点选“效果--->EYE CANDY4000---->动作轨迹滤镜”,属性如下图:
得到效果如下:
第四步:复制4个做好的字体效果,(选中字体CTRL+C)粘贴(CTRL+V),把复制出来的字体效果里的动作轨迹滤镜里面的角度属性分别更改为(90)(180)(0)度。得到效果如图:
第五步:将4个不同方向的运动轨迹字体效果合并在一起,得到效果如下图:
最后在给效果做一个前景效果点缀一下。制作方法是为第一步修改一下字体的描边属性如下图。也可以直接复制做好的效果后,在把里面的滤镜效果去掉。
得到效果如下
最后把所有效果合并在一起就完成了。要是想要给图片上色,请将所有效果图组合(CTRL+G)在一起在,用色相饱和度来调整。上色效果图:
以上教程纯属提供思路,大家还可以试一下其他角度的变化,可以得到更多的效果。原文链接
Png源图:
Fireworks CS3切片工具
在Fireworks或者是PhotoShop中设计好的网页效果图,需要导入到Dreamweaver中进行排版布局。在导入到Dreamweaver之前,可以使用Fireworks对效果图进行切片和优化,然后才能够把优化好的切片输出到Dreamweaver的站点中进行布局。切片的目的是为了获得图像素材,也就是说能够通过写XHTML语言脚本实现效果的部分,就不需要切片,而必须用图像的地方,则一定要切片。下面通过一个实例来给大家介绍一下Fireworks CS3的切片和优化功能,具体操作步骤如下:
1. 在Fireworks CS3中打开制作好的网页设计效果图,如图所示。
在Fireworks CS3中打开制作好的效果图
【说明】效果图中的辅助线是在效果图设计之初就添加完毕的。
2. 选择Fireworks CS3中的【切片】工具,对效果图进行切片,切片完成后的效果如图所示。
切片完成后的效果
【说明】切片的时候,尽量保证所有的切片和被切片的图像尺寸一致,不要切片大于或者小于被切片的图像,同时切片之间尽量保持不要重叠。
3. 几个特别需要注意的地方来详细给大家说一下,首先是在内容区域,文本的前方有小的黑色三角箭头,这是用图像来制作的,所以必须要切片,但是由于所有文本前方的箭头图标都是一样的,所以只需要切一张即可。如图所示。
切片小图标
4. 同样的道理,在这个效果图中,有很多的圆角效果,但是在切片的时候同样的效果仍旧只切片一张即可。如图所示。
切片圆角图像
5. 切片完成后,选择Fireworks CS3中的【2幅】窗口,如图1-27所示。在这个窗口的左侧,是可编辑的原图,而在这个窗口的右侧,则是优化以后的图像。在这个窗口的下方,可以看到详细的关于每一个切片的文件量和下载时间等信息。
Fireworks的【2幅】窗口
6. 按快捷键【F6】,打开Fireworks CS3的【优化】面板,使用【指针】工具,在【2幅】窗口的左侧依次选择切片,然后在【优化】面板中进行相应的优化操作,最终优化后的图像效果,可以在【2幅】窗口的右侧进行观察,如图所示。
对切片进行优化
- 默认分类(20)
- J2EE(25)
- Java(56)
- PHP(55)
- SEO(10)
- 网页设计(20)
- 网站建设(37)
- 数据库(7)
- JavaScript(17)
- JQuery(6)
- MySQL(20)
- SQL Server(6)
- Access(1)
- Oracle(6)
- office(6)
- Dreamweaver(4)
- Photoshop(12)
- Flash(9)
- Fireworks(13)
- CSS(14)
- HTML(4)
- .NET(7)
- ASP(2)
- DB2(1)
- Ajax(2)
- Linux(12)
- Struts(7)
- Hibernate(8)
- Spring(2)
- Jsp(22)
- Asp(8)
- C#(3)
- C++(1)
- 网络安全(5)
- 软件工程(7)
- XML(1)
- English(2)
- 计算机等级考试(2)
- 计算机病毒(4)
- 个人日志(76)
- 互联网(15)
- ActionScript(10)
- Android(3)
- 数据结构与算法(1)
- 游戏策略(3)
- 美文翻译(2)
- 编程开发(19)
- 计算机应用(4)
- 计算机(10)
- Unity3d(6)
- 其他(1)
- egret(1)