第5章 Fireworks基本操作

第五章Fireworks基本操作本章內(nèi)容提要：1.fireworks的工作界面2.文字特效制作3.樣式面板的使用4.基本圖像繪制5.編輯位圖圖像6.圖像的模糊、銳化和羽化7.圖層和蒙板8.添加動態(tài)濾鏡9.熱區(qū)本章目標(biāo)任務(wù)：1.掌握fireworks的基本操作方法；2.熟悉利用fireworks進(jìn)行文字特效制作、繪圖和圖像處理的方法。Fireworks中最常用的文件類型使用Fireworks，您可以在一個專業(yè)化的環(huán)境中創(chuàng)建和編輯網(wǎng)頁圖形、對其進(jìn)行動畫處理、添加高級交互功能以及優(yōu)化圖像。PNG，即可移植網(wǎng)絡(luò)圖形，是Fireworks的本身文件格式。PNG是一種通用的網(wǎng)頁圖形格式，可支持多達(dá)32位的顏色，包含透明度或alpha通道，并且是連續(xù)的。GIF，即圖形交換格式，是一種很流行的網(wǎng)頁圖形格式，可用于卡通、徽標(biāo)、包含透明區(qū)域的圖形以及動畫。GIF中最多包含256種顏色。JPEG，是由JointPhotographicExpertsGroup（聯(lián)合圖像專家組）專門為照片或增強色圖像開發(fā)的圖像格式。JPEG格式最適合于數(shù)字或掃描的照片、使用紋理的圖像、具有漸變顏色過渡的圖像和任何需要256種以上顏色的圖像。Fireworks的工作界面樣式面板的使用

通過創(chuàng)建樣式，可以保存并重新應(yīng)用一組預(yù)定義的填充、筆觸、濾鏡和文本屬性。將樣式應(yīng)用于對象后，該對象即具備了該樣式的特性。Fireworks提供了許多預(yù)定義的樣式?？梢蕴砑印⒏暮蛣h除樣式。還可將樣式導(dǎo)出以便與其他Fireworks用戶共享，或者從其它Fireworks文檔導(dǎo)入樣式。輸入文本的方法1.單擊工具面板上的文本工具。2.在圖片上需要添加文字的位置單擊一下，就會出現(xiàn)一個文字插入框，供輸入文本。若要輸入分段符，請按Enter鍵。3.需要編輯文字時，可使用指針工具或部分選定工具單擊文本塊，從而將其全部選中；或者選擇文本工具，然后在文本框內(nèi)拖動鼠標(biāo)選中文本，然后在屬性面板中進(jìn)行設(shè)置格式?！纠?.1】使用樣式面板制作特效文字（1）執(zhí)行“文件”→“新建”菜單命令，新建一個圖片文件。（2）單擊工具面板上的【文本】工具按鈕。（3）在圖片上需要添加文字的位置單擊一下，就會出現(xiàn)一個文字插入框，此時輸入文字“fireworks學(xué)習(xí)”。（4）執(zhí)行“窗口”→“樣式”菜單命令，打開樣式面板，選擇樣式“style56”。（5）剛才輸入的文字就變成如上圖的效果了。而在屬性面板中，該樣式所對應(yīng)的屬性也被自動設(shè)置好了，如下圖所示。【例5.1】使用樣式面板制作特效文字重復(fù)步驟2-4，應(yīng)用其他樣式可以做出如圖所示的更多文字效果。

