第3講FashCS3基礎(chǔ)動畫制作ppt課件

1、第第3 3講講 flash cs3flash cs3基礎(chǔ)動畫制作基礎(chǔ)動畫制作學(xué)習(xí)要點學(xué)習(xí)要點 逐幀動畫制作 形狀補(bǔ)間動畫制作 動作補(bǔ)間動畫制作 引導(dǎo)層動畫制作 遮罩動畫制作 制作方法：一個關(guān)鍵幀接一個關(guān)鍵幀地繪制作內(nèi)容，相鄰幀之間的內(nèi)容只有細(xì)微變化，多幀連續(xù)播放即形成動畫。3.1 3.1 逐幀動畫制作逐幀動畫制作3.2 3.2 形狀補(bǔ)間動畫制作形狀補(bǔ)間動畫制作3.2.1 3.2.1 知識講解知識講解1.1.形狀補(bǔ)間動畫的定義形狀補(bǔ)間動畫的定義在補(bǔ)間形狀中，在一個關(guān)鍵幀繪制一個形狀，然后在另一個關(guān)鍵幀更改該形狀或繪制另一個形狀。 flash 會內(nèi)插二者之間的幀的值或形狀來創(chuàng)建動畫。利用這種動畫，

2、可以實現(xiàn)對象的大小、位置、顏色等變化。2. 2. 形狀補(bǔ)間動畫的構(gòu)成要素和時間軸表現(xiàn)形狀補(bǔ)間動畫的構(gòu)成要素和時間軸表現(xiàn)構(gòu)成形狀補(bǔ)間動畫的元素是形狀。形狀補(bǔ)間動畫建立后，時間幀面板的背景色變?yōu)榈G色，在起始幀和結(jié)束幀之間有一個長長的箭頭，如果制作錯誤顯示為虛線。形狀補(bǔ)間動畫在時間軸表現(xiàn)技巧提示：技巧提示：若要對組、實例或位圖圖像應(yīng)用形狀補(bǔ)間，請分離這些元素（按ctrl+b組合鍵）。 若要對文本應(yīng)用形狀補(bǔ)間，請將文本分離兩次，從而將文本轉(zhuǎn)換為對象。3. 3. 形狀補(bǔ)間動畫的屬性面板形狀補(bǔ)間動畫的屬性面板用戶在制作形狀補(bǔ)間動畫時，可根據(jù)動畫要求，利用其屬性面板對動畫進(jìn)行加速或減速等屬性設(shè)置， 形狀補(bǔ)

3、間動畫的屬性面板 3.2.2.3.2.2.課堂案例課堂案例loadingloading下載條制作下載條制作【學(xué)習(xí)目標(biāo)】使用形狀補(bǔ)間動畫制作loading下載條【知識要點】使用矩形工具、任意變形工具、形狀補(bǔ)間動畫命令制作下載條的動畫效果。使用文本工具添加文字效果 loading下載條最終效果 3.2.3.3.2.3.課堂案例課堂案例翻書效果翻書效果【學(xué)習(xí)目標(biāo)】使用添加形狀提示來形狀補(bǔ)間動畫制作翻書效果?！局R要點】使用矩形工具、任意變形工具、形狀補(bǔ)間動畫命令制作翻書的動畫效果，最終效果如圖所示。翻書最終效果 3.3 3.3 動作補(bǔ)間動畫制作動作補(bǔ)間動畫制作3.3.1 3.3.1 知識講解知識講解

4、1.1.動作補(bǔ)間動畫的定義動作補(bǔ)間動畫的定義 在動作補(bǔ)間動畫中，在一個關(guān)鍵幀放置一個元件實例，然后在另一個關(guān)鍵幀改變這個元件實例的大小、顏色、位置、透明度、方向等，flash根據(jù)二者之間差值創(chuàng)建的動畫稱為動作補(bǔ)間動畫。2. 2. 動作補(bǔ)間動畫的構(gòu)成要素和時間軸表現(xiàn)動作補(bǔ)間動畫的構(gòu)成要素和時間軸表現(xiàn)構(gòu)成動作補(bǔ)間動畫的元素是元件實例，包括影片剪輯、圖形元件、按鈕、文字、位圖、組合等等，時間幀面板的背景色變?yōu)榈仙谄鹗紟徒Y(jié)束幀之間有一個長長的箭頭，如圖所示，如果制作錯誤顯示為虛線。動作補(bǔ)間動畫在時間軸表現(xiàn) 技巧提示：技巧提示：若要對象是形狀，只有把形狀“組合”或者轉(zhuǎn)換成“元件”后才可以做“動作

