fireworks

Fireworks是Macromedia公司發布的一款專為網路圖形設計的圖形編輯軟體，它大大簡化了網路圖形設計的工作難度，無論是專業設計家還是業餘愛好者，使用Fireworks都不僅可以輕鬆地製作出十分動感的GIF動畫，還可以輕易地完成大圖切割、動態按鈕、動態翻轉圖等，因此，對於輔助網頁編輯來說，Fireworks將是最大的功臣。藉助於MacromediaFireworks8，您可以在直觀、可定製的環境中創建和優化用於網頁的圖像並進行精確控制。Fireworks業界領先的優化工具可幫助您在最佳圖像品質和最小壓縮大小之間達到平衡。它與MacromediaDreamweaver和MacromediaFlash共同構成的集成工作流程可以讓您創建並優化圖像，同時又能避免由於進行Roundtrip編輯而丟失信息或浪費時間。利用可視化工具，無需學習代碼即可創建具有專業品質的網頁圖形和動畫，如變換圖像和彈出菜單等。

2005年，Adobe用34億美元收購macromedia公司，fireworks隨之跟隨至adobe。

2013年05月07日宣布終結CreativeSuite（CS）家族的同時，Adobe宣布迎來CreativeCloud（CC）全新系列應用和服務。MAX大會上，Adobe證實，Web設計、原型設計和移動應用程序設計工具Fireworks被斃掉了。

Adobe表示，他們已經決定，Fireworks不會包含在CC家族中，開發團隊將專註於開發全新的工具來滿足消費者的需求。這樣做的主要原因是，Fireworks、Photoshop、Illustrator、EdgeReflow之間在功能上有較多重疊。

不過，FireworksCS6今後仍然可以使用，也可以購買，不過和CS6套裝以及其它組件一樣，只能買到數字版。只是，Adobe不再為其開發新的功能，今後只是提供必要的安全更新和Bug修復。

Adobe將正式發布CC家族產品，包括：PhotoshopCC、InDesignCC、IllustratorCC、DreamweaverCC、PremiereProCC等，只是沒有FireworksCC了。

Fireworks與Dreamweaver、Flash統稱為網頁三劍客。

創建和編輯矢量圖像與點陣圖圖像，並導入和編輯本機Photoshop和Illustrator文件。

採用預覽、跨平台灰度系統預覽、選擇性JPEG壓縮和大量導出控制項，針對各種交互情況優化圖像。

導入Photoshop(PSD)文件，導入時可保持分層的圖層、圖層效果和混合模式。將Fireworks(PNG)文件保存回Photoshop(PSD)格式。導入Illustrator(AI)文件，導入時可保持包括圖層、組和顏色信息在內的圖形完整性。

網站和各種Internet應用程序構建互動式布局原型。將網站原型導出至AdobeDreamweaver，將RIA原型導出至AdobeFlex。

