教學課件-中文版Flash-CS5工作過程導向標準教程(朱仁成)

項目01繪制一個網(wǎng)頁動畫場景1.1項目說明1.2項目分析1.3項目實施1.4知識延伸1.5項目實訓

1.1項目說明

小王在一家網(wǎng)頁設(shè)計公司工作，公司最近接到一個網(wǎng)站建設(shè)項目，其中首頁需要插入一個寬幅廣告，設(shè)計尺寸為800像素?×?300像素。為了提高工作效率，加快項目進度，公司采用分工合作制度。

1.2項目分析

網(wǎng)絡(luò)廣告現(xiàn)在已經(jīng)非常普遍，規(guī)格與形式也不盡相同，但是通常都是由多個場景組成的動畫。在制作本項目時，思路如下：

第一，首先正確設(shè)置尺寸，尺寸是800像素?×?300像素。在制作網(wǎng)頁動畫時，尺寸以像素為單位。

第二，使用漸變色制作夜空。

第三，建筑樓房由方塊組成，可以使用矩形工具來繪制，而樓房的尖頂可以使用多角星形工具來完成。

第四，倒影通過改變填充顏色的Alpha值來完成。1.3項目實施

制作網(wǎng)頁動畫是Flash的重要應(yīng)用之一，而場景是構(gòu)成動畫的基本要素，因此需要在Flash中進行繪制或者導入圖片作為場景。本項目的效果如圖1-1所示。圖1-1動畫場景參考效果任務(wù)一：設(shè)置舞臺大小及背景

圖1-2創(chuàng)建新文檔圖1-3【文檔設(shè)置】對話框圖1-4繪制的矩形圖1-5【屬性】面板圖1-6【顏色】面板

圖1-7填充漸變色任務(wù)二：繪制樓體

圖1-8【屬性】面板圖1-9繪制的地平面圖1-10繪制的樓房剪影(一)圖1-11繪制的樓房剪影(二)圖1-12繪制完成的樓房剪影圖1-13繪制的屋頂

圖1-14多角星形工具的設(shè)置圖1-15繪制的三角形樓頂圖1-16場景效果圖1-17繪制的避雷針圖1-18復(fù)制的群組對象圖1-19縮小復(fù)制的對象圖1-20移動并復(fù)制縮小后的樓房圖1-21縮小復(fù)制的樓房圖1-22刪除后的圖形效果圖1-23調(diào)整后的效果任務(wù)三：繪制窗戶

圖1-24繪制的窗戶圖1-25復(fù)制的矩形(一)圖1-26復(fù)制的矩形(二)圖1-27刪除后的效果圖1-28場景效果任務(wù)四：制作倒影與光束

圖1-29【顏色】面板圖1-30繪制的矩形圖1-31調(diào)整漸變色的方向圖1-32復(fù)制的樓房圖1-33調(diào)整后的效果圖1-34顏色調(diào)板圖1-35倒影效果圖1-36【屬性】面板圖1-37繪制的直線(一)圖1-38繪制的直線(二)圖1-39光束效果圖1-40最終的場景效果1.4知識延伸

知識點一：Flash的應(yīng)用領(lǐng)域

1.動畫與MTV

Flash的最初功能是用于制作網(wǎng)絡(luò)動畫，現(xiàn)在的功能則越來越強大，已經(jīng)成為動漫領(lǐng)域的重要創(chuàng)作工具之一。

圖1-41“拾荒”的《小破孩》系列動畫

2.網(wǎng)絡(luò)廣告

當網(wǎng)站的瀏覽量越來越大時，自然就有了網(wǎng)絡(luò)廣告。用Flash制作的網(wǎng)絡(luò)廣告具有直接明了、占用空間小和視覺沖擊力強等特點，正好滿足在網(wǎng)絡(luò)這種特殊環(huán)境下的要求。常見的網(wǎng)絡(luò)廣告有banner廣告、固定廣告位、浮動廣告等，廣告的尺寸也相對自由一些。圖1-42所示為某網(wǎng)站的banner廣告。圖1-42某網(wǎng)站的banner廣告

3.?Flash游戲

年輕人一般都對游戲很感興趣，如俄羅斯方塊、超級瑪莉等游戲已經(jīng)家喻戶曉。利用Flash強大的編程功能，可以制作一些簡單有趣的游戲，甚至大型網(wǎng)絡(luò)游戲。在互聯(lián)網(wǎng)上，有一些專業(yè)的游戲網(wǎng)站或Flash網(wǎng)站會提供一些由“閃客”編寫的小游戲，短小精悍，生動有趣。例如，著名閃客“小小”的火柴人游戲，其中全套的武打動作曾經(jīng)風靡一時，如圖1-43所示是其中的兩個場景。圖1-43“小小”動畫系列

4.網(wǎng)頁或網(wǎng)站

有一些用戶為了追求視覺效果，通常采用Flash來制作網(wǎng)頁或者完全使用Flash制作網(wǎng)站。使用Flash制作的網(wǎng)頁或網(wǎng)站個性強，動態(tài)效果佳，相對于普通網(wǎng)站來說更具沖擊力，所以一些個人網(wǎng)站、藝術(shù)網(wǎng)站、數(shù)據(jù)量不大的企業(yè)網(wǎng)站，都可以采用Flash制作，以強化其個性特征。圖1-44所示為Flash制作的一個動態(tài)網(wǎng)頁。圖1-44Flash制作的動態(tài)網(wǎng)頁

5.制作課件

Flash出現(xiàn)之后不久，就受到了廣大教師與教育工作者的推崇。由它所制作的課件生動、形象、過程逼真，便于增強學生的學習興趣，有助于理解課堂知識，特別是物理、化學實驗等科目，非常直觀。圖1-45所示分別為Flash制作的教學課件。圖1-45Flash制作的教學課件

6.多媒體制作

由于Flash具有強大的腳本編程能力，因此其交互性非常好，而且支持聲音、動畫、視頻等，所以Flash在多媒體制作方面也被應(yīng)用得淋漓盡致。以前開發(fā)多媒體主要使用Director或Authorware軟件，現(xiàn)在越來越多的人則喜歡使用Flash，主要因為它的交互性、支持性、擴展性比較好，還可以配上一些Flash動畫特效，并且生成的文件又比較小。圖1-46所示為Flash開發(fā)的多媒體作品。圖1-46Flash開發(fā)的多媒體作品知識點二：如何新建文件

圖1-47FlashCS5的歡迎畫面圖1-48【新建文檔】對話框圖1-49標簽形式的文件名稱知識點三：設(shè)置文檔屬性

圖1-50舞臺的屬性圖1-51【文檔設(shè)置】對話框知識點四：兩種繪制模式

FlashCS5中有兩種繪制模式，即合并繪制模式和對象繪制模式。這兩種繪制模式各有優(yōu)勢，如果能夠合理運用，將為工作帶來極大便利。

1.合并繪制模式圖1-52合并繪制模式

2.對象繪制模式圖1-53對象繪制模式

3.兩種模式的轉(zhuǎn)換圖1-54模式切換按鈕知識點五：如何設(shè)置顏色

在Flash中繪制的圖形包括輪廓與填充兩部分，所以在使用任何一種繪圖工具之前，都需要對輪廓顏色與填充顏色進行合理的設(shè)置。

