《Flash CS5工作過程導(dǎo)向標(biāo)準(zhǔn)教程》課件項(xiàng)目06

項(xiàng)目06天正建筑網(wǎng)站片頭6.1項(xiàng)目說明6.2項(xiàng)目分析6.3項(xiàng)目實(shí)施6.4知識(shí)延伸6.5項(xiàng)目實(shí)訓(xùn)6.1項(xiàng)目說明

天正建筑設(shè)計(jì)公司為了擴(kuò)大企業(yè)宣傳，提高品牌形象，委托網(wǎng)絡(luò)公司設(shè)計(jì)一個(gè)純粹的Flash網(wǎng)站，要求簡潔大氣，突出動(dòng)感，并且要求進(jìn)入網(wǎng)站之前要有一段片頭動(dòng)畫，本項(xiàng)目將設(shè)計(jì)制作該網(wǎng)站的片頭動(dòng)畫。6.2項(xiàng)目分析

在Flash的應(yīng)用中，網(wǎng)站制作是一項(xiàng)比較常見的業(yè)務(wù)，通常情況下，個(gè)人網(wǎng)站、藝術(shù)類網(wǎng)站、設(shè)計(jì)公司都喜歡純Flash網(wǎng)站，強(qiáng)調(diào)網(wǎng)站的藝術(shù)性，而此時(shí)片頭動(dòng)畫是必不可少的。6.3項(xiàng)目實(shí)施

通過項(xiàng)目分析，我們基本可以把握該項(xiàng)目的制作流程，其在技術(shù)上并不困難，主要特點(diǎn)是圖層運(yùn)用得比較多，所以管理好圖層是關(guān)鍵。本項(xiàng)目的參考效果如圖6-1所示。圖6-1動(dòng)畫參考效果任務(wù)一：制作Logo動(dòng)畫

圖6-2繪制的矩形圖6-3繪制的空心矩形圖6-4【時(shí)間軸】面板圖6-5【屬性】面板

圖6-6【變形】面板

圖6-7繪制的白色矩形圖6-8縮小第10幀中的圖形圖6-9【時(shí)間軸】面板圖6-10繪制的白色矩形圖6-11縮小第30幀中的圖形圖6-12各段圖形的大小與位置圖6-13【時(shí)間軸】面板圖6-14【時(shí)間軸】面板圖6-15調(diào)整變形中心的位置

圖6-16垂直翻轉(zhuǎn)后的圖形圖6-17【時(shí)間軸】面板圖6-18【時(shí)間軸】面板

圖6-19第105幀中的實(shí)例屬性

圖6-20第110幀中的實(shí)例屬性圖6-21【時(shí)間軸】面板

圖6-22【時(shí)間軸】面板任務(wù)二：制作主界面動(dòng)畫

圖6-23【時(shí)間軸】面板圖6-24繪制的短線

圖6-25拉長后的線圖6-26【時(shí)間軸】面板圖6-27繪制的兩個(gè)矩形

圖6-28調(diào)整矩形的位置圖6-29【時(shí)間軸】面板圖6-30【時(shí)間軸】面板圖6-31【導(dǎo)入】對話框

圖6-32導(dǎo)入的圖片圖6-33第25幀處“樓”實(shí)例的屬性與效果圖6-34【時(shí)間軸】面板圖6-35【時(shí)間軸】面板圖6-36【屬性】面板

圖6-37Logo效果任務(wù)三：制作文字動(dòng)畫

圖6-38【屬性】面板

圖6-39輸入的文字圖6-40分離后的文字圖6-41分散到圖層圖6-42【時(shí)間軸】面板

圖6-43【時(shí)間軸】面板圖6-44【屬性】面板圖6-45【屬性】面板圖6-46選擇所有的動(dòng)畫幀

圖6-47粘貼復(fù)制的幀圖6-48翻轉(zhuǎn)幀圖6-49【時(shí)間軸】面板圖6-50【時(shí)間軸】面板任務(wù)四：制作一個(gè)控制按鈕

圖6-51【創(chuàng)建新元件】對話框

圖6-52【屬性】面板圖6-53【顏色】面板圖6-54繪制的圓角矩形

圖6-55調(diào)整漸變效果圖6-56【時(shí)間軸】面板

圖6-57【屬性】面板圖6-58輸入的文字圖6-59【時(shí)間軸】面板圖6-60【時(shí)間軸】面板

圖6-61調(diào)整后的按鈕圖6-62從【庫】面板中將“按鈕”元件拖動(dòng)到舞臺(tái)中圖6-63【代碼片斷】面板

圖6-64雙擊代碼片斷圖6-65【時(shí)間軸】面板6.4知識(shí)延伸

知識(shí)點(diǎn)一：補(bǔ)間形狀動(dòng)畫

