软件开发培训班 >> 创意设计 >> Fireworks


Fireworks 4功能指南之一

　　这是一个演示，将带你感受在一个典型站点中创造几个新页面的全过程。本演示按照这个过程的不同阶段被分成几个部分。如果你需要更多的帮助信息，在Fireworks里也包括了一个帮助。

　　第一步：安装

　　Fireworks：CD中包括了Fireworks的安装程序。CD中还有Alien Skin提供的Alien Skin Eye Candy的演示版本。安装Eye Candy文件夹到你的xtras文件夹中。

　　Dreamweaver 4 CD中包括了Dreamweaver Demo版的安装程序。

　　Macromedia Flash 5 CD中包括了Macromedia Flash 5 Demo版的安装程序。

　　在我们开始以前，先讲一个名词--“选择物体”：

　　在这整个演示中，我将经常提起“选择物体”这个名词。意思是，在工具栏中选择指针工具，点击你想选择的物体。如果想一下子选择多个物体，你也能这样做。方法有两种：

　　1. 按下Shift键，然后再用指针工具选择别的物体。

　　2. 用指针工具，点击并拖出一个区域，被这个区域所包含的物体都被选中。




在本地输出带有层的Photoshop文件......


打开Demo_04.png或者继续刚才你的演示文件。

　　现在我们有了我们网页的基本构思，我们可以把它输出成带有层的Photoshop文件。Fireworks可以将每个遮照物体输出为每个图标的遮照层，因此在Photoshop中进行设计工作可以使用相同的遮照，并且保证图标一样大小。

　　在本地输出带有层的Photoshop文件

  • 从菜单中选择File/Export
  • 在对话框中，在下拉菜单中选择Photoshop PSD格式
  • 输出的名字为"Layout.psd"




    • 　　矢量编辑

  • 打开Demo_04.png或者继续工作在你的演示文件中。我们将在活动图标下面的主要白色区域创建三个带有软边斜角的按钮
  • 在菜单中选择File/Import
  • 定位Icons.png
  • 在主要的白色区域的活动的位图图标下面单击放置icons.png文件




    • 创建倾斜的按钮在图标后面......


    　　现在,我们将创建倾斜的按钮在图标后面
  • 选择长方形工具
  • 拖出长方形
  • 在Info面板中，尺寸设置为70W×40h
  • 在Object面板中，设置圆角为30




  • 在Fill面板，选择linear模式
  • 在Fill面板中，单击edit按钮来编辑渐变色
  • 单击左面的颜色方块选择米色#CCCC99




  • 单击右边的方块，并且选择高亮的兽皮颜色#cc9966
  • 在渐变编辑器外面单击来关掉它
  • 在Fill面板，改变填充的Edge，把Hard改成Anti-aliased
  • 现在，让我们调整渐变色以便我们可以从上到下，在矩形按钮上垂直地渐变
  • 在矩形物体上，拖动渐变填充线上的黑色小园点，将它拖到靠近物体顶端
  • 拖动渐变填充线上的黑色矩形小方框，将它移动到物体的底端。确保连接这两个小点的线是完全垂直的




  • 在Effects panel面板中，选择Bevel&Emboss/Inner Bevel
  • 在下拉菜单中把"Flat"改成"Smooth"
  • 在Bevel窗口外单击关掉这个窗口
  • 当按钮还是被选择时，按住Option键（Mac）或者按住Alt键（PC），单击按钮向下拖来进行复制
  • 再次进行复制，这样你就有了三个按钮，三个图标各有一个
  • 放置每个按钮在图标的上面，并且按钮的左边缘和文字块的左边缘对齐



    •