1.使用工具箱的顏色區(qū)域圖1-55顏色設(shè)置選項區(qū)域

圖1-56調(diào)色板

2.使用【屬性】面板圖1-57【屬性】面板

3.使用【顏色】面板圖1-58【顏色】面板圖1-59顏色類型圖1-60線性漸變與徑向漸變

圖1-61漸變編輯條

圖1-62添加色標并更改顏色知識點六：繪圖工具組

繪圖工具組包括矩形工具、基本矩形工具、橢圓工具、基本橢圓工具和多角星形工具。這是最基本的繪圖工具，使用它們繪出來的圖形包含兩部分，即填充顏色與輪廓

顏色。

1.矩形工具和基本矩形工具圖1-63繪制的矩形、圓角矩形和正方形圖1-64【屬性】面板圖1-65不同邊角半徑的效果

2.橢圓工具和基本橢圓工具圖1-66繪制的橢圓、圓、扇形與圓環(huán)圖1-67繪制橢圓與圓時的光標圖1-68【屬性】面板圖1-69不同的參數(shù)得到不同的圖形圖1-70實心圖形和圓環(huán)圖1-71【閉合路徑】選項對圖形的影響

3.多角星形工具圖1-72繪制的五邊形圖1-73【工具設(shè)置】對話框圖1-74繪制的多邊形或星形圖1-75不同尖銳度的星形知識點七：線條工具

圖1-76【屬性】面板圖1-77筆觸樣式列表圖1-78【筆觸樣式】對話框圖1-79三種端點類型

圖1-80三種接合形態(tài)知識點八：選擇工具

圖1-81不同模式的對象被選中后的狀態(tài)圖1-82框選多個對象圖1-83單擊(雙擊)不同的位置，選擇也不相同知識點九：任意變形工具

“任意變形工具”用于改變所選對象的大小、旋轉(zhuǎn)角度和傾斜角度等。當使用該工具選擇對象以后，對象的周圍會出現(xiàn)一個變形框，并且具有一個圓形的中心點，通過它們可以變形對象。

1.縮放對象圖1-84縮放對象

2.旋轉(zhuǎn)對象圖1-85旋轉(zhuǎn)對象

3.傾斜對象圖1-86傾斜對象

4.更多的變形操作圖1-87任意變形工具的選項圖1-88扭曲變形圖1-89封套變形

5.變形命令圖1-90變形命令知識點十：漸變變形工具

“漸變變形工具”用于調(diào)整漸變顏色的過渡范圍、中心點，還可以對漸變顏色進行旋轉(zhuǎn)、改變漸變類型等操作。

1.調(diào)整線性漸變色圖1-91線性漸變色的調(diào)整狀態(tài)圖1-92調(diào)整線性漸變色

2.調(diào)整徑向漸變色圖1-93徑向漸變色的調(diào)整狀態(tài)圖1-94調(diào)整徑向漸變色1.5項目實訓

運用Flash繪畫工具繪制動畫對象或場景，是一項很常見的工作任務(wù)。每一位Flash從業(yè)者都應(yīng)該熟練應(yīng)用Flash繪畫工具。下面，使用Flash繪畫工具繪制一組切開的雞蛋或動畫場景。

任務(wù)分析

制作Flash動畫時，動畫對象或場景通常使用Flash或Photoshop進行繪制，本項目是為了訓練Flash基本工具而設(shè)計的，所以動畫尺寸沒有要求，關(guān)鍵是靈活運用漸變色、任意變形工具、橢圓工具、矩形工具等。

任務(wù)素材

光盤位置：光盤\項目01\實訓，素材如圖1-95所示。圖1-95素材

參考效果

光盤位置：光盤\項目01\實訓，參考效果如圖1-96、圖1-97所示。圖1-96參考效果圖1-97參考效果項目02繪制一個動漫角色2.1項目說明2.2項目分析2.3項目實施2.4知識延伸2.5項目實訓

2.1項目說明

使用Flash制作動漫影片或者MTV的時候，角色設(shè)計是一項很重要的任務(wù)。小李想設(shè)計一部關(guān)于武俠題材的動畫片，所以，他要為自己的影片設(shè)計一個“武僧”形象的動畫角色。在本項目中，我們將學習如何使用Flash繪制短片中的動畫角色。2.2項目分析

無論多么短小的Flash動畫片，它都是一個比較系統(tǒng)的項目工程，一般包括故事場景、情節(jié)、動畫角色、背景音樂等內(nèi)容。2.3項目實施

繪制動漫角色時，可以在Flash中徒手繪畫，也可以通過繪畫板進行繪畫。本項目則采用了最實用的描繪草圖法，這種方法既方便準確，又高效快速，比較適合制作短小精悍的Flash動畫。本項目的最終效果如圖2-1所示。圖2-1動漫角色參考效果任務(wù)一：創(chuàng)建文檔并導入草圖

圖2-2導入的圖片

圖2-3縮小后的圖片任務(wù)二：描繪人物的輪廓

圖2-4鎖定“圖層1”圖2-5創(chuàng)建新圖層圖2-6放大顯示人物頭部圖2-7【屬性】面板圖2-8創(chuàng)建的錨點

圖2-9創(chuàng)建的錨點圖2-10繪制頭部的路徑圖2-11描繪眉毛圖2-12調(diào)節(jié)控制柄

圖2-13描繪眉毛圖2-14創(chuàng)建的閉合路徑

圖2-15繪制的路徑圖2-16【屬性】面板圖2-17繪制的圓形圖2-18選擇與刪除多余的線條圖2-19繪制另一個眼球圖2-20繪制耳朵圖2-21選擇并刪除多余的部分圖2-22繪制完成所有的線條

圖2-23描繪的輪廓任務(wù)三：對人物進行填色

圖2-24更改線條的顏色圖2-25【屬性】面板圖2-26填充臉部顏色

圖2-27填充皮膚顏色圖2-28【屬性】面板

圖2-29填充衣服顏色圖2-30填充領(lǐng)口等部分

圖2-31填充顏色

圖2-32繪制的曲線圖2-33填充臉部的暗部圖2-34刪除曲線后的效果圖2-35繪制的曲線

圖2-36填充衣服部分

圖2-37填充領(lǐng)口等部分圖2-38填充棍子的暗部

圖2-39繪制的圓形圖2-40繪制眼睛的高光圖2-41最終效果

2.4知識延伸

知識點一：導入對象

使用Flash制作復(fù)雜的動畫時，往往需要借助其他輔助技術(shù)。例如，可以將Photoshop或Illustrator中繪制的圖片導入到Flash中，或者將掃描的位圖導入到Flash中，從而得以優(yōu)勢互補，提高工作效率。

1.導入位圖文件圖2-42【導入】對話框

2.導入PSD或AI文件圖2-43【將“***.psd”導入到舞臺】對話框圖2-44【將“***.ai”導入到舞臺】對話框知識點二：視圖的操作

圖2-45顯示比例框知識點三：圖層