補(bǔ)間形狀動(dòng)畫的兩個(gè)關(guān)鍵幀中必須是圖形對象，而且形態(tài)不同（包括顏色、外形、方向、大小等），兩個(gè)關(guān)鍵幀之間的過渡幀由Flash自動(dòng)創(chuàng)建。補(bǔ)間形狀動(dòng)畫有一個(gè)很大的缺點(diǎn)，就是創(chuàng)建的動(dòng)畫文件體積較大，因?yàn)樵贔lash中它要記錄每一個(gè)關(guān)鍵幀上的圖形。因此，同樣一種動(dòng)畫效果，能夠使用傳統(tǒng)補(bǔ)間動(dòng)畫完成就不要使用補(bǔ)間形狀動(dòng)畫。創(chuàng)建補(bǔ)間形狀動(dòng)畫的方法比較簡單：在【時(shí)間軸】面板中選擇兩個(gè)關(guān)鍵幀之間的任意一幀，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【創(chuàng)建補(bǔ)間形狀】命令，或者單擊菜單欄中的【插入】/【補(bǔ)間形狀】命令即可，這時(shí)兩個(gè)關(guān)鍵幀之間就形成了補(bǔ)間形狀動(dòng)畫。在創(chuàng)建動(dòng)畫時(shí)如果出現(xiàn)虛線，如圖6-66所示，則說明存在錯(cuò)誤，應(yīng)該及時(shí)更正。圖6-66創(chuàng)建動(dòng)畫時(shí)出現(xiàn)錯(cuò)誤知識(shí)點(diǎn)二：翻轉(zhuǎn)幀

制作動(dòng)畫時(shí)，如果將所選的幀進(jìn)行翻轉(zhuǎn)，則播放動(dòng)畫時(shí)可以產(chǎn)生一種類似錄像機(jī)倒帶的效果。翻轉(zhuǎn)幀就是將【時(shí)間軸】面板中選擇的幀進(jìn)行頭尾倒置，將第1幀轉(zhuǎn)換為最后一幀，第2幀轉(zhuǎn)換為倒數(shù)第2幀……依此類推，直至全部翻轉(zhuǎn)完畢。知識(shí)點(diǎn)三：圖層文件夾

圖層文件夾如同Windows中的文件夾一樣，可以將圖層分門別類進(jìn)行整理，使工作更加有效，其操作方法可以參照圖層的操作。

圖6-67新建圖層文件夾

圖6-68修改圖層文件夾的名稱圖6-69將圖層移至文件夾中圖6-70圖層文件夾的展開與折疊狀態(tài)知識(shí)點(diǎn)四：濾鏡

在Flash中，只能為文本、按鈕和影片剪輯元件的實(shí)例添加濾鏡效果，也就是說，如果需要使用濾鏡，必須先將不是文本、按鈕或影片剪輯元件實(shí)例的對象轉(zhuǎn)換為影片剪輯元件的實(shí)例或按鈕（文本除外）才可以使用濾鏡。圖6-71【濾鏡】選項(xiàng)

圖6-72【濾鏡】菜單圖6-73【發(fā)光】濾鏡的參數(shù)

圖6-74新添加的濾鏡圖6-75【投影】濾鏡的參數(shù)圖6-76鎖定與不鎖定模糊X與Y方向的效果圖6-77不同強(qiáng)度的投影效果圖6-78不同距離的投影效果

圖6-79挖空效果圖6-80隱藏對象時(shí)的效果圖6-81不同顏色的陰影效果圖6-82【模糊】濾鏡的參數(shù)圖6-83鎖定與不鎖定模糊X與Y方向的效果知識(shí)點(diǎn)五：按鈕元件

在前面介紹元件類型的時(shí)候曾經(jīng)提到按鈕元件，這里詳細(xì)介紹按鈕元件的相關(guān)操作。在Flash中，按鈕是一種重要的交互對象，它通常與ActionScript結(jié)合使用，從而實(shí)現(xiàn)交互式動(dòng)畫的制作。圖6-84按鈕元件的時(shí)間軸知識(shí)點(diǎn)六：代碼片斷

FlashCS5新增了【代碼片斷】面板，這個(gè)功能可以讓不了解ActionScript編程的用戶也能夠?qū)崿F(xiàn)交互設(shè)計(jì)，快速地將一些預(yù)先設(shè)計(jì)好的代碼片斷應(yīng)用到正在編輯的文檔中或影片剪輯元件的實(shí)例上。

圖6-85【代碼片斷】面板圖6-86展開的代碼圖6-87【動(dòng)作】面板圖6-88【時(shí)間軸】面板

6.5項(xiàng)目實(shí)訓(xùn)

一些個(gè)性Flash網(wǎng)站、多媒體作品、企業(yè)宣傳片等，往往都有片頭。在本項(xiàng)目中我們學(xué)習(xí)了網(wǎng)站片頭的制作，接下來請運(yùn)用已經(jīng)學(xué)到的知識(shí)，為一家生產(chǎn)數(shù)碼設(shè)備的企業(yè)制作一個(gè)宣傳片的片頭。任務(wù)分析

使用Flash制作片頭時(shí)要突出動(dòng)感與節(jié)奏，對于企業(yè)宣傳片的片頭而言，要突出企業(yè)特點(diǎn)、標(biāo)識(shí)等信息。本項(xiàng)目提供了三幅素材圖片，制作時(shí)主要運(yùn)用補(bǔ)間形狀動(dòng)畫、濾鏡、傳統(tǒng)補(bǔ)間動(dòng)畫、多圖層的控制等技