天天看點

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

本節書摘來自異步社群《adobe fireworks cs5中文版經典教程》一書中的第1章,第1.1節,作者: 【美】adobe公司 更多章節内容可以通路雲栖社群“異步社群”公衆号檢視。

adobe fireworks cs5中文版經典教程

在本課中,讀者将快速熟悉adobe fireworks cs5界面,将學習如下内容:

建立新文檔;

打開現有的文檔;

繪制矢量形狀;

熟悉工具面闆;

存儲檔案;

使用屬性面闆修改標明對象的屬性;

定制工作區;

在頁籤視圖下使用多個文檔;

使用曆史記錄面闆。

本課需要大約90分鐘。如果還沒有将檔案夾lesson01複制到您在硬碟中為本書建立的檔案夾lessons中,請現在就這樣做。學習本課時,将覆寫初始檔案;如果需要恢複初始檔案,隻需從配套CD光牒中再次複制它們即可。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks
《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

fireworks的界面與adobe photoshop、adobe dreameweaver、adobe flash、adobe illustrator和adobe indesign相同,這讓使用者能夠輕松地從一種應用程式切換到另一種,而不會有迷路的感覺。

fireworks是一款創造性制作工具,使用這種工具時,有時最艱難的任務是确定從哪裡着手,而本書可以為此提供幫助。下面首先建立一個文檔,并在此過程中讨論界面。讀者完成該練習時,請參考圖1.2查找fireworks界面的主要組成部分。

1.啟動fireworks。

2.在歡迎螢幕的“建立”部分,單擊“fireworks文檔(png)”,如圖1.1所示;如果修改了首選參數,使得啟動時不顯示歡迎螢幕,請選擇菜單“檔案”>“建立”。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

在“建立文檔”對話框中,可為新設計設定畫布大小、畫布顔色和分辨率。

3.将文檔的寬度和高度都設定為500像素,保留分辨率和畫布顔色的預設設定72像素/英寸和白色,再單擊“确定”按鈕。

“建立文檔”對話框将關閉,并在fireworks工作區中打開一個新的空文檔,如圖1.2所示。

注意:

fireworks cs5有一項新增功能,即基于模闆建立新文檔。fireworks自帶了一些已經設計好的模闆,使用者還可以建立自定義模闆。有關模闆方面的更多内容,請參閱第10課。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

https://yqfile.alicdn.com/2611712df74b9c17f1aab1787c740ab5b4f91480.png" >

在windows中,fireworks的預設工作區由頂部的應用程式欄和主工具欄、左邊的工具面闆以及右邊的面闆停放區打開的面闆組成。使用者打開多個文檔時,預設将在一個文檔視窗的多個頁籤中顯示它們,但可通過将頁籤從文檔視窗中拖曳出來使其成為獨立的浮動文檔視窗。fireworks的使用者界面與adobe illustrator、adobe photoshop和adobe flash的使用者界面極其相似,是以學會在其中一個應用程式中使用工具群組織面闆後,便知道如何在其他應用程式中使用它們。

mac版本的界面與此相似,但應用程式欄和菜單欄是分開的,且沒有主工具欄。預設情況下,mac界面與windows界面的組織方式稍有不同;在windows中,屬于同一個應用程式的所有面闆和視窗都包含在一個矩形架構内,以便将其同打開的其他應用程式分開。架構内的區域是不透明的,完全遮住了位于後面的應用程式視窗。

在mac版本的fireworks中,可啟用預設禁用的應用程式架構,進而獲得與windows中相同的行為。要啟用應用程式架構,可選擇菜單“視窗”>“使用應用程式架構”(control + command + f)。然而,在mac中,菜單欄總是位于螢幕頂部且不能移動,是以它并非應用程式架構的一部分,如圖1.3所示。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

無論是在windows還是mac中,多個文檔預設總是以頁籤方式打開。如果要并排顯示文檔,隻需将頁籤拖離标簽欄,文檔将位于獨立的文檔視窗中。在mac中,如果更喜歡單獨的文檔視窗,可在“首選參數”中禁用頁籤,為此,可選擇菜單“fireworks”>“首選參數”,然後選擇“正常”。使用者可以平鋪或層疊方式排列大量文檔,這被稱為多聯視圖。在mac中,要使用多聯視圖,必須啟用應用程式架構。

選擇正确的分辨率

像素/英寸(ppi)是一種隻與印刷領域相關的度量機關。處理螢幕圖形時,使用者關心的是像素尺寸(640×480、760×420等)。fireworks預設使用的分辨率為96ppi(在mac中,為72ppi),如果使用fireworks處理印刷項目,應向印刷商咨詢應使用的分辨率。對印刷而言,通常應使用300ppi的分辨率。然而,需要注意的是,fireworks的強項在于處理螢幕圖形,而非用于列印的圖形。例如,不能将标尺的機關改為英寸,在螢幕上隻有像素是重要的,是以隻能将标尺的機關設定為像素。同樣,fireworks不能了解也不使用cmyk顔色和列印機配置檔案,是以最終的作品可能不能精确列印。