基本圖像繪制Fireworks有許多矢量對象繪制工具。使用這些工具可以通過逐點繪制來繪制基本形狀、自由變形路徑和復(fù)雜形狀。繪制直線、矩形或橢圓的方法：從“工具”面板中選擇“直線”工具、“矩形”工具或“橢圓”工具。如果需要，在“屬性”面板中設(shè)置筆觸和填充屬性。在畫布上拖動以繪制形狀：【例5.2】繪制五角星（1）執(zhí)行“文件”→“新建”菜單命令，在打開的“新建文檔”對話框中，寬度和高度均設(shè)置為200像素，畫布顏色設(shè)置為白色，點擊確定。（2）在“工具”面板上，按住“矩形”工具按鈕，會彈出工具按鈕，選擇“多邊形”工具。（3）如圖設(shè)置“屬性”面板中的屬性，將填充顏色設(shè)為綠色，形狀設(shè)為“星形”，邊設(shè)為“5”，角度設(shè)為“63”。（4）在畫布上按住鼠標(biāo)并拖動，即可繪制星形。（5）執(zhí)行“編輯”→“克隆”菜單命令，克隆一個一樣的星形?！纠?.2】繪制五角星（6）執(zhí)行“修改”→“變形”→“數(shù)值變形”菜單命令，打開“數(shù)值變形”對話框，將寬、高均設(shè)定為“50%”。（7）在“屬性”面板中，把填充色修改為白色。（8）執(zhí)行“效果”→“高斯模糊”菜單命令，在彈出的“高斯模糊”對話框中單擊【確定】按鈕。即完成如圖所示效果。使用“鉛筆”工具和“刷子”工具若要用“鉛筆”工具繪制對象，步驟如下：選擇“鉛筆”工具。在“屬性”面板中設(shè)置工具選項：“消除鋸齒”對您繪制的直線的邊緣進(jìn)行平滑處理?！白詣硬脸碑?dāng)“鉛筆”工具在筆觸顏色上單擊時使用填充顏色?！氨３滞该鞫取睂ⅰ般U筆”工具限制為只能在現(xiàn)有像素中繪制，而不能在圖形的透明區(qū)域中繪制。拖動以進(jìn)行繪制。按住Shift鍵并拖動可以將路徑限制為水平、豎直或傾斜線。若要用“刷子”工具繪制對象，步驟如下：選擇“刷子”工具。在“屬性”面板中設(shè)置筆觸屬性。拖動以進(jìn)行繪畫。選擇位圖區(qū)域“選取框”工具在圖像中選擇一個矩形像素區(qū)域?！皺E圓選取框”工具在圖像中選擇一個橢圓形像素區(qū)域?！疤姿鳌惫ぞ咴趫D像中選擇一個自由變形像素區(qū)域?！岸噙呅翁姿鳌惫ぞ咴趫D像中選擇一個直邊的自由變形像素區(qū)域，方法是在要選擇的像素區(qū)域范圍周圍重復(fù)單擊?！澳g(shù)棒”工具在圖像中選擇一個像素顏色相似的區(qū)域，通過在“屬性”面板中調(diào)整“魔術(shù)棒”的“容差”和“邊緣”選項，可以控制“魔術(shù)棒”選擇像素的方式。裁剪使用“裁剪”工具或執(zhí)行“編輯”“修剪位圖”菜單命令都可以裁剪位圖。步驟如下：選擇工具面板上的“裁剪”工具。拖動鼠標(biāo)將要保留的區(qū)域框住。裁剪手柄出現(xiàn)在整個所選位圖的周圍。調(diào)整裁剪手柄，直到定界框圍在位圖圖像中要保留的區(qū)域周圍。若要取消裁剪選擇，請按Esc鍵。在定界框內(nèi)部雙擊或按Enter鍵以裁剪選區(qū)。所選位圖中位于定界框以外的每個像素都被刪除，而文檔中的其它對象保持不變。擦除可以用“橡皮擦”工具刪除像素。若要擦除所選位圖對象或像素選區(qū)中的像素，步驟如下：選擇“橡皮擦”工具。在“屬性”面板中，選擇圓形或方形的橡皮擦形狀。拖動“屬性”面板中的“邊緣”滑塊來設(shè)置橡皮擦邊緣的柔和度。拖動“屬性”面板中的“大小”滑塊來設(shè)置橡皮擦的大小。拖動“屬性”面板中的“橡皮擦不透明度”滑塊來設(shè)置不透明度。在要擦除的像素上拖動“橡皮擦”工具?！跋鹌D章”工具選擇“橡皮圖章”工具。單擊某一區(qū)域?qū)⑵渲付樵矗匆寺〉膮^(qū)域）。此時，取樣指針即會變成十字型指針。注意：要指定另一個要克隆的像素區(qū)域，可以按住Alt鍵并單擊另一個像素區(qū)域，將其指定為源。將鼠標(biāo)移到圖像的其它部分并拖動指針。可以看到兩個指針。第一個是克隆源，為十字型。根據(jù)您已選擇的刷子首選參數(shù)，第二個指針可以是橡皮圖章、十字型或藍(lán)色圓圈形狀。拖動第二個指針時，第一個指針下的像素會復(fù)制并應(yīng)用于第二個指針下的區(qū)域?！纠?.3】位圖的編輯

