首頁 > 網頁教程 > Fireworks > 用Fireworks合成設計制作一個化妝品網站首頁

用Fireworks合成設計制作一個化妝品網站首頁

時間:2010-03-13    作者:網友   來源:藍色理想

本例向朋友介紹運用Fireworks合成設計制作一個化妝品網站首頁,在本例中我們將學習到Fireworks位圖工具的應用、合理運用素材設計網頁設計稿的方法,希望能給朋友們帶來幫助~~

本例是一個以女性化妝品為主打產品的企業宣傳網站的形象頁面效果圖設計。該公司一直致力于結合科技和自然的化妝品產品的研發,主打自然健康的產品理念,因此在整體的頁面設計中以綠色為主要的風格,同時配以女性模特、植物和蝴蝶的素材來體現清新、自然的感覺。如圖1.1所示。

1.1 效果圖

素材如下

   

設計過程:

1.新建一個Fireworks文件。

2.在彈出的【新建文檔】對話框中設置畫布的寬度為760像素,高度為430像素,背景顏色為白色。如圖1.2所示。


圖1.2 【新建文檔】對話框

3.選擇繪圖工具欄中的【選取框】工具,在【屬性】面板中進行相應的設置,如圖1.3所示。


圖1.3 【選取框】工具的屬性設置

4.使用【選取框】工具在畫布的右側繪制一個矩形選區,如圖1.4所示?!?/p>


圖1.4 使用【選取框】工具繪制選區

5.選擇繪圖工具欄中的【漸變】工具 ,這時【屬性】面板會自動變成漸變色的調節屬性。設置漸變的類型為線性漸變,漸變顏色為白色過度到綠色。如圖1.5所示。


圖1.5 【漸變】工具的屬性設置

6.使用【漸變】工具,在畫布右側的選區中單擊鼠標左鍵,漸變色即可填充到當前選區中。如圖1.6所示。填充完畢,按快捷鍵【Ctrl+D】推出位圖編輯模式。


圖1.6 給選區填充漸變色

【說明】使用【漸變】工具在選區單擊,得到的漸變色方向默認為水平方向,如果希望得到不同方向的漸變色,可以使用【漸變】工具在選區中拖拽填充。

相關推薦
Adobe Fireworks CS5 預售版試用手記
Abode Fireworks CS5、CS4、CS3版本的功能比較(圖示)
Fireworks輕松制作漸隱線條
用Fireworks打造光芒四射背景的圖片效果
Fireworks新手教程:制作五彩炫光效果

精彩推薦

熱門教程

百人牛牛辅助