可以將圖層理解成是一疊透明的紙，每張紙代表一個圖層，透過一張紙的透明部分可以觀察到下面紙上的內(nèi)容，而紙上有內(nèi)容的部分會遮住下面紙上相同部位的內(nèi)容。圖層是一個空間概念，通過圖層可以實現(xiàn)復(fù)雜的繪畫，也可以使動畫復(fù)雜化。在【時間軸】面板中，行代表圖層，列代表幀。

1.新建與刪除圖層圖2-46創(chuàng)建新圖層圖2-47創(chuàng)建新圖層

2.重命名圖層圖2-48重命名圖層

3.調(diào)整圖層的順序圖2-49更改圖層的順序

4.顯示/隱藏圖層圖2-50隱藏與顯示所有圖層的狀態(tài)圖2-51隱藏單個圖層圖2-52按住Alt鍵隱藏其他圖層

5.鎖定/解鎖圖層圖2-53鎖定所有圖層

圖2-54按住Alt鍵鎖定其他圖層知識點四：鋼筆工具

鋼筆工具是Flash中最靈活的繪圖工具，也是功能最強的繪圖工具。它既可以用來繪制線條，也可以用來繪制圖形。如果繪制的線條不是封閉的，則繪制的就是線條；如果繪制的線條是封閉的，則繪制的就是圖形。

鋼筆工具是基于貝塞爾曲線原理而設(shè)計的，不但功能強大，而且調(diào)整起來非常方便。它是描繪動畫背景、繪制動畫角色的必用利器。

1.繪制直線圖2-55折線路徑圖2-56閉合路徑

2.繪制曲線圖2-57調(diào)整曲線形狀圖2-58繼續(xù)繪制曲線知識點五：路徑的調(diào)整

在Flash中，路徑就是指圖形的輪廓，無論使用基本圖形工具還是鋼筆工具繪制的圖形，當使用“部分選取工具”

選擇它時，圖形周圍就會出現(xiàn)一個綠色的輪廓，它就是我們所說的“路徑”，它由錨點與線段構(gòu)成，可調(diào)節(jié)性非常強。繪制圖形時，如果不能一步到位，則需要對錨點進行調(diào)整，從而達到理想狀態(tài)。

1.添加與刪除錨點圖2-59添加錨點

圖2-60刪除錨點

2.錨點的轉(zhuǎn)換

圖2-61錨點的三種類型圖2-62將平滑點轉(zhuǎn)換為角點圖2-63將角點轉(zhuǎn)換為平滑點圖2-64將平滑點轉(zhuǎn)換為拐點

3.路徑的調(diào)整圖2-65選擇并向上移動部分錨點圖2-66選擇一個錨點圖2-67調(diào)節(jié)錨點知識點六：顏料桶工具

使用“顏料桶工具”可以為圖形填充各種各樣的顏色，該工具與【顏色】面板相結(jié)合，還可以為圖形填充漸變色與位圖。圖2-68顏料桶工具的選項圖2-69填充輪廓存在空隙的圖形圖2-70填充純色與位圖圖2-71填充線性漸變色圖2-72單擊不同的位置填充徑向漸變色

2.5項目實訓

無論是繪畫還是描圖，都必須熟練使用鋼筆工具，特別是繪制人物角色時，更離不開鋼筆工具。靈活運用Flash的繪畫與填色工具，可以完成大部分繪畫效果。下面使用鋼筆工具、顏料桶工具繪制一個人物角色的側(cè)面。

任務(wù)分析

由于人物角色的線條是不規(guī)則的，所以先使用鋼筆工具勾畫輪廓，一次不到位可以使用部分選取工具進行調(diào)整；然后使用顏料桶工具進行填色，在填色時先使用輔助線條封閉填充區(qū)域，填色后再將輔助線條刪除，這是完成本例的關(guān)鍵；另外也可以分層管理，這樣也很方便。

任務(wù)素材

該實訓項目沒有素材，屬于徒手繪畫，繪制步驟示意如圖2-73所示。圖2-73繪制步驟

參考效果

光盤位置：光盤\項目02\實訓，參考效果如圖2-74所示。圖2-74參考效果項目03繪制漂亮的動畫場景3.1項目說明3.2項目分析3.3項目實施3.4知識延伸3.5項目實訓3.1項目說明

Flash動畫中的場景設(shè)計是構(gòu)成動畫作品的重要組成部分，漂亮的場景可以提升動畫片的美感、強化主題，影響整個動畫作品的風格與水平。本項目是動畫作品“森林里的小白兔”的場景設(shè)計，使用Flash中的各種繪畫工具完成森林的繪制，要求表現(xiàn)出森林的幽靜與縱深感。3.2項目分析

創(chuàng)作Flash動畫作品時，角色的繪制與場景的設(shè)計都非常重要，要求設(shè)計師有一定的繪畫功底以及一些相關(guān)的繪畫技巧。3.3項目實施

本項目的實施是在Flash中直接鼠繪完成的，基本繪畫過程可以分為構(gòu)圖、勾勒、填色三大步驟，繪制過程中的關(guān)鍵是圖層的靈活運用以及使用復(fù)制、粘貼操作提高繪畫效率。本項目的效果如圖3-1所示。圖3-1動畫參考效果任務(wù)一：對版面進行構(gòu)圖分割

圖3-2設(shè)置鉛筆模式圖3-3【屬性】面板圖3-4繪制草圖任務(wù)二：勾畫大樹的輪廓

圖3-5【時間軸】面板圖3-6繪制樹木的外輪廓圖3-7繪制內(nèi)輪廓圖3-8繪制第二棵樹圖3-9繪制第三棵樹任務(wù)三：為大樹填充顏色

圖3-10【屬性】面板

圖3-11填充樹木顏色圖3-12設(shè)置刷子模式

圖3-13繪出樹木的亮部圖3-14填充樹疤顏色圖3-15為第二棵樹填色圖3-16繪制第二棵樹的亮部與樹疤

圖3-17為第三棵樹填色圖3-18繪制第三棵樹的亮部圖3-19【時間軸】面板圖3-20【顏色】面板圖3-21繪制的矩形圖3-22調(diào)整漸變方向任務(wù)四：繪制道路與草地

圖3-23【時間軸】面板圖3-24【顏色】面板圖3-25描繪道路與草地的邊界圖3-26繪制的整個路面圖3-27繪制路面的亮部圖3-28繪制出道路的凹凸起伏圖3-29繪制樹木的陰影圖3-30繪制的高光效果任務(wù)五：完成森林的繪制

圖3-31【時間軸】面板

圖3-32選擇中間的大樹

圖3-33【轉(zhuǎn)換為元件】對話框圖3-34【時間軸】面板圖3-35調(diào)整后的效果圖3-36調(diào)整“樹”實例的色彩圖3-37復(fù)制調(diào)整后的效果圖3-38選擇移動大樹多出舞臺的部分圖3-39繪制復(fù)制大樹的陰影圖3-40最終的場景效果3.4知識延伸

知識點一：鉛筆工具

在Flash動畫創(chuàng)作過程中，鉛筆工具主要用于繪制一些不規(guī)則的線條或勾勒背景輪廓，應(yīng)用十分廣泛。它的使用

與我們平時使用的鉛筆一樣，可以隨意繪制各種形狀的線條，使用起來非常方便，如圖3-41所示為使用鉛筆工具繪

