第10章綜合實例——某公司網(wǎng)站片頭10.1設(shè)計說明10.2制作要點(diǎn)10.3效果展示10.4實現(xiàn)過程本章小結(jié)在互聯(lián)網(wǎng)上，純粹的Flash網(wǎng)站越來越多。它比其它類型的網(wǎng)站更具有動感與藝術(shù)性，因此，這種類型的網(wǎng)站多為個人網(wǎng)站或藝術(shù)(如美術(shù)、設(shè)計、音樂等)網(wǎng)站。Flash雖然主要用于制作網(wǎng)頁動畫，但是隨著其交互性的增強(qiáng)，它在網(wǎng)站建設(shè)與多媒體制作方面也有廣泛的應(yīng)用。使用Flash制作網(wǎng)站相對繁瑣一些，但是它打破了以往靜止、呆板的網(wǎng)頁頁面，以流式動畫的形式讓網(wǎng)頁更加豐富多彩。

現(xiàn)在各公司對于網(wǎng)站的質(zhì)量要求越來越高，即使是一

個普通的網(wǎng)站，也要求在網(wǎng)站的開始加上一個Flash片頭，以加深瀏覽者的印象。本章將學(xué)習(xí)如何用Flash來制作網(wǎng)站片頭。10.1設(shè)計說明

網(wǎng)站的設(shè)計或網(wǎng)站片頭的設(shè)計一定要體現(xiàn)公司的經(jīng)營理念、行業(yè)特點(diǎn)以及主導(dǎo)產(chǎn)品等，貝爾國際經(jīng)貿(mào)(香港)發(fā)展有限公司是一個新成立的貿(mào)易公司，公司以全面而高效的工作方式為客戶提供服務(wù)。在設(shè)計本例的網(wǎng)站片頭動畫時，緊扣行業(yè)特點(diǎn)，動畫節(jié)奏整體較快，突出一種高效、快捷的服務(wù)理念，并通過視野開闊的商務(wù)場面，從設(shè)計、管理、服務(wù)三個方面體現(xiàn)公司的國際性。同時以藍(lán)色為主調(diào)，結(jié)合基本圖形的動畫，突出公司的科技性，最后定格在公司的LOGO圖形上，從而加強(qiáng)網(wǎng)站瀏覽者對公司的了解與認(rèn)知。

10.2制作要點(diǎn)

本例雖然是一個網(wǎng)站的片頭動畫，但是其復(fù)雜程度很高，需要借助30多個圖層才能完成。根據(jù)設(shè)計要求，可以將制作過程分為幾個小動畫進(jìn)行制作。

(1)制作預(yù)載動畫。由于Flash在網(wǎng)絡(luò)上是下載一幀播放一幀，如果某一幀中的內(nèi)容太多(如聲音、元件過多等)時，載入該幀時將需要較長的時間，可能出現(xiàn)動畫停頓現(xiàn)象。為解決這一問題，可在下載的過程中讓畫面一直顯示公司的LOGO。本例中使用ActionScript2.0編寫代碼。

(2)制作文字動畫。文字動畫可增強(qiáng)動感，讓瀏覽者獲取一定的公司信息。該動畫可使用傳統(tǒng)補(bǔ)間動畫制作。

(3)以六邊形的組合來體現(xiàn)第一個場景的動畫效果，有掃光、閃動、淡入淡出等效果，主要運(yùn)用影片剪輯元件、逐幀動畫、傳統(tǒng)補(bǔ)間動畫技術(shù)完成。

(4)第二、三場景的動畫分別由三角形的組合、正方形的組合為表現(xiàn)形式，動畫效果與制作技術(shù)與第一場相同，只是畫面不同。

(5)片頭動畫最后定格在公司的LOGO上，動畫效果也比較簡單，使用傳統(tǒng)補(bǔ)間動畫技術(shù)完成。

(6)最后為整個動畫配以快節(jié)奏的音效，并設(shè)置合理的屬性，使其循環(huán)播放。10.3效果展示

本例片頭動畫的視覺沖擊較好，設(shè)計也比較合理，下面截取幾幀關(guān)鍵畫面，如圖10-1所示。整體效果可以通過

播放本書光盤“第10章”文件夾中的“網(wǎng)站片頭.swf”文件進(jìn)行觀看。圖10-1動畫的部分畫面10.4實現(xiàn)過程

在本例的制作過中，我們采取了化整為零、化大為小的方法，將整個動畫分為幾大模塊分別進(jìn)行制作，這樣可以避免無從下手的感覺，使工作變得簡單。10.4.1制作預(yù)載動畫

對于Flash整站或者網(wǎng)絡(luò)上的片頭動畫而言，為了避免產(chǎn)生斷斷續(xù)續(xù)的播放效果，往往都要制作一段預(yù)載動畫。在下載完全部動畫之前，一直播放預(yù)載動畫，以免讓瀏覽者產(chǎn)生長時間等待的心理。

(1)啟動FlashCS4軟件，在歡迎畫面中單擊【Flash文件(ActionScript2.0)】選項，創(chuàng)建一個新文檔。