【例5.3】位圖的編輯（1）執(zhí)行“文件”→“打開”菜單命令打開文檔“car.jpg”。（2）選擇工具面板上的“魔術(shù)棒”工具，在圖片空白處點擊一下，即選中空白區(qū)域。（3）選擇工具面板上的“漸變”工具。（4）在“屬性”面板上，按下“填充顏色”按鈕向下的箭頭，設(shè)置漸變色，點擊左邊的顏色樣本改為黃色，右邊的顏色樣本改為白色。（5）再將“屬性”面板上的紋理設(shè)置為“鋼琴鍵”。（6）在選中的空白區(qū)域內(nèi)單擊，即將漸變色運用到選區(qū)中?！纠?.3】位圖的編輯（7）選擇工具面板上的“裁剪”工具。在圖片中框出一塊區(qū)域，寬500，高300像素。（8）將框調(diào)整到適當(dāng)位置后，雙擊該區(qū)域，即完成裁剪。最后效果如圖所示?！澳：惫ぞ吆汀颁J化”工具

“模糊”工具和“銳化”工具可以影響像素的焦點?！澳：惫ぞ咄ㄟ^有選擇地模糊元素的焦點來強化或弱化圖像的局部區(qū)域，其方式與攝影師控制景深的方式很相似?！颁J化”工具對于修復(fù)掃描問題或聚焦不準(zhǔn)的照片很有用。模糊處理模糊處理可柔化位圖圖像的外觀。Fireworks提供了六種模糊選項：“模糊”柔化所選像素的焦點。“進(jìn)一步模糊”的模糊處理效果大約是“模糊”的三倍?！案咚鼓：睂γ總€像素應(yīng)用加權(quán)平均模糊處理以產(chǎn)生朦朧效果?！斑\動模糊”產(chǎn)生圖像正在運動的視覺效果?！胺派錉钅：碑a(chǎn)生圖像正在旋轉(zhuǎn)的視覺效果?！翱s放模糊”產(chǎn)生圖像正在朝向觀察者或遠(yuǎn)離觀察者移動的視覺效果。若要對圖像進(jìn)行模糊處理，步驟如下：選擇圖像。執(zhí)行下列操作之一：在“屬性”面板中，單擊“添加動態(tài)濾鏡”按鈕，然后從“濾鏡”彈出菜單中選擇“模糊”“模糊”或其他模糊選項。選擇“濾鏡”“模糊”“模糊”菜單命令或其他模糊選項。銳化處理可以使用“銳化”功能校正模糊的圖像。Fireworks提供了三種“銳化”選項：“銳化”通過增大鄰近像素的對比度，對模糊圖像的焦點進(jìn)行調(diào)整?！斑M(jìn)一步銳化”將鄰近像素的對比度增大到“銳化”的大約三倍?！扳g化蒙版”通過調(diào)整像素邊緣的對比度來銳化圖像。該選項提供了最多的控制，因此它通常是銳化圖像時的最佳選擇。若要使用銳化選項對圖像進(jìn)行銳化處理，步驟如下：選擇圖像。執(zhí)行下列操作之一選擇銳化選項：在“屬性”面板中，單擊“添加動態(tài)濾鏡”按鈕，然后從“濾鏡”彈出菜單中選擇“銳化”“銳化”或其他銳化選項。選擇“濾鏡”“銳化”“銳化”菜單命令或其他銳化選項?！纠?.4】羽化實例