5、補(bǔ)間動畫”，否則會出現(xiàn)虛線顯示。3. 3. 動作補(bǔ)間動畫的屬性面板動作補(bǔ)間動畫的屬性面板用戶在制作動作補(bǔ)間動畫時，在時間軸“動作補(bǔ)間動畫”的起始幀上單擊，然后打開屬性面板（按【ctrl+f3】快捷鍵），如圖所示。動作補(bǔ)間動畫的屬性面板緩動：這個選項的作用與形狀補(bǔ)間動畫的完全一樣，在此不再贅述。旋轉(zhuǎn)：有4個選項，選擇“無”（默認(rèn)設(shè)置），即禁止元件實例旋轉(zhuǎn)；選擇“自動”，可以使元件實例根據(jù)起始幀與結(jié)束幀上的角度，自動進(jìn)行旋轉(zhuǎn)；選擇“順時針”或“逆時針”，并在后面輸入數(shù)字，可使元件實例在運動時順時針或逆時針旋轉(zhuǎn)相應(yīng)的圈數(shù)。調(diào)整到路徑：將補(bǔ)間元素的基線調(diào)整到運動路徑，此項功能是用于引導(dǎo)線運動的。在下一

6、節(jié)中我們學(xué)習(xí)。同步：此選項使圖形元件實例內(nèi)部的動畫和主時間軸同步。貼緊：此選項功能是用于引導(dǎo)線運動，可以根據(jù)其注冊點將補(bǔ)間元素附加到運動路徑.3.3.2.3.3.2.課堂案例課堂案例汽車行駛汽車行駛【學(xué)習(xí)目標(biāo)】使用物體移動動畫的制作，以及物體進(jìn)行加速或減速運動的設(shè)置技巧?！局R要點】使用動作補(bǔ)間動畫命令制作汽車行駛的動畫效果。如圖所示。 汽車行駛最終效果3.3.3.3.3.3.課堂案例課堂案例鐘擺運動鐘擺運動鐘擺運動最終效果【學(xué)習(xí)目標(biāo)】使用物體擺動動畫的制作，以及物體進(jìn)行加速或減速運動的設(shè)置技巧?！局R要點】使用繪畫工具繪制鐘擺，利用動作補(bǔ)間動畫命令制作鐘擺運動的動畫效果。如下圖所示。3.4

7、3.4 引導(dǎo)層動畫制作引導(dǎo)層動畫制作3.4.13.4.1知識講解知識講解1.1. 引導(dǎo)層動畫的定義引導(dǎo)層動畫的定義 將一個或多個層鏈接到一個運動引導(dǎo)層，使一個或多個對象沿同一條路徑運動的動畫形式稱為引導(dǎo)層動畫。2. 2. 引導(dǎo)層動畫的創(chuàng)建方法引導(dǎo)層動畫的創(chuàng)建方法 一個最基本的引導(dǎo)層動畫由兩個圖層組成，上面一層是引導(dǎo)層，它的圖層圖標(biāo)為 ，下面圖層是被引導(dǎo)層，圖標(biāo)同普通圖層一樣。在一個普通圖層上點擊時間軸面板的“添加引導(dǎo)層”按鈕 ，該層的上面就會添加一個引導(dǎo)層，同時該普通層會縮進(jìn)成為“被引導(dǎo)層”，如下圖所示。引導(dǎo)層、被引導(dǎo)層與普通圖層引導(dǎo)層是用來指示對象運行路徑的，所以引導(dǎo)層中的內(nèi)容可以是用鋼筆、

8、鉛筆、線條、橢圓、矩形工具或畫筆工具等繪制出的線條。被引導(dǎo)層中的對象是跟著引導(dǎo)線走的，可以使用影片剪輯、圖形元件、按鈕元件等，形狀補(bǔ)間動畫無法應(yīng)用引導(dǎo)層動畫。注冊點與引導(dǎo)線技巧提示：技巧提示：創(chuàng)建引導(dǎo)層動畫時一定要注意，位于被引導(dǎo)層關(guān)鍵幀上的元件實例注冊點一定要位于引導(dǎo)線上，否則引導(dǎo)層動畫無法正常運行，如上圖所示。3. 3. 引導(dǎo)層動畫的參數(shù)設(shè)置引導(dǎo)層動畫的參數(shù)設(shè)置用戶在制作引導(dǎo)層動畫時，在時間軸“引導(dǎo)層動畫”的起始幀上單擊，然后打開屬性面板（按【ctrl+f3】快捷鍵），如下圖所示。設(shè)置引導(dǎo)層動畫的參數(shù)調(diào)整到路徑：可使被引導(dǎo)層上的對象按照引導(dǎo)線的走勢改變引導(dǎo)對象的角度。這樣制作鳥兒飛翔和魚兒