制的線條。圖3-41使用鉛筆工具繪制的線條圖3-42【屬性】面板圖3-43鉛筆模式圖3-44“伸直”模式圖3-45“平滑”模式知識點二：刷子工具

刷子工具用于繪制圖形或為圖形填充顏色。使用方法與“鉛筆工具”相同，不同之處在于：鉛筆工具繪制的對象性質(zhì)為輪廓線，而刷子工具繪制的對象性質(zhì)為填充色。圖3-46刷子工具的相關(guān)選項圖3-47【標準繪畫】模式圖3-48【顏料填充】模式圖3-49【后面繪畫】模式圖3-50【顏料選擇】模式圖3-51【內(nèi)部繪畫】模式知識點三：初步認識元件

元件是Flash動畫中特有的一種動畫對象，是指在Flash中創(chuàng)建的圖形、按鈕或影片剪輯，它可以在動畫中重復(fù)利用，但不會增加文件的體積。元件可以是由Flash創(chuàng)建的矢量圖形，也可以是從外部導入的JPG、GIF、BMP等多種Flash支持的圖形格式。圖3-52將元件拖曳到舞臺中圖3-53創(chuàng)建多個元件的實例圖3-54選擇圖形圖3-55【轉(zhuǎn)換為元件】對話框知識點四：實例的色彩效果

在FlashCS5中，通過【屬性】面板可以設(shè)置實例的屬性，其中【色彩效果】屬性是使用比較頻繁的一類。在【屬性】面板中展開【色彩效果】分類之后，可以看到它提供了幾種不同的樣式，用于控制實例的色彩屬性，如圖3-56所示。圖3-56實例的色彩屬性圖3-57調(diào)整亮度后的效果圖3-58為實例重新著色后的效果圖3-59對實例進行高級設(shè)置后的效果圖3-60調(diào)整實例的透明度知識點五：復(fù)制與粘貼

在Flash中使用【復(fù)制】與【粘貼】命令可以快速地得到相同的圖形對象，操作方法與其他軟件略有不同。下面介紹幾種復(fù)制對象的方法。圖3-61直接復(fù)制的對象圖3-62三種不同的粘貼操作圖3-63【選擇性粘貼】對話框

3.5項目實訓

如果要向Flash動畫師的方向發(fā)展的話，首先要解決一個基礎(chǔ)問題，也是十分重要的問題，即繪畫功底，如果沒有繪畫功底，會影響Flash動畫的創(chuàng)作。本項目繪制了一個森林場景，接下來使用學到的知識繪制一個山崖場景。

任務(wù)分析

本項目主要使用了鉛筆工具與刷子工具，完全依靠良好的繪畫功底來完成。在繪制時需要分層繪制，先畫出線稿，然后進行描線與填色，填色時要注意表現(xiàn)出層次。

任務(wù)素材

該實訓項目沒有素材，屬于徒手繪畫，繪制步驟示意如圖3-64所示。圖3-64繪制步驟

參考效果

光盤位置：光盤\項目03\實訓，參考效果如圖3-65所示。圖3-65參考效果項目04森林里的小白兔動畫4.1項目說明4.2項目分析4.3項目實施4.4知識延伸4.5項目實訓4.1項目說明

動畫作品“森林里的小白兔”是某動畫公司策劃推出的一系列兒童故事，在上一個項目中，我們完成了動畫場景的繪制。本項目的任務(wù)是設(shè)計動畫角色小白兔，并完成小白兔在森林里獨步穿行的動畫，要求自然生動，畫面連續(xù)。

4.2項目分析

本項目是一個循環(huán)動畫，在網(wǎng)絡(luò)公司或動畫公司工作，循環(huán)動畫是最常見的一種動畫形式，可以通過背景的移動來實現(xiàn)，基本思路如下：

第一，將背景制作成二方連續(xù)圖，因為這樣才可以連續(xù)播放而不被發(fā)覺。所謂二方連續(xù)圖，就是一個圖案單元在左、右方向上可以連續(xù)拼接，無限延長而沒有痕跡。

第二，動畫角色要使用影片剪輯元件來完成，將動畫角色小白兔制作成走路的姿態(tài)，然后放置在場景中。

第三，理解并掌握傳統(tǒng)補間動畫的制作方法。4.3項目實施

Flash的主要功能就是動畫制作，制作動畫時將涉及到【時間軸】面板、關(guān)鍵幀、元件以及動畫類型等內(nèi)容，本項目將學習這方面的內(nèi)容，動畫效果如圖4-1所示。圖4-1動畫參考效果任務(wù)一：背景的處理

圖4-2復(fù)制后的背景效果圖4-3【轉(zhuǎn)換為元件】對話框圖4-4【時間軸】面板圖4-5調(diào)整“背景”實例的位置圖4-6創(chuàng)建傳統(tǒng)補間動畫任務(wù)二：繪制角色

圖4-7創(chuàng)建的新圖層

圖4-8繪制的橢圓圖4-9選擇整個橢圓圖4-10【轉(zhuǎn)換為元件】對話框圖4-11進入元件編輯窗口

圖4-12重命名圖層圖4-13調(diào)整橢圓的形狀圖4-14為小白兔畫上眼睛圖4-15為小白兔畫上嘴巴圖4-16【轉(zhuǎn)換為元件】對話框圖4-17繪制小白兔的腳

圖4-18刪除腳上方的線條圖4-19【時間軸】面板圖4-20【庫】面板

圖4-21調(diào)整后的位置與方向

圖4-22繪制的手圖4-23選擇手圖形圖4-24繪制的耳朵圖4-25調(diào)整后的位置與方向任務(wù)三：制作動畫

圖4-26插入關(guān)鍵幀

圖4-27選擇的“腳”圖4-28調(diào)整后的效果圖4-29選擇另一只腳圖4-30調(diào)整后的效果圖4-31選擇的“手”

圖4-32調(diào)整后的效果圖4-33向上拉長后的效果

圖4-34旋轉(zhuǎn)后的效果圖4-35創(chuàng)建傳統(tǒng)補間動畫圖4-36插入關(guān)鍵幀圖4-37調(diào)整小白兔的形態(tài)

圖4-38創(chuàng)建傳統(tǒng)補間動畫圖4-39復(fù)制并粘貼幀圖4-40創(chuàng)建傳統(tǒng)補間動畫圖4-41【時間軸】面板圖4-42創(chuàng)建的新圖層圖4-43【顏色】面板圖4-44最終效果4.4知識延伸

知識點一：【時間軸】面板

在Flash中，【時間軸】面板位于窗口的最下方，是制作Flash動畫的核心區(qū)域。單擊菜單欄中的【窗口】/【時間軸】命令(或者按下Ctrl?+?Alt?+?T鍵)，可以顯示或隱藏【時間軸】面板。圖4-45【時間軸】面板圖4-46繪圖紙外觀效果圖4-47繪圖紙外觀輪廓效果圖4-48繪圖紙標記菜單知識點二：認識幀

幀是動畫制作中的一個重要概念。它是組成動畫的基本單位，一個動畫中可以包含多個幀。在Flash中，一個動畫可以由多個圖層構(gòu)成，每一個圖層都具有一個獨立時間軸，并由多個幀構(gòu)成，圖層與幀共同決定了動畫的播放形式與時間。

1.關(guān)鍵幀

