fireworks打造精致图标

作者:胡说八道 来源:飞特网会员投稿教程 浏览次数:加载中... 网友评论 0

这篇教程教飞特的fireworks爱好者们用fireworks打造精致图标,教程这种介绍图标的细节修饰。制作难度中等,转发过来和飞特的朋友们一起学习。

使用fireworks(以下简称fw)进行图标设计主要要留意两点:

  1. 一是fw专注于web设计,不适合创造一些过于复杂的ps效果,请期待fw cs5的ps滤镜;
  2. 二是fw的编辑方式类似于ai,如果您习惯于工作在ps类的像素着色环境下,请华丽的飘过。

接下来进入正题,我们拿一个比较标准的图标来临摹做说明,这样可以方便您理解。

下图是国内知名的eico design所创作的一套图标,我们要临摹的对象就是图中被框住的信封图标。事先说明一下,因为教程的主题,我们会对这个图标加入一些细节,因此我们的最终临摹结果会与原图不太一样。

fireworks打造精致图标 飞特网 fireworks教程

步骤01

把需要临摹的图标剪下来作为参考,锁定图层。我这里fw的路径面板是从fireworks cs4中提取的,不过对接下来的操作都无影响,因为我使用的全是cs3包含的功能。

fireworks打造精致图标 飞特网 fireworks教程

步骤02

用rounded rectangle工具画出一个和样图相仿的圆角矩形,使用四个圆角控制点调节好圆角的半径,然后按下ctrl+shift+g把图形打散。
随后把第一个圆角矩形复制一份,用白色箭头工具往四个方向移动一像素,制作出如图所示的两个圆角矩形(注意用白箭头处理好圆角处的八个节点,它们是要对齐的)。

fireworks打造精致图标 飞特网 fireworks教程

我们不能用stroke去给矩形加外边框,因为虚边会把你给搞死。如果你用rounded rectangle工具画出来的圆角矩形已经出现了非stroke虚边,那就把节点打散后,用黑色箭头工具选中那个path,点击路径面板的round points to pixels把路径的所有节点归位到像素交点(也可以用白色箭头工具选中某个节点单独进行归位)。

fireworks打造精致图标 飞特网 fireworks教程

上一篇: fireworks打造超酷炫光
下一篇:

[错误报告] [推荐] [收藏] [打印] [关闭] [返回顶部]

  • 飞特网大部分教程属网友投稿,并不代表飞特网立场。如果您的教程在飞特网发布后没有注明作者和出处请联系我们处理。
    飞特网会员发布的所有作品版权规作者所有,未经作者同意,任何人不得将其用于商业目的;
    如发现本站有含色情等违反国家法律法规内容的图片及涉及个人肖像权及版权的内容,请即时通知我们,飞特网将立刻删除相关内容.本站原创内容,欢迎转载.请注明出处和作者,谢谢!
    访问本站推荐使用分辨率1280*1024,internet explorer7.0浏览器。