使用新的頁面板在單個文檔(PNG文件）中創建多個頁面，並在多個頁面之間共享圖層。每個頁面都可以包含自己的切片、圖層、幀、動畫、畫布設置，因而可在原型中方便地模擬網站流程。

採用與AdobePhotoshop類似的新分層圖層結構來組織和管理原型，使您能方便地組織Web圖層和頁面。

應用燈光效果、陰影效果、樣式和混合模式（包括源自Photoshop的7種新的混合模式），增加文本和元件的深度和特性。

公用庫中包含Web應用程序、表單、界面和網站中經常用到的圖形元件、文本元件和動畫，可以使用它迅速開始原型構建過程。

通過9切片縮放智能地縮放矢量圖像或點陣圖圖像中的按鈕與圖形元件。將9切片縮放與新的自動形狀庫相結合，以加速網站和應用程序的原型構建進度。

複製FireworksCS3中的任意對象，並直接粘貼到DreamweaverCS3中。創建可保存為CSS和HTML（標準通用標記語言下的一個應用）的彈出菜單。將Fireworks(PNG)文件直接導出至FlashCS3，導出時可保持矢量、點陣圖、動畫和多狀態不變，然後在FlashCS3中編輯文件。

為Macromedia家族的一員，三劍客之一的FW，這款軟體的主要任務和特色就是製作矢量圖為網頁服務，FW也是Flash的最佳伴侶，在三劍客的MX系列中，FW和Flash的聯繫更為緊密，所以無論是網頁製作和Flash製作，Fw都是不可或缺的利器。在Fw3年的應用實踐過程中，我無時無刻不在感受她的卓越和便利。的確，網頁製作看重的是效果和速度，並不是你用的軟體專業與否，你用了多少個軟體作出的網頁，設計師作出的網頁是為了讓大家接受而不是顯示自己的本領，在這樣的前提下，Fw的確是最好的選擇，最好的矢量圖效果，最快的速度。

在優化面板里有“導出jpg較高品質”，導出默認的80品質（可以用“2幅”畫面對比之前之後的大小）

眾所周知，在網頁上的jpg圖片如果過大，會嚴重影響頁面的打開速度，Fireworks提供優化圖片的功能，即縮小圖片的KB，而且不影響畫面的質量（除非放大了與原圖對比）。由於很多人喜歡用photoshop製作jpg圖片，所以它的容量會很大（因為它是適合處理印刷品，要求較清晰），最終還是要用Fireworks來處理一下。

工具

指針、選擇後方對象【V】，【0】

部分選定【A】，【1】

選取框、橢圓選取框【M】套索、多邊形套索【L】

裁剪、導出區域【C】

魔術棒【W】

線條工具【N】

鋼筆工具【P】

矩形、圓角矩形、橢圓、多邊形【U】

文本工具【T】

鉛筆、刷子【B】

矢量路徑、重繪路徑【P】

縮放、傾斜、扭曲【Q】

自由變形、更改區域形狀【O】

滴管工具【I】

油漆桶、漸變【G】

橡皮擦工具【E】

模糊、銳化、減淡、加深、塗抹【R】

橡皮圖章工具【S】

刀子工具【Y】矩形熱點、圓形熱點、多邊形熱點【J】

切片、多邊形切片【K】

手形工具【H】

縮放工具【Z】

隱藏/顯示切片【2】

設置默認筆觸/填充色【D】

交換筆觸/填充色【X】

切換屏幕模式【F】

菜單命令

新建文件（N)【Ctrl】+【N】

打開（O）…【Ctrl】+【O】

關閉（C)【Ctrl】+【W】

保存（S)【Ctrl】+【S】

另存為（A）…【Ctrl】+【Shift】+【S】

導入（I）…【Ctrl】+【R】

導出（E）…【Ctrl】+【Shift】+【R】

導出預覽（R）…【Ctrl】+【Shift】+【X】

在瀏覽器中預覽【F12】

在輔助瀏覽器中預覽【Ctrl】+【F12】，【Shift】+【F12】

列印（P）…【Ctrl】+【P】

退出（X)【Ctrl】+【Q】

撤消【Ctrl】+【Z】

重做【Ctrl】+Y，【Ctrl】+【Shift】+【Z】

插入新建按鈕（B）…【Ctrl】+【Shift】+【F8】

新建元件（Y）…【Ctrl】+【F8】

熱點（H)【Ctrl】+【Shift】+【U】

切片（S)【Alt】+【Shift】+【U】

查找和替換（F）…【Ctrl】+【F】

剪切（T)【Ctrl】+【X】

複製（C)【Ctrl】+【C】

複製HTML代碼（H）…【Ctrl】+【Alt】+【C】

粘貼（P)【Ctrl】+【V】

清除【退格】，【DEL】

貼入內部（I)【Ctrl】+【Shift】+【V】粘貼屬性（A)【Ctrl】+【Alt】+【Shift】+【V】

重複（L)【Ctrl】+【Alt】+【D】

克隆（N)【Ctrl】+【Shift】+【D】

參數選擇（F）…【Ctrl】+【U】

放大（Z)【Ctrl】+=，【Ctrl】+（小）+，【Ctrl】+【Shift】+【=】

縮小（O)【Ctrl】+-，【Ctrl】+（小）【-】

縮放比率50%【Ctrl】+5，【Ctrl】+（小）【5】

100%【Ctrl】+1，【Ctrl】+（小）【1】

200%【Ctrl】+2，【Ctrl】+（小）【2】