1.執(zhí)行“文件”“打開”菜單命令，打開一張圖片。2.選擇“工具”面板上的“橢圓選取框”工具，如圖5-24所示在圖片上框出一塊橢圓形區(qū)域。3.執(zhí)行“選擇”“羽化”菜單命令，在打開的對話框中設(shè)置羽化值為“10”。4.執(zhí)行“選擇”“反選”菜單命令，選擇圖片的其他部分。5.按下鍵盤上的Delete鍵將所選部分刪除，效果如圖5-24所示。圖層層將Fireworks文檔分成不連續(xù)的平面，就像是在描圖紙的不同覆蓋面上繪制插圖的不同元素一樣。一個文檔可以包含許多個層，而每一層又可以包含很多對象。在Fireworks中，“層”面板列出層以及每一層包含的對象?！皩印泵姘屣@示文檔的當(dāng)前幀中所有層的當(dāng)前狀態(tài)?；顒訉拥拿Q在“層”面板中高亮顯示?？梢哉归_層查看它上面的所有對象的列表。對象以縮略圖的形式顯示。蒙板蒙板是使用一個半透明的對象將下層對象遮住，通過調(diào)節(jié)透明度來達(dá)到不同的效果。利用蒙板可以隱藏或顯示對象或圖像的某些部分，使用多種蒙板技術(shù)可以創(chuàng)造出豐富的透明效果?？梢允褂谩皩印泵姘寤颉熬庉嫛?、“選擇”或“修改”菜單來創(chuàng)建蒙板。創(chuàng)建蒙板后，可以調(diào)整畫布上被遮罩選區(qū)的位置，或者通過編輯蒙板對象來修改蒙板的外觀。還可以將蒙板作為一個整體應(yīng)用轉(zhuǎn)換，或者對蒙板的組件分別應(yīng)用轉(zhuǎn)換?！纠?.5】文字蒙板

（1）創(chuàng)建一個空白文檔（400*300像素），畫布顏色為黑色，選擇工具面板中的“刷子”工具在屬性面板中設(shè)置筆觸屬性。（2）使用筆刷在文檔中拖動，繪制位圖圖像

(3)使用“文字”工具在文檔中輸入：HAPPYLIFE，在屬性面板中設(shè)置文字屬性。(4)按住鍵盤上的CTRL鍵，在層面板中選擇文字層和位圖層后松開，執(zhí)行“修改”→“蒙板”→“組合為蒙板”命令，即可完成蒙板效果的創(chuàng)建。

【例5.6】粘貼為蒙板（1）打開一張圖片文件，選擇“橢圓”工具，邊按住鍵盤上的Shift鍵邊拖動鼠標(biāo)可以在圖片上畫一個圓，然后克隆一個一樣的圓，用“指針”工具調(diào)整兩個圓的位置,如下圖所示。

（2）按住鍵盤上的Shift，同時選中這兩個圓。（3）執(zhí)行“修改”→“組合”菜單命令，將兩個圓組合在一起。（4）執(zhí)行“編輯”→“剪切”菜單命令，剪切兩個圓?！纠?.6】粘貼為蒙板（5）選擇要遮蓋的圖片，執(zhí)行“編輯”→“粘貼為蒙板”菜單命令。，即可產(chǎn)生如圖5-31所示的效果?！纠?.6】粘貼為蒙板（6）使用“部分選定”工具在畫布上選擇蒙板，在屬性面板上將路徑筆觸顏色改為白色，蒙板改為：灰度外觀。蒙板效果即變?yōu)槿缦聢D所示。添加動態(tài)濾鏡Fireworks動態(tài)濾鏡是可以應(yīng)用于矢量對象、位圖圖像和文本的增強效果。動態(tài)濾鏡包括：斜角和浮雕、純色陰影、投影和光暈、顏色校正、模糊和銳化?？梢灾苯訌摹皩傩浴泵姘逯袑討B(tài)濾鏡應(yīng)用于所選對象。當(dāng)編輯應(yīng)用了動態(tài)濾鏡的對象時，F(xiàn)ireworks會自動更新動態(tài)濾鏡。應(yīng)用動態(tài)濾鏡后，可以隨時更改其選項，或者重新排列濾鏡的順序以嘗試應(yīng)用組合濾鏡。在“屬性”面板中可以打開和關(guān)閉動態(tài)濾鏡或者將其刪除。刪除濾鏡后，對象或圖像會恢復(fù)原來的外觀。動態(tài)濾鏡普通圓角矩形、內(nèi)斜角效果、外斜角效果普通文字、凸起浮雕效果和凹入浮雕效果投影效果、內(nèi)側(cè)陰影效果、發(fā)光效果

