手机软件下载|安卓软件下载|办公软件下载|苹果软件下载|电脑软件下载-手机软件下载中心!
当前位置:软件下载 > 综合资讯 > 软件教程 >

fireworks建造精美图标教程

时间:2017-10-17 01:37  来源:网络整理    热度::

  这篇教程教三联的FIREWORKS喜好者们用fireworks打造精美图标,教程这种先容图标的细节修饰。建造难度中等,转发过来和三联的伴侣们一起进修。

  利用Fireworks(以下简称FW)举办图标设计主要要寄望两点:

  一是FW专注于web设计,不适合缔造一些过于巨大的PS结果,请等候FW CS5的PS滤镜;

  二是FW的编辑方法雷同于AI,假如您习惯于事情在PS类的像素着色情况下,请富丽的飘过。

  接下来进入正题,我们拿一个较量尺度的图标光降摹做说明,这样可以利便您领略。

  下图是海内知名的eico design所创作的一套图标,我们要摹仿的工具就是图中被框住的信封图标。事先说明一下,因为教程的主题,我们会对这个图标插手一些细节,因此我们的最终摹仿功效会与原图不太一样。

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教程

  步调03

  把大的圆角矩形复制一份放到最顶层,用白色箭头共同Shift+偏向键获得一个倒三角,随即复制一份,上面的倒三角用Linear填充渐变;下面的倒三角实心填充褐色,并配置1px羽化。

fireworks打造精美图标 三联网 fireworks教程

  步调04

  用白色箭头选半途中所示那些节点,然后用键盘的偏向键往下挪两个像素,这样使信封看起来长一点(因为这里单个图标不受整体气势气魄约束)。

fireworks打造精美图标 三联网 fireworks教程

  步调05

  把之前画的渐变填充倒三角作垂直翻转,复制一份摆放好,它们的位置干系如下图所示。两个倒三角上下相隔1px多一点。可以用白色箭头东西选择深褐色倒三角上方的四个节点,以鼠标拖动的方法共同帮助线挪动把节点往上挪0.3~0.5个像素,这样可以让深褐色的先显得不那么虚(再一次重申,尽早撤销用 Stroke作边线的动机,这里不是photoshop)。

fireworks打造精美图标 三联网 fireworks教程

  步调06

  寄望样图的图标上方有一道高光,并且不是常见的单像素放射高光(约莫为两个像素的高光处上面的1px高光要亮于下面的1px),因此可以思量用Ellipse这种椭圆形的放射性填充到达这种结果。

fireworks打造精美图标 三联网 fireworks教程

  我们选中并复制最底的圆角矩形两次,移动位置后获得两个上下相隔2px的圆角矩形,用两个矩形路径相减的要领获得一个新的路径,对其举办Ellipse填充(白色0-100透明度),最后把这个高光路径的叠加方法配置为Overlay。

fireworks打造精美图标 三联网 fireworks教程

  步调07

本文地址:http://www.vertu888.com/zonghezixun/ruanjianjiaocheng/28821.html
最近更新
分类选择