300%【Ctrl】+3，【Ctrl】+(小）【3】

400%【Ctrl】+4，【Ctrl】+（小）【4】

800%【Ctrl】+8，【Ctrl】+（小）【8】

1600%【Ctrl】+6，【Ctrl】+（小）【6】

選區符合窗口大小（S)【Ctrl】+【Alt】+0，【Ctrl】+【Alt】+（小）【0】

文檔符合窗口大小（F)【Ctrl】+0，【Ctrl】+（小）【0】

完整顯示（D)【Ctrl】+【K】

隱藏所選（H)【Ctrl】+【L】

顯示全部（A)【Ctrl】+【Shift】+【L】

標尺（R)【Ctrl】+【Alt】+【R】

顯示網格(G)【Ctrl】+【Alt】+【G】

對齊網格（S)【Ctrl】+【Alt】+【Shift】+【G】

顯示引導線（U)【Ctrl】+【；】鎖定引導線（L)【Ctrl】+【Alt】+【；】

對齊引導線（S)【Ctrl】+【Shift】+【；】

切片引導線（L)【Ctrl】+【Alt】+【Shift】+【；】

隱藏邊緣（E)【F9】

隱藏面板（P)【F4】，【Tab】

選擇全部（S)【Ctrl】+【A】

取消選擇（D)【Ctrl】+【D】

整體選擇（E)【Ctrl】+【→】

部分選定（U)【Ctrl】+【←】

反選（V)【Ctrl】+【Shift】+【I】

修剪畫布（T)【Ctrl】+【Alt】+【T】

符合畫布（F)【Ctrl】+【Alt】+【F】

選擇動畫（A）…【Alt】+【Shift】+【F8】

轉換為元件（C）…【F8】

補間實例（T）…【Ctrl】+【Alt】+【Shift】+【T】

平面化所選（F)【Ctrl】+【Alt】+【Shift】+【Z】

向下合併（D)【Ctrl】+【E】

任意變形（T)【Ctrl】+【T】

數值變形（N）…【Ctrl】+【Shift】+【T】

旋轉90°順時針【Ctrl】+【Shift】+【9】

旋轉90°逆時針【Ctrl】+【Shift】+【7】

移到最前（F)【Ctrl】+【Shift】+【↑】

向前移動（B)【Ctrl】+【↑】

向後移動（S)【Ctrl】+【↓】

移到最後（K)【Ctrl】+【Shift】+【↓】

左對齊(L)【Ctrl】+【Alt】+1，【Ctrl】+【Alt】+（小）【1】

垂直居中（V)【Ctrl】+【Alt】+2，【Ctrl】+【Alt】+（小）【2】

右對齊(R)【Ctrl】+【Alt】+3，【Ctrl】+【Alt】+（小）【3】

頂對齊（T)【Ctrl】+【Alt】+4，【Ctrl】+【Alt】+（小）【4】

水平居中（H)【Ctrl】+【Alt】+5，【Ctrl】+【Alt】+（小）【5】

底對齊（B)【Ctrl】+【Alt】+6，【Ctrl】+【Alt】+（小）【6】

均分寬度（W)【Ctrl】+【Alt】+7，【Ctrl】+【Alt】+（小）【7】

均分高度（D)【Ctrl】+【Alt】+9，【Ctrl】+【Alt】+（小）【9】

合併路徑（J)【Ctrl】+【J】

拆分路徑（S)【Ctrl】+【Shift】+【J】

組合路徑（G)【Ctrl】+【G】

取消組合路徑（U)【Ctrl】+【Shift】+【G】

縮小字體（S)【Ctrl】+【Shift】+【，】

增大字體（L)【Ctrl】+【Shift】+【.】

粗體樣式（B)【Ctrl】+【B】

斜體樣式（I)【Ctrl】+【I】

左對齊（L)【Ctrl】+【Alt】+【Shift】+【L】

右對齊（R)【Ctrl】+【Alt】+【Shift】+【R】

兩端對齊（J)【Ctrl】+【Alt】+【Shift】+【J】

強制齊行（S)【Ctrl】+【Alt】+【Shift】+【S】

附加到路徑（P)【Ctrl】+【Shift】+【Y】

轉換為路徑（C)【Ctrl】+【Shift】+【P】