9、游的效果更逼真。同步：此選項使圖形元件實例內(nèi)部的動畫和主時間軸同步。貼緊：此選項功能是用于引導(dǎo)線運動，可以根據(jù)其注冊點將補(bǔ)間元素附加到運動路徑。3.4.2.3.4.2.課堂案例課堂案例飛行鳥兒飛行鳥兒【學(xué)習(xí)目標(biāo)】掌握引導(dǎo)層動畫的制作技巧與方法。【知識要點】使用動作補(bǔ)間動畫制作鳥兒飛行，添加引導(dǎo)層。如下圖所示。鳥兒飛行最終效果3.5 3.5 遮罩動畫制作遮罩動畫制作3.5.13.5.1知識講解知識講解1.1.遮罩動畫的定義遮罩動畫的定義 遮罩動畫，顧名思義就是遮擋下面的對象。遮罩動畫至少有兩層：遮罩層和被遮罩層，處于上層是遮罩層，下層是被遮罩層，如下圖所示制作遮罩前后效果對比，仔細(xì)觀察圖層和鎖定

10、情況。遮罩動畫主要用于水波、探照燈效果、百葉窗、放大鏡、望遠(yuǎn)鏡等效果。遮罩前后效果比較2. 2. 遮罩動畫的創(chuàng)建方法遮罩動畫的創(chuàng)建方法“被遮罩層”其實就是普通圖層；“遮罩層”創(chuàng)建方法是在遮罩層單擊右鍵，在彈出菜單中勾選“遮罩層”，該圖層就變成遮罩層，系統(tǒng)自動把遮罩層下面圖層關(guān)聯(lián)為被遮罩層，如下圖所示。如果想關(guān)聯(lián)更多圖層，只要把其他圖層拖到被遮罩層下面。遮罩層中的圖形對象在播放是看不見的哦，遮罩層中的內(nèi)容可以是按鈕、影片剪輯、圖形、位圖、文字。被遮罩層中的對象只能透過遮罩層中的對象看到。遮罩層和被遮罩層都可以使用形狀補(bǔ)間、動作補(bǔ)間和引導(dǎo)層動畫。創(chuàng)建遮罩層技巧提示：技巧提示：遮罩層的對象不能使用線

11、條，如果一定要用線條，一定要線條轉(zhuǎn)換為填充對象，選擇【修改】|【形狀】|【將線條轉(zhuǎn)化為填充】。3. 3. 遮罩動畫的應(yīng)用技巧遮罩動畫的應(yīng)用技巧（1）遮罩層的基本原理：能夠透過該圖層中的對象看到“被遮罩層”中的對象及其屬性。但是遮罩層中的對象中的許多屬性，如漸變色、透明度、顏色和線條樣式等卻是被忽略的，比如我們要實現(xiàn)文字走光效果必須通過被遮罩層的圖像進(jìn)行實現(xiàn)。（2）顯示遮罩效果：可以鎖定遮罩層和被遮罩層。（3）不能用一個遮罩層遮擋另一個遮罩層。（4）制作過程注意：遮罩層經(jīng)常擋住下層的元件，影響實現(xiàn)，無法編輯，可以按下遮罩層時間軸面板的顯示圖層輪廓按鈕，使遮罩層只顯示邊框形狀，可以調(diào)整遮罩圖形的大

12、小和位置。（5）被遮罩層不能放置動態(tài)文本。3.5.2.3.5.2.課堂案例課堂案例探照燈效果探照燈效果【學(xué)習(xí)目標(biāo)】掌握遮罩動畫的制作技巧與方法。【知識要點】使用遮罩動畫制作探照燈效果。如下圖所示。探照燈最終效果 動畫片中經(jīng)常會出現(xiàn)的各種自然現(xiàn)象，如風(fēng)、雨、雪、雷、云、煙、水、火等。因此，flash動畫設(shè)計師應(yīng)該掌握各種自然現(xiàn)象的運動規(guī)律與制作方法，本實訓(xùn)項目雨的制作方法，雨從空中降落時本是一滴一滴的小雨點，但因為單個雨點的體積很小，降落的速度又較快，因此在較多的情況下人們看到的雨，往往是因為有視覺暫留的作用而形成一條條細(xì)長的半透明的直線。所以在動畫中表現(xiàn)下雨的鏡頭，一般多是畫一些長短不同的直線掠過畫面。雨從空中降落時，本來是垂直的，由于常常伴有風(fēng)，所以看到的雨點，往往都是斜著落下來的。當(dāng)雨點落到地面、雨傘等物體上時，還會濺起小水花。項目實訓(xùn)項目實訓(xùn)自然現(xiàn)象自然現(xiàn)象flashflash實現(xiàn)實現(xiàn)【學(xué)習(xí)目的】：掌握自然現(xiàn)象下雨的制作方法和技巧?！臼褂霉ぞ摺浚恨D(zhuǎn)換元件、補(bǔ)間動畫的制作，最終效果下圖所示。下雨效果圖項目分解項目分解任務(wù)一 制作下雨效果任務(wù)二 制作水花效果任務(wù)三 制作主場景效果操作題制作下雪的場景效果，如下圖所示。下雪效果圖【操作提示】：文件大小設(shè)置為800pixe