Linux中国  设为主页
 收藏本站
 
当前位置: > 首页 ->网站设计 ->Fireworks ->用FW MX的变形工具制作大脚印图标
  相关分类: 
AJAX教程
CSS/CSS2
Dreamweaver
Fireworks
Flash
HTML/DHTML
JavaScript
Phososhop
网页制作
  站内搜索: 
热门文章排行
热门文章排行 闪光略过的GiF动画(04-27)
QQ皮肤制作全程实录(04-27)
Fireworks巧绘精美闪图动画(06-06)
Fireworks Eyecandy滤镜作虚化残缺边(06-06)
三分钟创建网页相册(04-27)
精采文章排行
精采文章排行 巧用FW MX的笔触制作宣纸书法(06-06)
用FW MX的变形工具制作大脚印图标(06-06)
FW MX和Flash MX的亲密合作(06-06)
Fireworks MX 制作燃烧效果(06-06)
Fireworks MX的新特性(06-06)
  ·用FW MX的变形工具制作大脚印图标·FW MX和Flash MX的亲密合作·Fireworks MX 制作燃烧效果·Fireworks MX的新特性·Fireworks Eyecandy滤镜作虚化残缺边缘·Fireworks简单制作残破边缘技巧·Fireworks制作仿古羊皮纸效果·体验Adobe Fireworks CS3新特性·Fireworks绘制硬壳厚皮烫金书

用FW MX的变形工具制作大脚印图标

作者:Webmaster   来源:Linuxdby.com   点击:   日期:2007-06-06 [收藏] [投稿]

  IE是否经常中毒?推荐您

 

  在我们平时设计网页的时候,不免要经常动手制作一些小的图标以满足实际的需要。Fireworks MX既然做为三剑客之一,在这方面自然有自己独特之处。我们今天就以"大脚印"图标为例子来讲解一些如何使用Fireworks轻松设计网站图标。

  步骤1:

  打开Fireworks MX,使用菜单命令File-New,新建一个文件,宽与高均为300像素,背景色为白色。

  步骤2:

  在工具栏上选择画圆工具(Ellipse Tool),并且在Properties面板上设置填充色为黑色,边框色无(如图1),绘制一个椭圆(如图2)。目前不需要理会椭圆的大小,只要便于你编辑就可以,我们将在后面再更改其大小,由于Fireworks绘制的椭圆是矢量图形,我们不需要担心在改变大小后影响清晰度。

  
图1                图2

  步骤3:

  在工具栏上选择Freeform Tool,按住鼠标将出现一个下拉菜单。选择Reshape Area Tool(如图3),此工具可以通过拖动鼠标直接编辑矢量图形的轮廓而不需要手工的一个节点一个节点的编辑。

图3

  我们只需要在被编辑的矢量元件上拖曳鼠标,Fireworks MX将自动的添加、删除节点,并且根据设置的变形数值进行变形。拖动在工作区域下面的Properties面板上的size选项后的滑动杆,调整数值为130(如图4)。

图4

  拖动Strength选项后的滑动杆,调整数值为80。使用鼠标在辉煌子的椭圆上拖曳,我们可以看到椭圆发生变形(如图5)。

图5

  步骤4:

  重复以上操作,使最后的拖变形为如图所示(如图6)。在工具栏上能够选择Scale Tool,按住键盘上的Shift键做等比例缩放,调整大小。

图6

  步骤5:

  在工具栏上选择Ellipse Tool,按住键盘Shift键绘制一个正圆,填充色为黑色,这就是脚印中的大拇指。复制这个正圆,并改变大小与位置,直到绘制好所有5个脚趾,最后的效果如图所示(如图7)。

图7

  步骤6:

  在键盘上按下Ctrl+A,选择所有元件,使用菜单命令Modify-Group将它们组合起来,再使用Ctrl+C与Ctrl+V进行复制。选择复制出来的脚印,使用菜单命令Modify-Transform-Flip Horizontal将其水平翻转。最后调整位置如图所示,就完成了大脚印的制作(如图8)。

图8

  总结:本例的关键在于灵活的使用Freeform Tool中的一系列工具。利用它们可以很轻松的完成一些效果独特的变形,对于我们的实际工作有很大的帮助。


 如果您对本文有任何疑问或者建议,请到讨论区发表您的意见: >> 论坛入口 <<



上一篇:FW MX和Flash MX的亲密合作   下一篇:巧用FW MX的笔触制作宣纸书法
文章评论】 【收藏本文】 【推荐好友】 【打印本文】 【我要投稿】 【论坛讨论

   相关文章:
·巧用FW MX的笔触制作宣纸书法

   文章评论:(1条)
  
 请留名: 匿名评论   点击查看所有评论 论坛讨论
 

 声明:刊登此文章是为了传递更多信息,文章内容仅供参考,转载请注明出处。