檢查拼寫（S）…【Shift】+【F7】

重複插件【Ctrl】+【Alt】+【Shift】+【X】

新建窗口（N)【Ctrl】+【Alt】+【N】

顯示隱藏”工具”（T)【Ctrl】+【F2】

顯示隱藏”屬性”（P)【Ctrl】+【F3】

顯示隱藏”答案”（A)【Alt】+【F1】

顯示隱藏”優化”（O)【F6】

顯示隱藏”層”(L)【F2】

顯示隱藏”幀”（R)【Shift】+【F2】

顯示隱藏”歷史記錄”（H)【Shift】+【F10】

顯示隱藏”樣式”（S)【Shift】+【F11】

顯示隱藏”庫”（Y)【F11】

顯示隱藏”URL”（U)【Alt】+【Shift】+【F10】

顯示隱藏”顏色混合器”（M)【Shift】+【F9】

顯示隱藏”樣本”（W)【Ctrl】+【F9】

顯示隱藏”信息”（I)【Alt】+【Shift】+【F12】

顯示隱藏”行為”（B)【Shift】+【F3】

顯示隱藏”查找和替換（F)【Ctrl】+【F】

其它

下一幀【PgDn】，【Ctrl】+【PgDn】

克隆並向上大幅推動【Alt】+【Shift】+【↑】，【Ctrl】+【Alt】+【Shift】+【↑】

克隆並向上輕推【Alt】+【↑】，【Ctrl】+【Alt】+【↑】

克隆並向下大幅推動【Alt】+【Shift】+【↓】，【Ctrl】+【Alt】+【Shift】+【↓】

克隆並向下輕推【Alt】+【↓】，【Ctrl】+【Alt】+【↓】

克隆並向右大幅推動【Alt】+【Shift】+【→】，【Ctrl】+【Alt】+【Shift】+【→】

克隆並向右輕推【Alt】+【→】，【Ctrl】+【Alt】+【→】

克隆並向左大幅推動【Alt】+【Shift】+【←】，【Ctrl】+【Alt】+【Shift】+【←】

克隆並向左輕推【Alt】+【←】，【Ctrl】+【Alt】+【←】

前一幀【PgUP】，【Ctrl】+【PgUP】

向上大幅推動【Shift】+【↑】

向上輕推【↑】

向下大幅推動【Shift】+【↓】

向下輕推【↓】

向右大幅推動【Shift】+【→】

向右輕推【→】

向左大幅推動【Shift】+【←】

向左輕推【←】

播放動畫【Ctrl】+【Alt】+【P】

用所選填充象素【Alt】+【退格】，【Alt】+【DEL】

粘貼於內部【Ctrl】+【Shift】+【V】

編輯點陣圖【Ctrl】+【E】

退出點陣圖模式【Ctrl】+【Shift】+【E】

切片在製作網頁的過程中佔有很重要的地位，切片的成功與否直接決定日後網頁製作的進度快慢和網站運行的速度，只有通過大量的練習才能體會切片的含義

切片介紹

1．切片是將圖片轉換成可編輯網頁的一座橋樑，通過切片才可以將普通圖片變成Dreamweaver可以編輯的網頁格式

2．切片后的圖像可以更快的在網路上傳播

3．切片后的圖像也是網頁中片的主要來源

切片方法

1．切片首先保證切出網頁中需要多次修改的區域，例如文字區域

2．切片圖像的大小盡量保持在15K以內（便於網路傳輸）

3．充分利用Dreamweaver中的自動拼貼功能減少垃圾切片

操作技巧

技巧1：使用鍵盤的方向鍵移動對象時，按住【Shift】鍵不放，每次可以移動10個像素。

技巧2：使用【指針】工具移動對象時，按住【Shift】鍵不放，可以保證其水平或垂直移動。

技巧3：按住【Alt】鍵不放拖拽某個對象，即可對其進行複製。但是自動形狀不能用這個操作，因為自動形狀是一種組合狀態，可以使用複製粘貼命令複製。

技巧4：對於所有的形狀繪製工具而言，按住【Shift】鍵不放進行繪製，可以保證其寬高比始終為1：1。