熱區(qū)

Web設(shè)計人員可以使用熱點來使較大圖形中的各個小部分產(chǎn)生交互，并將網(wǎng)頁圖形的區(qū)域鏈接到URL。通過從包含熱點的文檔中導(dǎo)出HTML，可以在Fireworks中創(chuàng)建圖像映射。實訓(xùn)指導(dǎo)5【實訓(xùn)項目】制作桌上的兩本書，效果如圖所示。實訓(xùn)指導(dǎo)5實訓(xùn)步驟如下：Step1：執(zhí)行“文件”→“新建”菜單命令，畫布大小400*300像素。Step2：用矩形工具在畫布上繪制一個和畫布一樣大的矩形，在屬性面板上將填充顏色設(shè)為#DFCFC0，添加動態(tài)濾鏡：“雜點”→“新增雜點”：數(shù)量4。Step3：用矩形工具在畫布上繪制一個矩形，用“漸變”→“放射狀”填充，設(shè)置漸變色從#9B4D54到5E161B。Step4：用指針工具選中書本，調(diào)整漸變的方向。在屬性面板上為其添加動態(tài)濾鏡“雜點”→“新增雜點”：數(shù)量4。添加動態(tài)濾鏡“陰影和光暈”→“投影”：設(shè)置距離5，柔化4，不透明度60%。實訓(xùn)指導(dǎo)5Step5：在書本上再繪制一個略小一點的矩形做書本邊框，如圖5-44所示。在屬性面板上，把矩形設(shè)置成：無填充，邊框：白色，筆尖大?。?，描邊種類：“噴槍”→“紋理”，不透明度：80%。Step6：接下來，在書本的左側(cè)添加折痕，如圖5-45所示，按住Shift鍵的同時，用直線工具在左邊框附近畫一條直線。在屬性面板上把顏色設(shè)置成#461516，筆尖大?。?，描邊種類：實線。同樣的方法在這條直線的右側(cè)緊挨著畫另一條直線，在屬性面板上把顏色設(shè)置成白色，筆尖大?。?，描邊種類：實線，不透明度：13%。Step7：如圖5-46所示，用文字工具在書本上添加文字“LoveStory”，在屬性面板上將字體設(shè)置成：“ComicSansMS”，大小：20。添加動態(tài)濾鏡：“陰影和光暈”→“發(fā)光”：設(shè)置寬度2，柔化2，不透明度30%。實訓(xùn)指導(dǎo)5Step8：如圖5-46添加文字“COMPLETEBOOK”,在屬性面板上將字體設(shè)置成：“Impact”，大?。?，顏色：#531A1B。Step9：執(zhí)行“窗口”→“層”菜單命令可打開層面板，在“層”面板上，按住鍵盤上的Shift鍵，選中構(gòu)成書本的所有層，執(zhí)行“修改”→“組合”菜單命令將它們組合在一起。Step10：執(zhí)行“編輯”→“克隆”菜單命令，克隆一個一樣的書本。執(zhí)行“修改”→“變形”→“傾斜”菜單命令，用鼠標(biāo)拖動即可調(diào)整書本的傾斜角度。書本就制作完成了。綜合練習(xí)51、選擇題（1）對于在Fireworks中的矢量圖像和位圖圖像，如果執(zhí)行放