2.空白關(guān)鍵幀

3.普通幀

4.過渡幀圖4-49Flash中的幀圖4-50空白關(guān)鍵幀圖4-51關(guān)鍵幀知識點三：元件的種類與修改

1.圖形元件

2.影片剪輯元件

3.按鈕元件知識點四：【庫】面板

說到元件必須要涉及【庫】面板，實際上，【庫】面板是集合與管理動畫元素的空間，所有的動畫元素都將出現(xiàn)在【庫】面板中。圖4-52【庫】面板圖4-53【創(chuàng)建新元件】對話框圖4-54【導入】命令圖4-55【聲音】、【按鈕】和【類】公用庫知識點五：幀的操作

1.選擇幀

在【時間軸】面板中，選擇幀是對幀進行各項操作的基礎(chǔ)，我們可以選擇同一圖層中的單個幀或多個幀(包括相鄰以及不相鄰的)，也可以選擇不同圖層中的單個幀或多個幀，選擇的幀在【時間軸】面板中以深色顯示。選擇幀后，位于該幀中的對象也會同時被選擇。圖4-56選擇同一圖層中的連續(xù)多幀圖4-57選擇同一圖層中的不相鄰多幀

圖4-58選擇不同圖層中的連續(xù)多幀圖4-59選擇不同圖層中的不相鄰多幀

2.移動幀

移動幀通常是指移動關(guān)鍵幀，從而改變動畫的播放時間或者運行的快慢。移動幀的快速方法是：先選擇各幀，然后將它們拖曳到合適的位置后釋放鼠標，如圖4-60所示。圖4-60選擇并拖動幀

3.復(fù)制幀

復(fù)制幀的目的是將選擇的動畫幀再復(fù)制一份，放置到其他位置，從而提高制作動畫的效率。復(fù)制幀最快速的操作方法是：選擇要復(fù)制的幀，然后按住Alt鍵拖曳選擇的幀到合適的位置，釋放鼠標，如圖4-61所示。圖4-61選擇并復(fù)制幀

4.刪除幀

如果要對幀進行刪除操作，同樣需要將其選擇。普通幀、關(guān)鍵幀與過渡幀等都可以刪除。圖4-62選擇并刪除幀

4.5項目實訓

任務(wù)分析

本項目提供了動畫素材，直接使用它們創(chuàng)建Flash動畫即可。首先創(chuàng)建一個影片剪輯元件，并導入“駿馬.swf”文件，然后在場景中復(fù)制多個該元件的實例，并適當修改屬性，制作出多匹駿馬。最后再使用元件制作倒退的背景，以產(chǎn)生真實的奔跑動畫效果。

任務(wù)素材

光盤位置：光盤\項目04\實訓，素材如圖4-63所示。圖4-63素材

參考效果

光盤位置：光盤\項目04\實訓，參考效果如圖4-64所示。圖4-64參考效果項目05家政公司網(wǎng)絡(luò)廣告5.1項目說明5.2項目分析5.3項目實施5.4知識延伸5.5項目實訓5.1項目說明

某家政公司要在一個大型門戶網(wǎng)站上投放一期廣告，要求設(shè)計人員以Flash動畫的形式循環(huán)播放公司的主要服務(wù)“搬家、維修、保潔、開鎖、陪護、保姆、家教、代購”以及電話等信息，畫面主要以文字為主。5.2項目分析

在各種媒體宣傳廣告中，網(wǎng)絡(luò)廣告越來越被商家所重視，它主要分為靜態(tài)圖片廣告、動態(tài)Flash廣告以及Flash交互形式的廣告。5.3項目實施

本項目的制作技術(shù)并不難，主要是了解Flash中文本工具的使用以及動畫預(yù)設(shè)功能的便捷性，另外需要熟練運用影片剪輯元件。本項目的參考效果如圖5-1所示。圖5-1動畫參考效果任務(wù)一：背景動畫的處理

圖5-2更改圖層名稱圖5-3【顏色】面板

圖5-4矩形效果圖5-5【顏色】面板圖5-6繪制虛光的圓形圖5-7繪制的矩形

圖5-8【變形】面板圖5-9縮小傾斜的矩形

圖5-10【轉(zhuǎn)換為元件】對話框圖5-11創(chuàng)建傳統(tǒng)補間動畫圖5-12第1幀中的“星”實例的屬性圖5-13第20幀中的“星”實例的屬性圖5-14復(fù)制選擇的幀圖5-15【時間軸】面板圖5-16“圖層5”的第41幀中的實例屬性圖5-17星星的閃爍效果任務(wù)二：制作公司Logo動畫

圖5-18創(chuàng)建的新圖層圖5-19【屬性】面板

圖5-20繪制的折線圖5-21【屬性】面板

圖5-22輸入的文字圖5-23【屬性】面板圖5-24調(diào)整輸入的文字圖5-25【屬性】面板

圖5-26調(diào)整輸入的英文圖5-27【時間軸】面板圖5-28調(diào)整第1幀中的“Logo”實例

圖5-29調(diào)整第25幀中的“Logo”實例圖5-30【時間軸】面板任務(wù)三：創(chuàng)建文字動畫

圖5-31【屬性】面板

圖5-32輸入的文字圖5-33輸入的文字圖5-34輸入的文字圖5-35【時間軸】面板圖5-36【時間軸】面板圖5-37調(diào)整文字的位置圖5-38【時間軸】面板圖5-39【時間軸】面板任務(wù)四：制作電話號碼的動畫

圖5-40【屬性】面板

圖5-41輸入的數(shù)字圖5-42【顏色】面板

圖5-43數(shù)字的漸變效果圖5-44【屬性】面板圖5-45填充白色輪廓圖5-46【時間軸】面板圖5-47【動畫預(yù)設(shè)】面板

圖5-48【時間軸】面板圖5-49【時間軸】面板圖5-50【時間軸】面板

圖5-51導入的圖片圖5-52【屬性】面板

圖5-53圖片效果5.4知識延伸

知識點一：【變形】面板

在Flash中，可以通過兩種方法實現(xiàn)對象的變形：第一是“任意變形工具”，在“項目01”中已經(jīng)介紹過它的使用方法，其特點是自由度高，可以靈活控制對象的縮放、旋轉(zhuǎn)、傾斜等變形；第二是【變形】面板，其特點是精確度高，除了可以實現(xiàn)精確變形外，還可以實現(xiàn)復(fù)制并應(yīng)用變形操作。使用【變形】面板可以對所選對象進行精確的縮放、旋轉(zhuǎn)、傾斜等操作，從而使對象產(chǎn)生變形，并且可以在變形的同時進行復(fù)制對象的操作，如圖5-54所示。圖5-54【變形】面板知識點二：文本工具

1.文本類型

Flash中的文本分為三大類型：靜態(tài)文本、動態(tài)文本和輸入文本。不同的文本類型可以滿足不同的動畫要求。

2.輸入文本

在輸入文本時，文本框有兩種狀態(tài)：無寬度限制和有寬度限制，下面我們來學習這兩者的區(qū)別。

圖5-55無寬度限制的文本框圖5-56有寬度限制的文本框

3.文本的字符屬性

文本的屬性分為字符屬性與段落屬性。字符屬性即字體、大小、顏色等屬性。