(2)按下Ctrl+J鍵，在文檔屬性對話框中設(shè)置尺寸為700×540像素、背景顏色為灰色(#EBEBEB)、幀頻為30?fps。

(3)按下Ctrl+F8鍵，創(chuàng)建一個新的影片剪輯元件“l(fā)ogomovie”，并進(jìn)入其編輯窗口中。

(4)按下Ctrl+R鍵，導(dǎo)入本書光盤“第10章”文件夾中的“001.swf”文件，如圖10-2所示。

(5)在【時間軸】面板中選擇“圖層1”的第81幀，按下F5鍵插入普通幀。

(6)在“圖層1”的上方創(chuàng)建一個新圖層“圖層2”，然后運(yùn)用“橢圓工具”?在窗口中繪制一個圓形。圓形的大小要大于“圖層1”中導(dǎo)入的圖形，并覆蓋在其上面，如圖10-3

所示。圖10-2導(dǎo)入的圖片“001.swf”圖10-3繪制的圓形

(7)在窗口中選擇剛繪制的圓形，按下F8鍵將其轉(zhuǎn)換為圖形元件“mask1”。

(8)在【時間軸】面板中同時選擇“圖層2”的第74～81幀，按下F6鍵插入關(guān)鍵幀。

(9)分別選擇“圖層2”中第74、76、78和80幀處的“mask1”實例，在編輯窗口中調(diào)整其位置，使其不要覆蓋“圖層1”中的圖形，如圖10-4所示。圖10-4調(diào)整“mask1”實例的位置

(10)在“圖層2”上單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【遮罩層】命令，將該層轉(zhuǎn)換為遮罩層，從而創(chuàng)建遮罩動畫。

(11)在“圖層2”的上方創(chuàng)建一個新圖層“圖層3”，選擇工具箱中的“文本工具”?，在編輯窗口中輸入文字“LoadingPleaseWait……”，設(shè)置文字顏色為黑色，字體隨意，如圖10-5所示。圖10-5輸入的文字圖10-6繪制的矩形

(12)在“圖層3”的上方創(chuàng)建一個新圖層“圖層4”，然后選擇工具箱中的“矩形工具”，在【屬性】面板中設(shè)置筆觸顏色為無色、填充顏色為黑色，然后在編輯窗口中文字的下方繪制一個矩形，如圖10-6所示。

(13)按下Shift+F9鍵打開【顏色】面板，在【顏色】面板中按下??按鈕，設(shè)置類型為“線性”，然后設(shè)置左側(cè)色標(biāo)為淺灰色(#EFEBEF)、中間色標(biāo)為深灰色(#7E7E7E)、右側(cè)色標(biāo)為淺灰色(#EFEBEF)，如圖10-7所示。圖10-7【顏色】面板圖10-8填充效果

(14)選擇工具箱中的“顏料桶工具”?，在矩形中由左向右水平拖拽鼠標(biāo)，填充編輯的漸變色，結(jié)果如圖10-8

所示。

圖10-9??【變形】面板

(15)在編輯窗口中選擇編輯后的矩形，按下F8鍵將其轉(zhuǎn)換為圖形元件“x”。

(16)按下Ctrl+T鍵打開【變形】面板，修改“x”實例的高度為1.2%，如圖10-9所示。

(17)在窗口中選擇“x”實例，然后在【屬性】面板中設(shè)置Alpha值為80%，并調(diào)整其位置如圖10-10所示。圖10-10調(diào)整“x”實例的位置圖10-11調(diào)整“x”實例的位置(“圖層4”第25幀處)

(18)分別選擇“圖層4”的第25幀和第50幀，按下F6鍵插入關(guān)鍵幀。

(19)在編輯窗口中選擇第25幀處的“x”實例，調(diào)整其位置如圖10-11所示。

(20)分別在“圖層4”的第1～25幀、第25～50幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(21)在【時間軸】面板中選擇“圖層4”第51幀以后的所有幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【刪除幀】命令，將其刪除。

(22)在【時間軸】面板中選擇“圖層4”的第1～50幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【復(fù)制幀】命令，復(fù)制選擇的幀。

(23)在“圖層4”的上方創(chuàng)建一個新圖層“圖層5”，然后選擇該層的第1～50幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【粘貼幀】命令，粘貼復(fù)制的幀，并將“圖層5”第51幀以后的所有幀刪除。

(24)分別選擇“圖層5”第1和50幀處的“x”實例，將其調(diào)到標(biāo)志圖形的上方，位置如圖10-12所示。圖10-12調(diào)整“x”實例的位置(“圖層5”第1和50幀處)圖10-13調(diào)整“x”實例的位置(“圖層5”第25幀處)

(25)再選擇“圖層5”第25幀處的“x”實例，將其調(diào)到標(biāo)志圖形的下方，位置如圖10-13所示。

(26)用同樣的方法，分別制作出“圖層6”、“圖層7”和“圖層8”中的動畫，其中的“x”實例要隨機(jī)調(diào)整位置，如圖10-14所示。圖10-14編輯后的動畫圖10-15調(diào)整“l(fā)ogomovie”實例的位置

(27)單擊舞臺上方的??按鈕，返回到舞臺中。

(28)按下Ctrl+L鍵打開【庫】面板，將“l(fā)ogomovie”元件從【庫】面板中拖拽到舞臺的中間位置，如圖10-15所示。

(29)在【時間軸】面板中更改“圖層1”的名稱為“預(yù)載”，并在第2、3和9幀處插入關(guān)鍵幀。

(30)選擇“預(yù)載”層的第2幀，按下F9鍵，在打開的【動作】面板中輸入如下代碼：

gotoAndPlay(1);

ifFrameLoaded(650)

{

gotoAndPlay(3);

}

(31)在舞臺中選擇“預(yù)載”層第9幀處的“l(fā)ogomovie”實例，在【屬性】面板中設(shè)置Alpha值為0%。

(32)在“預(yù)載”層的第3～9幀之間單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，創(chuàng)建傳統(tǒng)補(bǔ)間

動畫。10.4.2制作文字動畫

為了增強(qiáng)視覺效果，本例中使用兩個矩形的開合動畫配合文字動畫，使其更加生動。在制作這部分動畫時，承接了上面的預(yù)載動畫。在制作技術(shù)上，主要使用了元件的實例屬性、傳統(tǒng)補(bǔ)間動畫以及緩動效果。

(1)在“預(yù)載”層的上方創(chuàng)建一個新圖層，并重新命名為“上簾”，選擇該層的第9幀，按下F7鍵插入空白關(guān)鍵幀。

(2)選擇工具箱中的“矩形工具”?，在【屬性】面板中設(shè)置筆觸顏色為黑色、填充顏色為灰色(#EBEBEB)，然后在舞臺中繪制一個矩形，并刪除矩形的左右輪廓線，其大小與位置如圖10-16所示。圖10-16繪制的矩形

(3)雙擊處理后的矩形將其選擇，按下F8鍵將其轉(zhuǎn)換為圖形元件“juxing”。

(4)在“上簾”層的上方創(chuàng)建一個新圖層，并重新命名為“下簾”，選擇該層的第9幀，按下F7鍵插入空白關(guān)鍵幀。

(5)按下Ctrl+L鍵打開【庫】面板，將“juxing”元件從【庫】面板中拖動到舞臺中，位置如圖10-17所示。

(6)在【時間軸】面板中同時選擇“上簾”層和“下簾”層的第23幀，按下F6鍵插入關(guān)鍵幀，然后分別調(diào)整“juxing”實例的位置如圖10-18所示。圖10-17調(diào)整“juxing”實例的位置圖10-18調(diào)整“juxing”實例的位置

(“上簾”和“下簾”層第23幀處)

(7)同時選擇“上簾”層和“下簾”層的第9幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(8)確?！吧虾煛睂雍汀跋潞煛睂拥牡?幀同時被選中，在【屬性】面板中設(shè)置參數(shù)如圖10-19所示。

(9)分別在“上簾”層和“下簾”層的第214、218和234幀處插入關(guān)鍵幀。

(10)選擇“上簾”層第218幀處的“juxing”實例，將其垂直向上移動少許；再選擇“下簾”層第218幀處的“juxing”實例，將其垂直向下移動少許，如圖10-20所示。圖10-19【屬性】面板圖10-20調(diào)整“juxing”實例的位置

(“上簾”和“下簾”層第218幀處)

(11)選擇“上簾”層第234幀處的“juxing”實例，將其垂直向下移動；再選擇“下簾”層第234幀處的“juxing”實例，將其垂直向上移動，使兩者對齊，如圖10-21所示。

(12)分別在“上簾”層和“下簾”層的第214～218幀、第218～234幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(13)同時選擇“上簾”層與“下簾”層的第214幀，在【屬性】面板中設(shè)置緩動值為100；再選擇這兩層的第218幀，在【屬性】面板中設(shè)置緩動值為－100。

(14)分別在“上簾”層與“下簾”層的第274和286幀處插入關(guān)鍵幀。然后將“上簾”層第286幀處的“juxing”實例向上調(diào)整，將“下簾”層第286幀處的“juxing”實例向下調(diào)整，位置如圖10-22所示。圖10-21對齊實例圖10-22調(diào)整“juxing”實例的位置

(“上簾”和“下簾”層第286幀處)

(15)分別在“上簾”層與“下簾”層的第274～286幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(16)在“下簾”層的上方創(chuàng)建一個新圖層，并重新命名為“文字1”，然后在該層第40幀處插入關(guān)鍵幀。

(17)選擇工具箱中的“文本工具”?，在舞臺中輸入文字“CHINA”，然后選擇輸入的文字，在【屬性】面板中設(shè)置文字的屬性，如圖10-23所示。

(18)確保文字處于選擇狀態(tài)，按下F8鍵將其轉(zhuǎn)換為圖形元件“china”，調(diào)整其位置如圖10-24所示。圖10-23文字“CHINA”的屬性圖10-24調(diào)整“china”實例的位置

(19)在舞臺中選擇“china”實例，在【屬性】面板中設(shè)置Alpha值為0%。

(20)分別在“文字1”層的第61和85幀處插入關(guān)鍵幀，然后選擇第61幀處的“china”實例，在【屬性】面板設(shè)置Alpha值為100%，并在【變形】面板中將其等比例縮小，如圖

10-25所示。圖10-25等比例縮小“china”實例(第61幀處)圖10-26等比例縮小“china”實例(第85幀處)

(21)選擇“文字1”層第85幀處的“china”實例，在【變形】面板中將其等比例縮小，如圖10-26所示。

(22)分別在“文字1”層的第40～61幀、第61～85幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，然后將第86幀以后的所有幀刪除。

(23)在“文字1”層的上方創(chuàng)建一個新圖層“文字2”，然后在該層的第85幀處插入關(guān)鍵幀。

(24)選擇工具箱中的“文本工具”?，在舞臺中輸入文字“HONGKONG”，然后選擇輸入的文字，在【屬性】面板中設(shè)置文字的屬性，如圖10-27所示。圖10-27文字“HONGKONG”的屬性圖10-28調(diào)整“hongkong”實例的位置

(25)確保文字處于選擇狀態(tài)，按下F8鍵將其轉(zhuǎn)換為圖形元件“hongkong”，調(diào)整其位置如圖10-28所示。

(26)在舞臺中選擇“hongkong”實例，在【屬性】面板中設(shè)置Alpha值為0%。

(27)分別在“文字2”層的第110和134幀處插入關(guān)鍵幀，選擇第110幀處的“china”實例，在【屬性】面板中設(shè)置Alpha值為100%，并在【變形】面板中將其等比縮小為70%。

(28)選擇“文字2”層第134幀處的“hongkong”實例，在【變形】面板中將其等比縮小為40%。

(29)分別在“文字2”層的第85～110幀、第110～134幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，然后將第135幀以后的所有幀刪除。圖10-29調(diào)整“貝爾”實例的位置

(30)在“文字2”層的上方創(chuàng)建一個新圖層“文字3”，然后在該層的第125幀處插入關(guān)鍵幀。

(31)使用【文本工具】輸入文字“佰德經(jīng)濟(jì)貿(mào)易與交流有限責(zé)任公司”，然后按下F8鍵，將其轉(zhuǎn)換為圖形元件“貝爾”，調(diào)整其位置如圖10-29所示。

(32)在舞臺中選擇“貝爾”實例，在【屬性】面板中設(shè)置Alpha值為0%。

(33)分別在“文字3”層的第155和188幀處插入關(guān)鍵幀，然后選擇第155幀處的“貝爾”實例，在【屬性】面板中設(shè)置Alpha值為100%，并在【變形】面板中將其等比縮小為50%；再選擇第188幀處的“貝爾”實例，在【變形】面板中將其等比縮小為20%。

(34)分別在“文字3”層的第125～155幀、第155～188幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，最后刪除第189幀以后的所有幀。

(35)在“文字3”層的上方創(chuàng)建一個新圖層“文字4”，選擇該層的第234幀，按下F7鍵插入空白關(guān)鍵幀。

(36)使用“文本工具”?在舞臺中輸入文字“佰德經(jīng)濟(jì)貿(mào)易與交流有限責(zé)任公司”，并在【屬性】面板中設(shè)置文字的屬性，如圖10-30所示。

(37)選擇輸入的文字，按下F8鍵將其轉(zhuǎn)換為圖形元件“貝爾2”，調(diào)整其位置如圖10-31所示。圖10-30設(shè)置文字的屬性圖10-31調(diào)整“貝爾2”實例的位置圖10-32調(diào)整“貝爾2”實例的位置(第253幀處)

(38)在“文字4”層的第253幀處插入關(guān)鍵幀，調(diào)整該幀處“貝爾2”實例的位置如圖10-32所示。

(39)在“文字4”層的第234～253幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，然后選擇第234幀，在【屬性】面板中設(shè)置緩動值為100。

(40)分別在“文字4”層的第286和289幀處插入關(guān)鍵幀，然后選擇第289幀處的“貝爾2”實例，在【屬性】面板中設(shè)置Alpha值為0%。

(41)在“文字4”層的第286～289幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，并刪除第290幀以后的所有幀。

(42)在“文字4”層的上方創(chuàng)建一個新圖層“文字5”，選擇該層的第244幀，按下F7鍵插入空白關(guān)鍵幀。

(43)使用“文本工具”?在舞臺中輸入文字“BIRDINTERNATIONALECONOMY&TRADINGDEVELOPMENT（CHINA）CO.,LTD”，并在【屬性】面板中設(shè)置文字的屬性，如圖10-33所示。

(44)選擇輸入的英文文字，按下F8鍵將其轉(zhuǎn)換為圖形元件“e”，調(diào)整其位置如圖10-34所示。圖10-33設(shè)置英文字母的屬性圖10-34調(diào)整“e”實例的位置

(45)在“文字5”層的第262幀處插入關(guān)鍵幀，調(diào)整該幀處實例的位置如圖10-35所示。圖10-35調(diào)整“e”實例的位置(第262幀處)

(46)在“文字5”層的第244～262幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，并選擇第244幀，在【屬性】面板中設(shè)置緩動值為100。

(47)分別在“文字5”層的第293和296幀處插入關(guān)鍵幀，并選擇第296幀處的“e”實例，在【屬性】面板中設(shè)置其Alpha值為0%。

(48)在“文字5”層的第293～296幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，并刪除第297幀以后的所有幀。

(49)在“預(yù)載”層的上方創(chuàng)建一個新圖層，重新命名為“背景”，如圖10-36所示。

(50)在“背景”層的第274幀處插入空白關(guān)鍵幀，按下Ctrl+R鍵將本書光盤“第10章”文件夾中的“image.jpg”文件導(dǎo)入到舞臺中，并在【信息】面板中設(shè)置參數(shù)如圖10-37所示，控制其位置與大小。圖10-36創(chuàng)建的新圖層圖10-37設(shè)置“image.jpg”的參數(shù)圖10-38繪制的矩形

(51)在“文字5”層的上方創(chuàng)建一個新圖層，重新命名為“光線1”，并在該層的第289幀處插入空白關(guān)鍵幀。

(52)選擇工具箱中的“矩形工具”?，在【屬性】面板中設(shè)置筆觸顏色為無色、填充顏色為白色，在舞臺中繪制一個矩形，如圖10-38所示。圖10-39??【顏色】面板

(53)選擇繪制的矩形，按下Shift+F9鍵打開【顏色】面板，按下??按鈕，設(shè)置類型為“放射狀”，左、右色標(biāo)均為白色，但右側(cè)色標(biāo)的Alpha值為0%，如圖10-39所示，則矩形的填充色自動更換為“透明-白色-透明”的漸變色。

(54)確保更改填充色后的矩形處于選擇狀態(tài)，按下F8鍵將其轉(zhuǎn)換為圖形元件“光線”，調(diào)整其位置如圖10-40所示。圖10-40調(diào)整“光線”實例的位置圖10-41水平向右移動“光線”實例的位置面

(55)在“光線1”層的第294幀處插入關(guān)鍵幀，選擇該幀處的“光線”實例，在【屬性】面板中設(shè)置其Alpha值為0%，并水平移動到舞臺的右側(cè)，如圖10-41所示。

(56)在“光線1”層的第289～294幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，然后刪除第295幀以后的所有幀。

(57)在“光線1”層的上方創(chuàng)建一個新圖層，重新命名為“光線2”層，選擇該層的第296幀，按下F7鍵插入空白關(guān)鍵幀。

(58)將“光線”元件從【庫】面板中拖動到舞臺中，按下Ctrl+T鍵，在【變形】面板中改變其高度比例，如圖10-42所示，然后在舞臺中調(diào)整“光線”實例的位置如圖10-43

所示。圖10-42設(shè)置“光線”元件的參數(shù)圖10-43調(diào)整“光線”實例的位置(“光線2”層)圖10-44調(diào)整“光線”實例的屬性及位置(“光線2”層第302幀處)

(59)在“光線2”層的第302幀處插入關(guān)鍵幀，選擇該幀處的“光線”實例，在【屬性】面板中設(shè)置其Alpha值為0%，并水平移動到舞臺的左側(cè)，如圖10-44所示。

(60)在“光線2”層的第296～302幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，然后刪除第303幀以后的所有幀。這樣就完成了文字動畫的制作，【時間軸】面板如圖10-45所示。圖10-45文字動畫的【時間軸】面板10.4.3制作第一場景動畫

在這個場景中，六邊形的顯示動畫是通過導(dǎo)入外部文件以逐幀動畫的形式制作的，掃光動畫是以傳統(tǒng)補(bǔ)間動畫制作的，圖形的淡入及滑出動畫是結(jié)合元件的實例屬性制作的。

(1)單擊菜單欄中的【插入】\【新建元件】命令，創(chuàng)建一個名稱為“圖片1”的圖形元件，并進(jìn)入其編輯窗口，將本書光盤“第10章”文件夾中的“002.swf”文件導(dǎo)入到編輯窗口中，導(dǎo)入后形成一個逐幀動畫，如圖10-46所示。圖10-46導(dǎo)入的動畫“002.swf”

(2)單擊舞臺上方的??按鈕，返回到舞臺中，在“光線2”層的上方創(chuàng)建一個新圖層，重新命名為“第一場景1”，并在該層的第307幀處插入關(guān)鍵幀，將“圖片1”元件從【庫】面板中拖拽到舞臺中，調(diào)整其位置如圖10-47所示。圖10-47調(diào)整“圖片1”實例的位置圖10-48??【屬性】面板

(3)在“第一場景1”層的第312幀處插入關(guān)鍵幀，并選擇該幀處的“圖片1”實例，在【屬性】面板中設(shè)置參數(shù)如圖

10-48所示。

(4)同時選擇“第一場景1”層的第313～318幀，按下F6鍵插入關(guān)鍵幀，然后分別選擇第313、315和317幀處的“圖片1”實例，按下Delete鍵將其刪除。

(5)同時選擇“第一場景1”層的第396～401幀，按下F6鍵插入關(guān)鍵幀，然后分別選擇第397、399和401幀處的“圖片1”實例，按下Delete鍵將其刪除，再將第402幀以后的所有幀刪除。

(6)在“第一場景1”層的上方創(chuàng)建一個新圖層，重新命名為“第一場景2”，在該層的第321幀處插入關(guān)鍵幀。

(7)使用“文本工具”?在舞臺中輸入文字“精心設(shè)計”，并將其轉(zhuǎn)換為圖形元件“jxsj”，然后將該實例調(diào)整到舞臺的右側(cè)，如圖10-49所示。圖10-49調(diào)整“jxsj”實例的位置圖10-50調(diào)整“jxsj”實例的位置(第328幀處)

(8)在“第一場景2”層的第328幀處插入關(guān)鍵幀，并將該幀處的“jxsj”實例調(diào)整到舞臺中，位置如圖10-50所示。

(9)在“第一場景2”層的第321～328幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，制作出文字從右側(cè)飛入的動畫效果。

(10)分別選擇“第一場景2”層的第394和398幀，按下F6鍵插入關(guān)鍵幀。

(11)在舞臺中選擇第398幀處的“jxsj”實例，在【屬性】面板中設(shè)置Alpha值為0%，然后在第394～398幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，制作出文字漸漸消失的動畫效果，最后將第399幀以后的所有幀刪除，此時的【時間軸】面板如圖10-51所示。圖10-51【時間軸】面板

(12)按下Ctrl+F8鍵，創(chuàng)建一個新的圖形元件“z1”，按下Ctrl+R鍵，將本書光盤“第10章”文件夾中的“003.swf”文件導(dǎo)入到編輯窗口中。

(13)在【時間軸】面板中選擇“圖層1”的第2幀，按下F7鍵插入空白關(guān)鍵幀，然后在【動作】面板中輸入如下代碼:

gotoAndPlay(1);

(14)單擊舞臺上方的??按鈕，返回到舞臺中。

(15)在“第一場景2”的上方創(chuàng)建一個新圖層“第一場景3”，并在該層的第328幀處插入關(guān)鍵幀，將“z1”元件從【庫】面板中拖拽到舞臺中。

(16)在舞臺中選擇“z1”實例，單擊菜單欄中的【修改】\【變形】\【水平翻轉(zhuǎn)】命令，將實例水平翻轉(zhuǎn)，調(diào)整其位置如圖10-52所示。圖10-52調(diào)整“z1”實例的位置

(17)在“第一場景3”層的第332幀處插入關(guān)鍵幀，然后選擇第328幀處的“z1”實例，在【屬性】面板中設(shè)置其Alpha值為0%。

(18)在“第一場景3”層的第328～332幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(19)在“第一場景3”層的第394和398幀處插入關(guān)鍵幀，然后選擇第398幀處的“z1”實例，在【屬性】面板中設(shè)置其Alpha值為0%。

(20)在“第一場景3”層的第394～398幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，并將第399幀以后的所有幀刪除，此時的【時間軸】面板如圖10-53所示。圖10-53?【時間軸】面板

(21)在“第一場景3”層的上方創(chuàng)建一個新圖層“第一場景4”，并在該層的第398幀處插入關(guān)鍵幀。

(22)將“光線”元件從【庫】面板中拖拽到舞臺中，并通過【變形】面板修改其大小，調(diào)整位置如圖10-54所示。圖10-54調(diào)整“光線”實例的大小和位置圖10-55調(diào)整“光線”實例的位置(第408幀處)

(23)在“第一場景4”層的第408幀處插入關(guān)鍵幀，選擇該幀處的“光線”實例，在【屬性】面板中設(shè)置Alpha值為0%，調(diào)整其位置如圖10-55所示。

(24)在“第一場景4”層的第398～408幀創(chuàng)建傳統(tǒng)補(bǔ)間動畫，并將第409幀以后的所有幀刪除。

(25)單擊菜單欄中的【插入】\【新建元件】命令，創(chuàng)建一個名稱為“多邊形1”的圖形元件，并進(jìn)入其編輯窗口中。

(26)按下Ctrl+R鍵，將本書光盤“第10章”文件夾中的“004.swf”文件導(dǎo)入到編輯窗口中，如圖10-56所示。圖10-56導(dǎo)入的圖片“004.swf”

(27)選擇導(dǎo)入的圖片，按下Ctrl+B鍵將其分離為圖形，然后調(diào)整圖形的顏色為白色。

(28)選擇修改顏色后的圖形，按下F8鍵將其轉(zhuǎn)換為圖形元件“duo”。

(29)單擊舞臺上方的??按鈕，返回到舞臺中。

(30)在“第一場景4”的上方創(chuàng)建一個新圖層“第一場景5”，并在該層的第325幀處插入關(guān)鍵幀，將“多邊形1”元件從【庫】面板中拖拽到舞臺中，位置如圖10-57所示。圖10-57調(diào)整“多邊形1”實例的位置圖10-58調(diào)整“duo”實例的位置

(31)在舞臺中雙擊“多邊形1”實例，進(jìn)入其編輯窗口，這樣操作可以觀察到背景圖像，以方便確定位置。

(32)在“圖層1”的第56幀處插入關(guān)鍵幀，將“duo”實例水平向右移動，如圖10-58所示。

(33)在“圖層1”的第1～56幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(34)選擇“圖層1”第1幀處的“duo”實例，在【屬性】面板中設(shè)置其Alpha值為0%。

(35)在“圖層1”的上方創(chuàng)建一個新圖層“圖層2”，在該層的第3幀處插入關(guān)鍵幀，將“duo”元件從【庫】面板中拖拽到編輯窗口中，調(diào)整其大小與位置如圖10-59所示。圖10-59調(diào)整“duo”實例的大小和位置(“圖層2”第3幀處)圖10-60調(diào)整“duo”實例的位置(“圖層2”第49幀處)

(36)在“圖層2”的第49幀處插入關(guān)鍵幀，調(diào)整“duo”實例的位置如圖10-60所示。

(37)在“圖層2”的第3～49幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(38)選擇“圖層2”第3幀處的“duo”實例，在【屬性】面板中設(shè)置其Alpha值為0%，最后將“圖層2”第50幀以后的所有幀刪除。

(39)在“圖層2”的上方創(chuàng)建一個新圖層“圖層3”，并在該層的第7幀處插入關(guān)鍵幀，將“duo”元件從【庫】面板中拖拽到編輯窗口中，調(diào)整其大小與位置如圖10-61所示。圖10-61調(diào)整“duo”實例的大小和位置(“圖層3”第7幀處)圖10-62調(diào)整“duo”實例的大小和位置(“圖層3”第64幀處)

(40)在“圖層3”的第64幀處插入關(guān)鍵幀，調(diào)整實例的位置如圖10-62所示，然后選擇第7幀處的“duo”實例，在【屬性】面板中設(shè)置其Alpha值為0%。圖10-63?【時間軸】面板

(41)在“圖層3”的第7～64幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫?！岸噙呅?”元件的【時間軸】面板如圖10-63所示。圖10-64?【屬性】面板

(42)在【時間軸】面板中分別選擇“圖層1”的第1幀、“圖層2”的第3幀、“圖層3”的第7幀，在【屬性】面板中設(shè)置參數(shù)如圖10-64所示。

(43)單擊舞臺上方的??按鈕，返回到舞臺中，然后在“第一場景5”層的第388幀處插入關(guān)鍵幀，并將第389幀以后的所有幀刪除，這樣就完成了第一場景動畫的制作，此時的【時間軸】面板如圖10-65所示。圖10-65?【時間軸】面板10.4.4制作第二、三場景動畫

第二、三場景動畫除了畫面內(nèi)容不同外，動畫效果與制作技術(shù)完全與第一場景動畫相同，主要作用是表現(xiàn)公司的不同側(cè)面。

(1)按下Ctrl+F8鍵創(chuàng)建一個新的圖形元件“圖片2”，并進(jìn)入其編輯窗口中，然后將本書光盤“第10章”文件夾中的“005.swf”文件導(dǎo)入到窗口中，這也是一個逐幀動畫，如圖10-66所示。圖10-66導(dǎo)入的動畫“005.swf”圖10-67導(dǎo)入的實例“圖片2”

(2)單擊舞臺上方的??按鈕，返回到舞臺中。

(3)在“第一場景5”層的上方創(chuàng)建一個新圖層，重新命名為“第二場景1”，并在該層的第415幀處插入關(guān)鍵幀。

(4)將“圖片2”元件從【庫】面板中拖拽到舞臺中，調(diào)整其位置如圖10-67所示。

(5)在“第二場景1”層的第425幀處插入關(guān)鍵幀，然后選擇該幀處的實例，在【屬性】面板中設(shè)置其參數(shù)如圖10-68所示。圖10-68?【屬性】面板

(6)在【時間軸】面板中同時選擇“第二場景1”層的第426～431幀，按下F6鍵插入關(guān)鍵幀，然后分別選擇第426、428和430幀處的“圖片2”實例，按下Delete鍵將其刪除。

(7)同時選擇“第二場景1”層的第499～505幀，按下F6鍵插入關(guān)鍵幀，然后分別選擇第500、502和504幀處的“圖片2”實例，將其刪除，并將第506幀以后的所有幀刪除，此時的【時間軸】面板如圖10-69所示。圖10-69??【時間軸】面板圖10-70調(diào)整“jygl”實例的位置

(8)在“第二場景1”層的上方創(chuàng)建一個新圖層，命名為“第二場景2”層，然后在該層的第424幀處插入關(guān)鍵幀。

(9)選擇工具箱中的“文本工具”?，在舞臺中輸入文字“精益管理”，并將其轉(zhuǎn)換為圖形元件“jygl”，調(diào)整其位置如圖10-70所示。

(10)分別在“第二場景2”層的第431、499和503幀處插入關(guān)鍵幀，然后選擇第424幀處的“jygl”實例，在【屬性】面板中設(shè)置其Alpha值為0%，并調(diào)整到舞臺的右側(cè)，如圖10-71所示。圖10-71調(diào)整“jygl”實例的位置(第424幀處)

(11)在舞臺中選擇第503幀處的“jygl”實例，在【屬性】面板中設(shè)置其Alpha值為0%。

(12)在“第二場景2”層的第424～431幀、第499～503幀之間創(chuàng)建傳統(tǒng)補(bǔ)間動畫，制作出文字從右側(cè)飛入并淡出的動畫效果，然后刪除第504幀以后的所有幀。

(13)在“第二場景2”層的上方創(chuàng)建一個新圖層，重新命名為“第二場景3”，并在該層的第428幀處插入關(guān)鍵幀，將“z1”元件從【庫】面板中拖拽到舞臺中。圖10-72??【時間軸】面板

(14)參照“第一場景3”層中動畫的制作方法，制作“第二場景3”層中的動畫效果，然后刪除第504幀以后的所有幀，此時的【時間軸】面板如圖10-72所示。

(15)在“第二場景3”層的上方創(chuàng)建一個新圖層，重新命名為“第二場景4”，在該層的第502幀處插入關(guān)鍵幀。

(16)在【時間軸】面板中同時選擇“第一場景4”層的第398～408幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【復(fù)制幀】命令，復(fù)制選擇的幀。

(17)在【時間軸】面板中同時選擇“第二場景4”的第502～512幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【粘貼幀】命令，粘貼復(fù)制的幀，然后將第513幀以后的所有幀刪除，此時的【時間軸】面板如圖10-73所示。圖10-73??【時間軸】面板

(18)按下Ctrl+F8鍵，創(chuàng)建一個名稱為“多邊形2”的新影片剪輯元件，并進(jìn)入其編輯窗口中。

(19)按下Ctrl+R鍵，將本書光盤“第10章”文件夾中的“006.swf”文件導(dǎo)入到編輯窗口中，這是一個逐幀動畫，如圖10-74所示。圖10-74導(dǎo)入的動畫“006.swf”圖10-75??【信息】面板

(20)單擊舞臺上方的??按鈕，返回到舞臺中。

(21)在“第二場景4”層的上方創(chuàng)建一個新圖層“第二場景5”，在該層的第450幀處插入關(guān)鍵幀，然后將“多邊形2”元件從【庫】面板中拖拽到舞臺中。在【信息】面板中設(shè)置“多邊形2”實例的參數(shù)如圖10-75所示。

(22)在“第二場景5”層的第485幀處插入關(guān)鍵幀，然后將第486幀以后的所有幀刪除。

(23)參照前面第一、二場景動畫的制作方法，制作第三場景動畫，完成后的畫面與【時間軸】面板如圖10-76所示。圖10-76動畫效果10.4.5場景的定格與音樂

片頭動畫的定格承接了預(yù)載動畫與文字動畫的內(nèi)容，以一種簡潔大氣的風(fēng)格定位不動，下方的“Enter”按鈕右側(cè)則以一個閃動的箭頭提示用戶進(jìn)入網(wǎng)站的入口。本節(jié)的最后為整個動畫添加了背景音樂，以增強(qiáng)視聽效果。

(1)在【時間軸】面板中同時選擇“背景”層的第603～610幀，按下F6鍵插入關(guān)鍵幀，然后分別選擇第604、606、608和610幀中的圖片，按下Delete鍵將其刪除，再將第611幀以后的所有幀刪除。圖10-77調(diào)整“juxing”實例的位置

(2)同時選擇“上簾”層與“下簾”層的第615和623幀，按下F6鍵插入關(guān)鍵幀。

(3)分別選擇“上簾”層與“下簾”層第623幀處的“juxing”實例，調(diào)整其位置如圖10-77所示。圖10-78??【時間軸】面板

(4)同時選擇“上簾”層與“下簾”層的第615幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【創(chuàng)建傳統(tǒng)補(bǔ)間】命令，創(chuàng)建傳統(tǒng)補(bǔ)間動畫。

(5)分別選擇“上簾”層與“下簾”層的第615幀，在【屬性】面板中設(shè)置緩動值為?-100，此時的【時間軸】面板如圖

10-78所示。

(6)按下Ctrl+F8鍵，創(chuàng)建一個新的圖形元件“貝爾3”，并進(jìn)入其編輯窗口中。

(7)將“貝爾2”元件和“e”元件從【庫】