好消息是fireworks現在支援pdf導出,是以将設計方案列印出來以便向客戶展示時,其結果的可預測性更高。

1.1.1 準備畫布

開始工作前,建議使用者設定(激活)幾項功能。

1.如果标尺不可見,選擇菜單“視圖”>“标尺”(ctrl + alt + r或command + option + r)。

2.選擇菜單“視圖”>“工具提示”(ctrl + ]或command + ])。

顯示标尺有助于在畫布上對齊對象,這在作品變得複雜時尤其有幫助。通過啟用工具提示,可在滑鼠所在的位置顯示有關目前工具的額外資訊。

1.1.2 繪制矢量形狀

在任何fireworks項目中,建立形狀都是重要的組成部分。畫布是工作區,延伸到畫布外面的對象看起來被裁剪掉,但圖像資訊并非丢失;隻要将對象拖進畫布或調整畫布的大小,便可顯示整個對象。

1.在工具面闆的“矢量”部分選擇矩形工具,如圖1.4所示。

2.在工具面闆中,單擊“顔色”部分的填色框(它左邊有一個小型油漆桶)以設定矩形的填充色。填充色指的是對象内部的顔色。

3.滑鼠将變成吸管,通過單擊在彈出的拾色器中選擇黑色,如圖1.5所示。選擇顔色後,拾色器将自動關閉,而選擇的顔色将顯示在顔色框中。

4.将滑鼠移到畫布的左上角,注意到有一個小型灰色氣泡,其中顯示了x坐标和y坐标。這是工具提示功能在發揮作用,它以像素為機關準确地指出了滑鼠的位置。

5.調整滑鼠的位置使其x和y坐标都為0,如圖1.6所示。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

6.按下滑鼠按鈕并拖曳到畫布的右下角,工具提示将随滑鼠一起移動。

提示:

從技術上說,隻需将新文檔的畫布顔色設定為黑色,就可達到這裡使用矩形工具實作的所有效果。但當項目更複雜時,使用該矩形讓您能夠更容易處理。

7.看到坐标與文檔尺寸(500×500)相同後松開滑鼠。松開滑鼠後,矩形仍将被選中(標明對象的周圍有藍色邊框,且每個角上都有小型控制框)。矩形是一個特殊的編組矢量對象,是以選中矩形時,并不能看到藍色邊框。第2課将更詳細地介紹對象編組。

如果未能獲得所需的大小,可在界面底部的屬性面闆中調整矢量形狀的大小,如圖1.7所示。為此,可在高度或寬度文本框中單擊并輸入正确的大小。要讓修改生效,可按tab鍵或Enter鍵,也可在其他地方單擊。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

https://yqfile.alicdn.com/f24e6d93ed7ae150c8db2a7c4a40149185484b54.png" >

1.1.3 儲存檔案

進一步做其他工作前,最好儲存所做的工作。

1.選擇菜單“檔案”>“另存為”。

2.切換到檔案夾lesson01。

3.将檔案名設定為watch_promo.fw.png。

4.在彈出菜單“另存為類型”中選擇“fireworks(*.png)”。

5.單擊“儲存”按鈕。

在fireworks cs5中,通過單擊屬性面闆中文本框“高”和“寬”左邊的小方框,可限制對象的比例,這使得按比例縮放對象更容易。如果連結“高”和“寬”的小方框是空心的,則沒有限制對象的比例。單擊該小方框,它将變成實心的,且“高”和“寬”文本框之間的連線将變成實線,這将限制標明對象的比例。

由于這是一個新的未命名文檔,是以也可選擇菜單“檔案”>“儲存”(ctrl/command + s),這也将打開“另存為”對話框。由于該文檔中包含fireworks圖像對象(矢量矩形),fireworks假定您希望最大限度地保留其可編輯性,是以隻提供了将文檔儲存為fireworks png檔案的選項,如圖1.8所示。如果您選擇菜單“檔案”>“另存為”,fireworks将提供更多的檔案格式選項供您選擇。

《Adobe Fireworks CS5中文版經典教程》——第1課 了解工作區 1.1 熟悉Adobe Fireworks

https://yqfile.alicdn.com/8e780cbb476ab21639553a4912ca9a562e235342.png" >

fireworks png格式

與衆多應用程式一樣,fireworks也有其本機格式—修改的png格式,讓使用者能夠使用該程式的所有創造性選項。當使用者添加效果、圖層或頁面等時,将在fireworks png檔案中存儲相應的資訊,讓使用者能夠随時輕松地打開并編輯檔案。然而,這可能讓新使用者感到迷惑,因為還有一種标準的拼合png格式,該格式适用于衆多圖形應用程式。儲存檔案時,fireworks在彈出菜單“儲存類型”中使用“fireworks png”和“拼合png”來區分這兩種版本。

從使用者的角度看,給檔案名添加一個标志将有所幫助,筆者在這裡通過添加.fw來标志fireworks png檔案。通過添加标志,可一眼就認出本機fireworks png檔案。

繼續閱讀