文本的屬性可以在輸入文本之前設(shè)置，也可以在輸入文本之后設(shè)置。在舞臺中輸入一段文本之后，既可以對整段文本進行屬性設(shè)置，也可以對個別文字進行設(shè)置。圖5-57選中整段文本圖5-58選中特定的文本圖5-59【屬性】面板

圖5-60選擇字體圖5-61設(shè)置字體大小圖5-62設(shè)置字母之間的距離圖5-63抗鋸齒的方式與效果圖5-64文本的正常、上標與下標效果

4.文本的段落屬性

文本的段落屬性主要是針對有寬度限制的文本而言的，包括文本的對齊方式、行距、頁邊距等。這些屬性的設(shè)置也是通過【屬性】面板完成的，如圖5-65所示。圖5-65【屬性】面板圖5-66左對齊和右對齊效果圖5-67縮進效果

圖5-68行距效果

圖5-69設(shè)置邊距后的效果

圖5-70文字的排列效果

5.分離文本

文本是一種特殊的動畫對象，可以將其進行分離操作。分離文本的操作非常實用，文本被分離后可以轉(zhuǎn)換為圖形，用戶可以像編輯圖形一樣編輯它。例如，要制作一個漸變色文字，就必須先分離文本，然后再為其填充漸變色。圖5-71選擇文本圖5-72分離后的文字圖5-73編輯后的效果知識點三：墨水瓶工具

“墨水瓶工具”的作用是改變圖形輪廓線的顏色與形態(tài)，功能很單一，所以使用起來也不繁瑣，操作非常簡單。圖5-74【屬性】面板

圖5-75改變圖形的輪廓線知識點四：動畫類型與【時間軸】面板中的標識

1.逐幀動畫

逐幀動畫是一種比較傳統(tǒng)的動畫形式，這種動畫中只有關(guān)鍵幀而沒有過渡幀，在每一個關(guān)鍵幀中都設(shè)置一個畫面，若干個連續(xù)關(guān)鍵幀組成動畫，因此逐幀動畫制作起來較為繁瑣，但是它可以表現(xiàn)出比較細膩、復(fù)雜的動畫效果，因此是一種非常重要的動畫形式。圖5-76逐幀動畫的外觀形態(tài)

2.傳統(tǒng)補間動畫

由于Flash新版本中引入了全新動畫制作方式，類似于AfterEffects動畫特點，被命名為“補間動畫”，所以老版本中的“補間動畫”在新版本中被命名為“傳統(tǒng)補間動畫”，它是以前使用最為廣泛的動畫形式，F(xiàn)lash老用戶比較習慣于這種動畫方式，在【時間軸】面板中，它的外觀形態(tài)是在兩個關(guān)鍵幀之間以黑色箭頭和淡紫色背景呈現(xiàn)，如圖5-77所示。圖5-77傳統(tǒng)補間動畫的外觀形態(tài)

3.補間形狀動畫

補間形狀動畫是一種Flash動畫類型，不僅可以制作出圖形外形的變化，也可以制作出移動、縮放、色彩變化、變速運動、遮罩等動畫效果。但是補間形狀動畫的動畫對象必須是圖形，也就是說，只有圖形才能用來制作補間形狀動畫，如果要對文字、實例、群組對象等制作補間形狀動畫，必須先執(zhí)行【分離】命令將其分離為圖形。在【時間軸】面板中，它的外觀形態(tài)是在兩個關(guān)鍵幀之間以黑色箭頭和綠色背景呈現(xiàn)，如圖5-78所示。圖5-78補間形狀動畫的外觀形態(tài)

4.補間動畫

補間動畫功能強大，易于創(chuàng)建，它是FlashCS4版本新增的功能，吸收了AfterEffects的動畫特點，這種動畫形式可以直接操作動畫對象，而不是關(guān)鍵幀，更多的動畫屬性需要在【動畫編輯器】面板中進行設(shè)置。在【時間軸】面板中，它的外觀形態(tài)是一段藍色背景的幀，黑色圓點表示動畫的起始關(guān)鍵幀，黑色菱形點表示動畫的屬性關(guān)鍵幀，如圖5-79所示。圖5-79補間動畫的外觀形態(tài)

5.骨骼動畫

骨骼動畫也稱為反向運動(IK)動畫，它是一種使用骨骼的有關(guān)結(jié)構(gòu)對一個對象或彼此相關(guān)的一組對象進行動畫處理的方法。用于骨骼動畫的對象有兩種：一種是元件的實例；一種是圖形。使用骨骼動畫，可以使對象按照復(fù)雜而自然的方式運動，輕松地創(chuàng)建人物動畫，如胳膊、腿和面部表情的變化。在【時間軸】面板中，它的外觀形態(tài)是一段具有綠色背景的幀，每個姿勢在時間軸中顯示為黑色菱形點，如圖5-80所示。圖5-80骨骼動畫的外觀形態(tài)知識點五：動畫預(yù)設(shè)

Flash提供了動畫預(yù)設(shè)功能，可以讓用戶通過最少的步驟實現(xiàn)動畫制作。另外，用戶也可以將自己做好的動畫進行自定義預(yù)設(shè)，然后在其他文件中使用。圖5-81【動畫預(yù)設(shè)】面板

圖5-82預(yù)覽動畫效果知識點六：傳統(tǒng)補間動畫

傳統(tǒng)補間動畫是Flash中最常使用的一種動畫形式，使用它可以制作出對象位移、放大縮小、變形、色彩、透明度、顏色亮度、旋轉(zhuǎn)等變化的動畫效果。圖5-83創(chuàng)建傳統(tǒng)補間動畫的兩種方法

5.5項目實訓

任務(wù)分析

本項目中提供了一幅汽車圖片，其他均為文字信息。制作時設(shè)計了三個場景：第一個是Focus場景，即聚焦新產(chǎn)品；第二個是汽車與賣點宣傳語；第三個是品牌信息。本項目的技術(shù)主要運用了元件、傳統(tǒng)補間動畫、遮罩動畫等。

任務(wù)素材

光盤位置：光盤\項目05\實訓，素材如圖5-84所示。圖5-84素材參考效果

光盤位置：光盤\項目05\實訓，參考效果如圖5-85所示。圖5-85參考效果項目06天正建筑網(wǎng)站片頭6.1項目說明6.2項目分析6.3項目實施6.4知識延伸6.5項目實訓6.1項目說明

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

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

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

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

圖6-6【變形】面板

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

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

圖6-19第105幀中的實例屬性

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

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

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

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

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

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

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

圖6-38【屬性】面板

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

圖6-43【時間軸】面板圖6-44【屬性】面板圖6-45【屬性】面板圖6-46選擇所有的動畫幀

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

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

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

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

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

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

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

知識點一：補間形狀動畫

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

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

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

圖6-67新建圖層文件夾

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

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

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

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

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

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

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

圖6-85【代碼片斷】面板圖6-86展開的代碼圖6-87【動作】面板圖6-88【時間軸】面板

6.5項目實訓

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