技巧5：使用基本形狀工具繪製形狀時，按住【空格】鍵不放，不要鬆開滑鼠左鍵，可以移動矢量圖形的位置。繪製選區的時候也是如此。

技巧6：使用【矩形】工具繪製矩形時，按住鍵盤的上或下鍵不放，不要鬆開滑鼠左鍵，可以增加或減少矩形的圓度。

技巧7：需要選擇組內對象時，並不需要取消組合，可以選擇【部分選定】工具來選擇組內對象，這對於多個組合對象的編輯來說非常方便。

技巧8：使用【鋼筆】工具繪製路徑的過程中，按住【Alt】鍵不放，可以隨時調整路徑點的控制手柄。

技巧9：使用【刷子】工具繪製圖像時，按住【Shift】鍵不放，繪製出出一條水平或垂直線后，釋放滑鼠，但不要鬆開【Shift】鍵，繼續繪製，fireworks會把所畫前一條線的終點和后一條線的起點連接起來。

技巧10：按住【Alt】鍵，單擊【層】面板中的點陣圖圖層，可以根據點陣圖的形狀獲得選區。

技巧11：繪製多個選區時，按住【Shift】鍵表示增加選區；按住【Alt】鍵表示減選區；按住【Shift】+【Alt】鍵表示對選區進行交集運算。

技巧12：在給選區填充顏色時，可以使用【Alt】+【Delete】鍵快速填充顏色，與photoshop里填充前景色的快捷鍵一樣。

技巧13：按快捷鍵【Ctrl】+【F8】，可以創建一個新的元件。

技巧14：按住【Ctrl】鍵，單擊【混色器】面板下方的顏色欄，可以快速切換到不同的顏色模式。

技巧15：在顏色彈窗口採集顏色時，按住【Shift】鍵可以確保獲得的顏色為網路安全色。

技巧16：如果要給輔助線精確定位，可以在輔助線上雙擊滑鼠左鍵，在彈出的【移動引導線】對話框中輸入詳細的坐標。

技巧17：在【層】面板中，選中蒙板圖標並像移動圖層那樣按住蒙板圖標將其移動到其他位置，這樣可以刪除蒙板，並且保留下了蒙板對象。

技巧18：使用【文本】工具單擊已經創建的文本，待游標轉換為文本游標時，按住鍵盤上的【Ctrl】加鍵盤的左右鍵可以用來改變字元間距，按住【Ctrl】加鍵盤的上下鍵可以用來改變文本的行距。

學習輔導教材，網路上有很多文字圖片類的和視頻類的教程。另外看書本結合練習也是很好的選擇！

用Fireworks對點陣圖邊緣進行羽化，這是在fireworks運用中常用到的功能，希望對大家學習fireworks有所幫助。

方法一

一、導入點陣圖

二、用橢圓工具，在點陣圖上畫一個橢圓，填充色為黑色。並在其fill面板中，設置edge為feather，默認為10，不過我們可以設得比較大。

三、用黑色箭頭工具全選這二個物體。

四、菜單modify中的mask命令，並在其後序菜單中選擇groupasmask.

五、這樣圖片邊緣羽化也就完成了。用mask做羽化有一個好處，就是當你選擇這個圖片時，邊框是藍色的時候，選中當中的藍色標記，就能把改變圖片的位置。呵呵，這樣你就不需要擔心選擇的地方不正確了，只要確定好最終的圖片大小，就能隨意調節羽化圖片的哪一部份。

六、取消羽化。Modify菜單的最下面命令，ungroup,就能取消羽化，把圖片還原成原先的點陣圖和黑色的橢圓形。

方法二

一、在文件中導入一張需要被羽化的點陣圖（菜單%26gt;file%26gt;import）

二、在工具欄中選擇橢圓形選擇工具或是矩形選擇工具，在點陣圖需要羽化的部位進行選擇。

三、菜單%26gt;modify%26gt;marquee%26gt;feather命令。

四、在featherselection對話框中設置羽化的半徑，這裡我選了20個象素，點擊OK

五、用黑色箭頭工具，把這個選擇框拉到一邊，相應的圖片也跟著移到旁邊。

六、我們可以把不需要的圖片刪除，也可以把這個已經羽化完了的圖片複製到別的文件中去。