介绍一下使用Fireworks制作全局菜单设计的方法。
全局菜单是网页设计必不可少的项目。这次制作一个特别简单的全局菜单。
制作方法不是很难但是如果想达到专家那种水平,还有几点很细微的地方需要注意。这次这些细微的地方请大家一定要注意。
首先使用Fireworks描画一个长方形作为菜单的原型。
使用长方形工具画一个和全局菜单一样大的长方形。适当涂色(在下一步中进行设定)、不要设定图形的线框。
对第一步zhogn做好的全局菜单使用渐变功能。
选择长方形之后、使用属性检查器功能设定线形渐变,就像上面刚才说的一样设定颜色。这次我们进行了浅蓝色的渐变设定。
这里有一个小窍门。渐变色尽量使用同一色系来减少颜色变化产生的误差。渐变的时候尽量进行微变是其中的一个小窍门
这次我们进一步对全局菜单使用微小的斜线功能。
选择长方形,属性检查器中选择[斜线1]。设定适用范围为10%。
这里和渐变功能一样,斜线也设定为微小变化,这也是一个小窍门。如果提高斜线的适用范围就容易给别人一种业余水平的感觉。
到这里,我们暂停一下,来看看做好的目标图形。
微小的渐变功能产生了。也可以涂上颜色但是,稍微加上了渐变的功能,可是给人的感觉可使完全不一样的。
不要害怕麻烦,很小的效果一点一点积累起来,可就会出现很大的变化哟。下一步中我们为了尽量进一步提高质量,来使用一下过滤功能。
首先在全局菜单的外围添加线框。
选择长方形,属性检查器中的过滤功能上点击「+」,然后点击Photoshop现场效果
[Photoshop现场效果]的对话框会弹出来,点击左边的[线框],然后就设定好了。但是先不要点击OK。
进一步的在全局菜单中添加内侧凸出功能。
同样点击对话框左边的[凸出和浮雕]然后就设定好了、点击OK。随着阴影的透明度的下降来完成最自然的样子。
经过以上的制作全局菜单的背景就制作好了!
下面、向全局菜单中添加分隔线。
使用线形工具按照上面所说的那样在想分隔开的地方添加两条并列的线。
这里又有一个小窍门。左边的线的颜色要和菜单的外侧的线设定成同一个颜色(或者是接近的颜色),右边的线设定成亮色(和凸出的阴影差不多的颜色)。
深色和浅色的线各一条的并列设置,从远处看的时候能有一种微小的凹凸的立体感。
复制并且粘贴在第六步中做好的两条分隔线,在全体页面中进行配置。
最后在菜单中输入字就做完了!
字体横向调整对齐的时候使用整列版面调整是很方便的。
一个简单的全局菜单就做好了!
也就是说下滑页面的时候,上下翻转渐变就能出现上图的那种样子。这是经常使用的表现形式之一。
怎么样啊?制作方法应该不是很难吧。但是,有几个让你看上去不显得那么业余的小窍门。这是很重要的几个点,一定一定要记住好好应用。