使用Flash制作片頭時要突出動感與節(jié)奏，對于企業(yè)宣傳片的片頭而言，要突出企業(yè)特點、標識等信息。本項目提供了三幅素材圖片，制作時主要運用補間形狀動畫、濾鏡、傳統(tǒng)補間動畫、多圖層的控制等技術(shù)，沒有太多難點，動畫的設(shè)計與節(jié)奏的控制是關(guān)鍵。

任務(wù)素材

光盤位置：光盤\項目06\實訓，素材如圖6-89所示。

參考效果

光盤位置：光盤\項目06\實訓，參考效果如圖6-90、圖6-91所示。圖6-89素材圖6-90參考效果(一)圖6-91參考效果(二)項目07制作網(wǎng)站橫幅廣告7.1項目說明7.2項目分析7.3項目實施7.4知識延伸7.5項目實訓7.1項目說明

所謂橫幅廣告，也稱為Banner廣告，是網(wǎng)絡(luò)廣告的一種形式，它橫跨于整個網(wǎng)頁，多以Flash動畫形式呈現(xiàn)。小王所在的廣告公司接了一項紅酒廣告的全程推廣業(yè)務(wù)，其中有一項內(nèi)容是網(wǎng)站橫幅廣告的制作。要求主題明確，重點突出，節(jié)奏感強。

7.2項目分析

從某種意義上說，橫幅廣告實際上就是讓平面廣告“動”起來，放在網(wǎng)站上吸引人的注意力，從而達到廣告效果。在設(shè)計本項目中的紅酒廣告時，要求色調(diào)尊貴典雅，突出品味，動畫的節(jié)奏明快，在Flash技術(shù)上主要運用補間動畫來完成。7.3項目實施

網(wǎng)站橫幅廣告的最大特點是字體大，文字少，視覺沖擊力強，實施的關(guān)鍵在于動畫的設(shè)計、版面的控制，制作技術(shù)并不困難，會使用基本的Flash工具與動畫功能，就可以制作出漂亮的網(wǎng)站橫幅廣告。本項目的參考效果如圖7-1所示。圖7-1動畫參考效果任務(wù)一：背景的處理

圖7-2繪制的矩形圖7-3選擇“網(wǎng)格填充”

圖7-4設(shè)置網(wǎng)格填充的參數(shù)圖7-5填充網(wǎng)格后的效果圖7-6動畫背景效果任務(wù)二：制作幕布拉開動畫

圖7-7【將“幕布.psd”導入到舞臺】對話框

圖7-8【時間軸】面板圖7-9【時間軸】面板

圖7-10【庫】面板圖7-11調(diào)整幕布的位置圖7-12【將“Logo.ai”導入到舞臺】對話框

圖7-13【時間軸】面板圖7-14【變形】面板

圖7-15【屬性】面板圖7-16調(diào)整“Logo”實例的位置圖7-17【時間軸】面板圖7-18調(diào)整第15幀處的“幕布”實例的位置圖7-19翻轉(zhuǎn)關(guān)鍵幀圖7-20【時間軸】面板圖7-21【時間軸】面板圖7-22【時間軸】面板圖7-23【變形】面板圖7-24調(diào)整第50幀處的實例位置圖7-25【時間軸】面板圖7-26導入的圖片任務(wù)三：制作文字動畫

圖7-27【時間軸】面板圖7-28第40幀處的“文字1”實例屬性圖7-29【時間軸】面板圖7-30導入的圖片圖7-31第65幀處的“產(chǎn)品”實例屬性圖7-32第70幀處的“產(chǎn)品”實例屬性圖7-33第85幀處的“產(chǎn)品”實例屬性圖7-34【時間軸】面板圖7-35【屬性】面板圖7-36輸入的文字圖7-37分離文字圖7-38分散到圖層圖7-39插入關(guān)鍵幀圖7-40創(chuàng)建傳統(tǒng)補間動畫

圖7-41“十”字的屬性設(shè)置圖7-42【時間軸】面板圖7-43【時間軸】面板圖7-44輸入的文字圖7-45【時間軸】面板圖7-46輸入的文字圖7-47為文字應(yīng)用動畫圖7-48為文字應(yīng)用動畫圖7-49改變運動方向圖7-50【時間軸】面板7.4知識延伸

知識點一：Deco工具

“Deco工具”是一個裝飾畫繪畫工具，它可以將影片剪輯元件或圖形元件作為繪圖單元，以某種特定的計算方式創(chuàng)建復(fù)雜的幾何圖案。同時，它還可以創(chuàng)建煙動畫、火焰動畫等，是一個非常不錯的動畫輔助工具。圖7-5113種繪制效果

1．藤蔓式填充

在【屬性】面板中選擇繪制效果為“藤蔓式填充”時，【屬性】面板中的參數(shù)如圖7-52所示。圖7-52【屬性】面板

2．網(wǎng)格填充

在【屬性】面板中選擇繪制效果為“網(wǎng)格填充”時，【屬性】面板中的參數(shù)如圖7-53所示。圖7-53【屬性】面板

3．對稱刷子

在【屬性】面板中選擇繪制效果為“對稱刷子”時，【屬性】面板中的參數(shù)如圖7-54所示。這種方式是以對稱的形式繪制圖案的。圖7-54【屬性】面板圖7-55跨線反射

圖7-56跨點反射

圖7-57旋轉(zhuǎn)圖7-58網(wǎng)格平移

4．建筑物刷子

在【屬性】面板中選擇繪制效果為“建筑物刷子”時，【屬性】面板中的參數(shù)如圖7-59所示。這種方式可以繪制出系統(tǒng)提供的四種摩天大樓圖案，在【高級選項】中可以選擇不同的摩天大樓，或者隨機創(chuàng)建。圖7-59【屬性】面板

5．花刷子

在【屬性】面板中選擇繪制效果為“花刷子”時，可以繪制花朵圖案，此時【屬性】面板中的參數(shù)如圖7-60所示。圖7-60【屬性】面板

6．火焰動畫

在【屬性】面板中選擇繪制效果為“火焰動畫”時，可以創(chuàng)建火焰動畫，此時【屬性】面板中的參數(shù)如圖7-61所示。圖7-61【屬性】面板圖7-62創(chuàng)建火焰動畫后的【時間軸】面板知識點二：補間動畫

補間動畫是一種新的動畫類型，它是“基于對象的動畫”。為了區(qū)別于以前版本中的補間動畫，F(xiàn)lash把以前版本中的補間動畫改稱為“傳統(tǒng)補間動畫”。

補間動畫是通過對同一對象的某種屬性在不同幀之間賦予不同的值來創(chuàng)建的，該屬性在兩幀之間的部分由系統(tǒng)自動生成。圖7-63屬性關(guān)鍵幀圖7-64提示框圖7-65提示框

1．創(chuàng)建補間動畫

創(chuàng)建補間動畫的方法有兩種：一是使用快捷菜單中的【創(chuàng)建補間動畫】命令；二是使用菜單欄中的【插入】/【補間動畫】命令。相比而言，前一種方法更方便。圖7-66快捷菜單

圖7-67快捷菜單圖7-68【時間軸】面板

2．屬性關(guān)鍵幀的創(chuàng)建

創(chuàng)建了補間動畫以后，還需要設(shè)置屬性關(guān)鍵幀，才可以得到相應(yīng)的動畫效果。圖7-69【插入關(guān)鍵幀】命令子菜單知識點三：動畫編輯器

制作補間動畫時，既可以通過在舞臺中直接操作對象的方式進行，也可以通過【動畫編輯器】面板來完成?！緞赢嬀庉嬈鳌棵姘宓牟僮鞣浅ｎ愃朴?dsmax或AE的操作。通過它可以查看所有補間屬性以及屬性關(guān)鍵幀。另外，【動畫編輯器】面板也是精確設(shè)置動畫屬性的專業(yè)工具。圖7-70【動畫編輯器】面板圖7-71插入屬性關(guān)鍵幀圖7-72緩動效果圖7-73“簡單(慢)”緩動效果的設(shè)置圖7-74預(yù)設(shè)的緩動效果圖7-75所有添加的緩動效果圖7-76緩動曲線圖7-77點的平滑屬性圖7-78四種點的類型圖7-79直接操作曲線知識點四：【信息】面板

使用【信息】面板可以設(shè)置對象的寬度與高度，還可以設(shè)置對象在舞臺中的精確位置。單擊菜單欄中的【窗口】/【信息】命令，或者按下Ctrl?+?I命令，可以打開【信息】面板。圖7-80改變對象的大小圖7-81改變對象的位置知識點五：分散到圖層

【分散到圖層】命令可以快速地將同一幀中的對象分散到各個獨立的圖層中，從而為創(chuàng)建動畫提供快速的操作途徑。

執(zhí)行該命令之前，必須先選擇要操作的對象，這些對象可以位于一個圖層中，也可以位于多個圖層中。類型可以為圖形、實例、位圖、視頻剪輯，也可以是分離后的單個文本。下面以文字為例介紹該命令的使用。圖7-82輸入的文字

圖7-83分散到圖層7.5項目實訓

任務(wù)分析

本項目提供了一個背景圖片，基本思路是：樓盤名稱由小變大出現(xiàn)在畫面中心，然后左移；接著出現(xiàn)廣告信息，設(shè)計成打字效果與遮罩效果；最后是空白背景出現(xiàn)“搶售中……”文字。在技術(shù)上以補間動畫和傳統(tǒng)補間動畫為主。

任務(wù)素材

光盤位置：光盤\項目07\實訓，素材如圖7-84所示。

參考效果

光盤位置：光盤\項目07\實訓，參考效果如圖7-85所示。圖7-84素材圖7-85參考效果項目08彈出式Flash廣告8.1項目說明8.2項目分析8.3項目實施8.4知識延伸8.5項目實訓8.1項目說明

一家功夫?qū)W校要對外擴大宣傳，提高知名度，廣攬生源，于是想在一家門戶網(wǎng)站上做一個彈出式Flash廣告，即打開指定的網(wǎng)頁時，彈出一個Flash廣告動畫，播放完畢后自動關(guān)閉或人工關(guān)閉。于是委托網(wǎng)頁設(shè)計公司的Flash設(shè)計師來完成這個項目，要求畫面簡潔，視覺效果好。8.2項目分析

功夫類的廣告一般要求動感強、視覺效果好，風格上可以向功夫電影的風格靠近，也可以采用古代卷軸的效果，使其看起來像武功秘籍一般。本項目在制作的技術(shù)上，主要運用了傳統(tǒng)引導線動畫、遮罩動畫、逐幀動畫。8.3項目實施

本項目涉及了多種Flash動畫技術(shù)，既有最新的補間動畫，也有傳統(tǒng)補間動畫、逐幀動畫、遮罩動畫等，另外還涉及了位圖的編輯、套索工具的使用、對齊與分布等。本項目的效果如圖8-1所示。圖8-1動畫參考效果任務(wù)一：制作背景

圖8-2導入的圖片

圖8-3【屬性】面板圖8-4【對齊】面板與對齊后的效果圖8-5【時間軸】面板

圖8-6繪制的矩形任務(wù)二：制作剪影動畫

圖8-7提示對話框圖8-8【將“功夫1.ai”導入到舞臺】對話框

圖8-9導入的圖片

圖8-10【時間軸】面板圖8-11變形導入的圖片圖8-12【時間軸】面板圖8-13【屬性】面板圖8-14【屬性】面板圖8-15【時間軸】面板圖8-16【將“功夫2.ai”導入到舞臺】對話框圖8-17調(diào)整導入圖形的大小和位置圖8-18【時間軸】面板圖8-19【屬性】面板圖8-20【屬性】面板圖8-21導入的圖片圖8-22【時間軸】面板圖8-23放大“功夫3”實例任務(wù)三：制作書法動畫

圖8-24【時間軸】面板圖8-25導入的圖片圖8-26【魔術(shù)棒設(shè)置】對話框圖8-27刪除后的效果圖8-28縮小后的效果圖8-29導入的圖片圖8-30調(diào)整后的效果圖8-31“毛筆”實例的位置圖8-32【時間軸】面板圖8-33創(chuàng)建的運動引導層圖8-34繪制引導線圖8-35繪制引導線圖8-36調(diào)整中心點的位置

圖8-37對齊圖8-38【時間軸】面板

圖8-39第60幀的刪除效果圖8-40第61幀的刪除效果圖8-41第62幀的刪除效果圖8-42第63幀的刪除效果圖8-43清除關(guān)鍵幀

圖8-44第90幀的刪除效果圖8-45第106幀的刪除效果圖8-46【時間軸】面板圖8-47第120幀的刪除效果

圖8-48第160幀處的效果圖8-49插入空白關(guān)鍵幀圖8-50輸入的文本任務(wù)四：制作文字信息動畫

圖8-51【時間軸】面板

圖8-52【屬性】面板圖8-53輸入的文字

圖8-54【時間軸】面板

圖8-55【庫】面板圖8-56變形牛皮紙圖片圖8-57【時間軸】面板圖8-58第20幀處的圖片位置圖8-59選擇【遮罩層】命令圖8-60遮罩效果與【時間軸】面板圖8-61【時間軸】面板圖8-62輸入的文字圖8-63制作的按鈕圖8-64【屬性】面板

圖8-65【時間軸】面板

8.4知識延伸

知識點一：對齊與分布

在制作網(wǎng)站、相冊或者其他動畫作品的時候，為了使界面看上去嚴謹整齊，往往需要將若干對象進行嚴格的對齊與分布，F(xiàn)lash為用戶提供了多種對齊工具，使用它們可以輕松地完成這項工作。圖8-66【對齊】子菜單圖8-67【對齊】面板圖8-68各種對齊效果圖8-69分布前后的效果對比圖8-70不同的匹配效果知識點二：套索工具的使用

“套索工具”主要用于選擇圖形或位圖中的任意一部分，它的使用方法與Photoshop中的套索工具基本一致。選擇工具箱中的“套索工具”后，工具箱的下方將出現(xiàn)三個基本選項，如圖8-71所示。圖8-71套索工具的選項

圖8-72選擇任意形狀的區(qū)域圖8-73選擇多邊形區(qū)域圖8-74選擇位圖的背景并刪除圖8-75【魔術(shù)棒設(shè)置】對話框知識點三：引導線動畫

在日常生活中，物體的運動并不是作簡單的直線運動，通常是沿著一定的軌跡運動。在Flash中制作這種動畫時，需要創(chuàng)建一個運動引導線(