《Animate動(dòng)畫(huà)設(shè)計(jì)與制作實(shí)例教程（AnimateCC2019）》全套教學(xué)課件

Animate動(dòng)畫(huà)設(shè)計(jì)與制作實(shí)例教程

（AnimateCC2019）項(xiàng)目1制作VI標(biāo)識(shí)項(xiàng)目2制作電子賀卡項(xiàng)目3制作電子相冊(cè)項(xiàng)目4制作廣告項(xiàng)目5制作MTV項(xiàng)目6制作電子閱讀物項(xiàng)目7制作動(dòng)畫(huà)片項(xiàng)目8制作游戲項(xiàng)目9制作網(wǎng)站全套可編輯PPT課件項(xiàng)目一

制作VI標(biāo)識(shí)項(xiàng)目簡(jiǎn)介

企業(yè)形象識(shí)別系統(tǒng)（CorporateIdentitySystem，CIS）包括3個(gè)部分，分別是理念識(shí)別（MindIdentity，MI）、行為識(shí)別（BehaviorIdentity，BI）和視覺(jué)識(shí)別（VisualIdentity，VI）。其中VI包括基本要素（企業(yè)名稱(chēng)、企業(yè)標(biāo)志、標(biāo)準(zhǔn)字、標(biāo)準(zhǔn)色、企業(yè)造型等）和應(yīng)用要素（產(chǎn)品造型、辦公用品、服裝、招牌、交通工具等）。VI標(biāo)識(shí)通過(guò)展示視覺(jué)元素，能夠較好地體現(xiàn)企業(yè)的經(jīng)營(yíng)理念和經(jīng)營(yíng)風(fēng)格，是傳播企業(yè)形象的有效手段。

本項(xiàng)目詳細(xì)介紹AnimateCC2019的基礎(chǔ)知識(shí)和基本操作，并通過(guò)3個(gè)實(shí)例，講解AnimateCC2019在企業(yè)標(biāo)識(shí)制作中的應(yīng)用。通過(guò)本項(xiàng)目的學(xué)習(xí)，讀者可以了解AnimateCC2019的操作界面，掌握繪制圖形、編輯圖形的方法和技巧，掌握用AnimateCC2019繪制企業(yè)靜態(tài)及動(dòng)態(tài)VI的方法和技巧。學(xué)習(xí)目標(biāo)了解Animate的繪制模式；掌握工具箱中各種工具的使用方法；掌握“混色器”面板、“變形”面板的使用方法；掌握石化商標(biāo)、企業(yè)標(biāo)識(shí)、校園文化節(jié)會(huì)徽的制作方法。

2015年12月2日，Adobe公司宣布將FlashProfessional更名為AnimateCC。它支持動(dòng)畫(huà)、聲音及交互，具有強(qiáng)大的多媒體編輯功能，在支持FlashSWF文件的基礎(chǔ)上，加入了對(duì)HTML5的支持。AnimateCC的操作界面如圖1-1所示。1.1知識(shí)準(zhǔn)備——Animate繪圖圖1-11．默認(rèn)繪制模式

用AnimateCC2019工具箱中的繪圖工具直接繪制的圖形叫作“形狀”，選中時(shí)形狀上出現(xiàn)網(wǎng)格點(diǎn)，如圖1-2（a）所示。形狀在“屬性”面板中的屬性只有“寬”“高”和“坐標(biāo)值”，如圖1-2（b）所示。1.1.1Animate的繪制模式

（a）

（b）圖1-2（1）形狀的切割和融合

圖1-3

圖1-4

圖1-5

圖1-6

圖1-7

圖1-8（2）將形狀轉(zhuǎn)換為組

執(zhí)行“修改”>“組合”命令，可以將選中的對(duì)象組合成“組”。圖1-9

圖1-10

圖1-112．對(duì)象繪制模式

在“矩形”“橢圓”“鋼筆”“刷子”等工具的選項(xiàng)中找到“對(duì)象繪制”選項(xiàng)，如圖1-12所示。

繪制一個(gè)對(duì)象，選擇“橢圓”工具，在工具箱的選項(xiàng)中單擊“對(duì)象繪制”按鈕，在“舞臺(tái)”上繪制一個(gè)圓形，如圖1-13所示。展開(kāi)“屬性”面板，可以看到這里繪制的橢圓不再是形狀，而是一個(gè)繪制對(duì)象，如圖1-14所示。

使用“對(duì)象繪制”選項(xiàng)后，在同一圖層繪制出的形狀和線(xiàn)條自動(dòng)成組，在移動(dòng)時(shí)不會(huì)互相切割、互相影響。

圖1-12

圖1-13

圖1-14

選中“線(xiàn)條”工具后，可以在圖1-15所示的“屬性”面板中對(duì)直線(xiàn)的筆觸顏色、筆觸高度和筆觸樣式等屬性進(jìn)行設(shè)置。1.1.2“線(xiàn)條”工具圖1-151．筆觸顏色

圖1-162．筆觸高度3．筆觸樣式圖1-174．自定義筆觸樣式5．線(xiàn)條的端點(diǎn)圖1-18圖1-196．線(xiàn)條的接合圖1-20

圖1-21

圖1-221．更改線(xiàn)條的長(zhǎng)度和方向

在工具箱中選中“選擇”工具，然后移動(dòng)鼠標(biāo)指針到線(xiàn)條的端點(diǎn)處，當(dāng)鼠標(biāo)指針右下角出現(xiàn)直角標(biāo)志后，按下鼠標(biāo)左鍵拖動(dòng)鼠標(biāo)，即可改變線(xiàn)條的長(zhǎng)度和方向，如圖1-23所示。2．更改線(xiàn)條的輪廓

將鼠標(biāo)指針移動(dòng)到線(xiàn)條上，當(dāng)鼠標(biāo)指針右下角出現(xiàn)弧線(xiàn)標(biāo)志后，按下鼠標(biāo)左鍵拖動(dòng)鼠標(biāo)，即可改變線(xiàn)條的輪廓，使直線(xiàn)變成各種形狀的弧線(xiàn)，如圖1-24所示。1.1.3“選擇”工具

圖1-23

圖1-241.1.4“顏料桶”工具

圖1-25

圖1-261．“矩形”工具2．“多角星形”工具1.1.5“矩形”工具與“多角星形”工具圖1-32

“橢圓”工具用于繪制橢圓或者圓，操作時(shí)單擊“橢圓”工具或者按O鍵。1.1.6“橢圓”工具圖1-34

圖1-35

圖1-36

圖1-37圖1-38

圖1-39

圖1-40

圖1-411．用“鋼筆”工具繪制直線(xiàn)2．用“鋼筆”工具繪制曲線(xiàn)3．修改曲線(xiàn)的方法1.1.7“鋼筆”工具

“部分選取”工具用于調(diào)整節(jié)點(diǎn)，改變圖形的形狀，操作時(shí)單擊“部分選取工具”按鈕或者按A鍵。1.1.8“部分選取”工具圖1-51

圖1-52

圖1-53圖1-54

圖1-55圖1-56

圖1-57

“鉛筆工具”用于手繪圖形，操作時(shí)單擊“鉛筆工具”按鈕或者按Y鍵。

選擇工具箱中的“鉛筆”工具，將鼠標(biāo)指針移到“舞臺(tái)”中，按住鼠標(biāo)左鍵隨意拖動(dòng)即可繪制任意直線(xiàn)或曲線(xiàn)，繪制的方式與使用真實(shí)鉛筆大致相同。單擊工具箱底部的“鉛筆模式”按鈕，在彈出的下拉列表中有3種繪圖模式可以選擇，如圖1-66所示。1.1.9“鉛筆”工具

圖1-66◎在伸直模式下，線(xiàn)條自動(dòng)轉(zhuǎn)化成接近形狀的直線(xiàn)?！蛟谄交Ｊ较拢€(xiàn)條轉(zhuǎn)化為接近形狀的平滑線(xiàn)。◎在墨水模式下，不加修飾，完全保持鼠標(biāo)軌跡的形狀。

應(yīng)用伸直、平滑、墨水3種繪圖模式繪制的樹(shù)葉最終效果如圖1-67所示。圖1-67

使用“畫(huà)筆”工具可以繪制任意形狀、大小及顏色的填充區(qū)域，也可以給已經(jīng)繪制好的對(duì)象填充顏色。操作時(shí)單擊“畫(huà)筆”工具按鈕或者按B鍵。單擊“畫(huà)筆”工具，將鼠標(biāo)指針移到“舞臺(tái)”中，鼠標(biāo)指針變成一個(gè)黑色的圓形或方形的刷子，單擊即可在“舞臺(tái)”中繪制對(duì)象。

選中“畫(huà)筆”工具后，激活工具箱底部的下拉菜單按鈕，顯示畫(huà)筆的5種繪畫(huà)模式，如圖1-72所示。1.1.10“畫(huà)筆”工具圖1-72◎標(biāo)準(zhǔn)繪畫(huà)：不管是線(xiàn)條，還是填充范圍，只要是畫(huà)筆經(jīng)過(guò)的地方，都變成了畫(huà)筆的顏色?！蝾伭咸畛洌褐挥绊懱畛涞膬?nèi)容，不會(huì)遮蓋住線(xiàn)條?！蚝竺胬L畫(huà)：無(wú)論怎么畫(huà)，它都在圖像的后方，不會(huì)影響前景圖像。◎顏料選擇：用“選擇”工具選中圖形的一塊，再選擇“畫(huà)筆”工具進(jìn)行繪制，此時(shí)選擇區(qū)域被涂上所選的顏色?！騼?nèi)部繪畫(huà)：在繪畫(huà)時(shí)，畫(huà)筆的起點(diǎn)必須在輪廓線(xiàn)以?xún)?nèi)，而且畫(huà)筆的范圍也只作用在輪廓線(xiàn)以?xún)?nèi)。

以上5種繪畫(huà)模式的效果如圖1-73所示。圖1-73

“套索”工具用于選擇形狀圖形的不規(guī)劃區(qū)域或者相同的顏色區(qū)域，操作時(shí)單擊“套索工具”按鈕或者按L鍵?！疤姿鳌惫ぞ咛峁┝?個(gè)按鈕，如圖1-76所示。1.1.11“套索”工具圖1-761．“套索工具”選項(xiàng)

選擇“套索工具”選項(xiàng)，用鼠標(biāo)在位圖上任意勾選想要的區(qū)域，形成一個(gè)封閉的選區(qū)，釋放鼠標(biāo)，選區(qū)中的圖像被選中。2．“魔術(shù)棒”選項(xiàng)

選中“魔術(shù)棒”選項(xiàng)，將鼠標(biāo)指針?lè)旁谖粓D上，指針變化，在要選擇的位圖上單擊，與點(diǎn)取點(diǎn)顏色相近的圖像區(qū)域被選中，如圖1-77所示。圖1-773．“多邊形工具”選項(xiàng)

選中“多邊形工具”選項(xiàng)，在圖像上單擊，確定第一個(gè)定位點(diǎn)。釋放鼠標(biāo)并將鼠標(biāo)指針移至下一個(gè)定位點(diǎn)，再單擊，用相同的方法直到勾畫(huà)出想要的圖像，并使選區(qū)形成一個(gè)封閉的狀態(tài)。雙擊，選區(qū)中的圖像被選中，如圖1-78所示。圖1-78

“任意變形”工具用于縮放、旋轉(zhuǎn)、傾斜、扭曲以及封套圖形，操作時(shí)單擊“任意變形工具”按鈕或者按Q鍵。

選擇“任意變形”工具，在圖形的周?chē)霈F(xiàn)控制點(diǎn)，拖動(dòng)控制點(diǎn)改變圖形的大小，如圖1-79所示。工具箱的下方提供了5種變形模式，如圖1-80所示。1.1.12“任意變形”工具圖1-79

圖1-801．移動(dòng)、旋轉(zhuǎn)與傾斜

移動(dòng)、旋轉(zhuǎn)與傾斜對(duì)圖形對(duì)象和元件都適用。

將鼠標(biāo)指針移動(dòng)到圖形的中心點(diǎn)，鼠標(biāo)指針右下角出現(xiàn)一個(gè)圓圈標(biāo)志，這時(shí)拖動(dòng)鼠標(biāo)可以將圖形移動(dòng)到任何位置，如圖1-81所示。圖1-81

將鼠標(biāo)指針移到變形框任一角的手柄上，鼠標(biāo)指針變成圓弧狀，按住鼠標(biāo)左鍵拖動(dòng)到合適位置，就實(shí)現(xiàn)了對(duì)圖形的旋轉(zhuǎn)，如圖1-82所示。圖1-82

將鼠標(biāo)指針移到變形框任一邊手柄外的地方，當(dāng)鼠標(biāo)指針變?yōu)閮蓚€(gè)平行反向的箭頭形狀時(shí)，拖動(dòng)鼠標(biāo)可以使對(duì)象傾斜，如圖1-83所示。圖1-832．縮放

縮放對(duì)圖形對(duì)象和元件都適用。將鼠標(biāo)指針移到任一手柄上，鼠標(biāo)指針變成雙向箭頭形狀，拖動(dòng)鼠標(biāo)可以放大或縮小對(duì)象，如圖1-84所示。圖1-843．扭曲和封套

扭曲和封套不能運(yùn)用于元件上，除非將元件打散。

選擇“扭曲”按鈕，選中對(duì)象，拖動(dòng)邊框上的角手柄或邊手柄，移動(dòng)該角或邊，如圖1-85所示。選擇“封套”按鈕，拖動(dòng)點(diǎn)和切線(xiàn)手柄修改封套，如圖1-86所示。圖1-85

圖1-86

使用“漸變變形”工具可以方便地對(duì)填充效果進(jìn)行旋轉(zhuǎn)、拉伸、傾斜、縮放等各種變換。（1）當(dāng)圖形填充為線(xiàn)性漸變時(shí)，選擇“漸變變形”工具，單擊圖形，出現(xiàn)3個(gè)控制點(diǎn)和2條平行線(xiàn)，如圖1-110所示。1.1.13“漸變變形”工具圖1-110（2）當(dāng)圖形填充為放射狀漸變時(shí)，選擇“漸變變形”工具，單擊圖形，出現(xiàn)4個(gè)控制點(diǎn)和一個(gè)圓形外框，如圖1-113所示。圖1-1131．“滴管”工具

“滴管”工具用于提取線(xiàn)條或填充的屬性，操作時(shí)單擊“滴管工具”按鈕或者按I鍵吸取填充色。（1）吸取填充色1.1.14“滴管”工具和“墨水瓶”工具圖1-128

圖1-129（2）吸取邊框?qū)傩?/p>

圖1-130

圖1-131（3）吸取位圖圖案圖1-132

圖1-133（4）吸取文字屬性圖1-134

圖1-135

圖1-1362．“墨水瓶”工具

“墨水瓶”工具用于描繪填充的邊緣或者改變線(xiàn)條的屬性，操作時(shí)單擊“墨水瓶工具”按鈕或者按S鍵。（1）使用“滴管”工具單擊要套用屬性的線(xiàn)條，如圖1-137所示。當(dāng)前的“屬性”面板顯示該線(xiàn)條的屬性，如圖1-138所示。此時(shí)，所選工具自動(dòng)變成“墨水瓶”工具，如圖1-139所示。圖1-137圖1-138

圖1-139（2）使用“墨水瓶”工具單擊其他屬性的線(xiàn)條，被單擊線(xiàn)條的屬性變成了當(dāng)前在“屬性”面板中所設(shè)置的屬性，如圖1-140所示。圖1-140

“橡皮擦”工具用于擦除不需要的圖形。雙擊“橡皮擦”工具，可以刪除“舞臺(tái)”上的所有內(nèi)容。選擇“橡皮擦”工具，在圖形上想要?jiǎng)h除的地方拖動(dòng)鼠標(biāo)，圖形被擦除?？梢栽诠ぞ呦湎路降摹跋鹌げ列螤睢卑粹o的下拉菜單中選擇橡皮擦的形狀與大小。工具箱的下方提供了5種擦除模式，如圖1-141所示。1.1.15“橡皮擦”工具

圖1-141◎標(biāo)準(zhǔn)擦除：拖動(dòng)鼠標(biāo)擦除同一層上的筆觸和填充色。橡皮的大小和形狀與“刷子”工具的設(shè)置相同?！虿脸钌褐徊脸畛渖挥绊懝P觸。◎擦除線(xiàn)條：只擦除筆觸，不影響填充?！虿脸x填充：只擦除當(dāng)前選定的填充，不影響筆觸，不管此時(shí)筆觸是否被選中。使用此模式之前都需先選擇要擦除的填充。◎內(nèi)部擦除：只擦除橡皮擦筆觸開(kāi)始處的填充。如果從空白點(diǎn)開(kāi)始擦除，則不會(huì)擦除任何內(nèi)容。以這種模式使用橡皮擦并不影響筆觸。

在“橡皮擦”工具的選項(xiàng)中選擇“水龍頭”，單擊需要擦除的填充區(qū)域或筆觸段，可以快速將其擦除。

5種擦除模式擦除圖形的效果如圖1-142所示。圖1-1421.1.163D工具

使用“3D平移”工具，可以在x、y和z軸上全方位地移動(dòng)對(duì)象；使用“3D旋轉(zhuǎn)”工具，可以在3D空間移動(dòng)對(duì)象。1.1.17“手形”工具和“縮放”工具

1．“手形”工具

如果圖形很大或被放大得很大，就需要使用“手形”工具調(diào)整觀(guān)察區(qū)域。選擇“手形”工具，鼠標(biāo)指針變?yōu)槭中危蟿?dòng)圖像到需要的位置。2．“縮放”工具

利用“縮放”工具放大圖形以便觀(guān)察細(xì)節(jié)，縮小圖形以便觀(guān)看整體效果。選擇“縮放”工具，在“舞臺(tái)”上單擊可放大圖形。要想放大圖像中的局部區(qū)域，可在圖像上拖曳出一個(gè)矩形選取框，松開(kāi)鼠標(biāo)后，所選取的局部圖像被放大。選中工具箱下方的“縮小”按鈕，在“舞臺(tái)”上單擊可縮小圖像。1.2.1案例效果分析

本案例設(shè)計(jì)的威力士潤(rùn)滑油企業(yè)商標(biāo)是通過(guò)5個(gè)“V”的變形來(lái)有機(jī)組合成的。“V”字母通常有勝利之意，商標(biāo)的整體像一個(gè)花卉。以綠色調(diào)為主凸顯綠色產(chǎn)品之含義，橙色的“V”字母進(jìn)行顏色和造型強(qiáng)調(diào)，寓意企業(yè)的創(chuàng)新精神，如圖1-161所示。1.2任務(wù)一——制作威力士石化商標(biāo)圖1-1611.2.2設(shè)計(jì)思路（1）用“直線(xiàn)”工具和“顏料桶”工具繪制商標(biāo)圖案。（2）用“文字”工具和“鋼筆”工具繪制商標(biāo)文字。1.2.3相關(guān)知識(shí)和技能點(diǎn)

利用“直線(xiàn)”工具、“鋼筆”工具和“部分選取”工具繪制圖形，利用“變形”面板對(duì)圖形進(jìn)行復(fù)制旋轉(zhuǎn)變形，利用“顏料桶”工具為圖形填充顏色，使用“漸變變形”工具調(diào)整漸變的位置和大小。（1）新建一個(gè)Animate文檔，并設(shè)置文檔屬性，如圖1-162所示。（2）選擇工具欄中的“直線(xiàn)”工具繪制出商標(biāo)的V字形部分，效果如圖1-163所示。使用“顏料桶”工具為其填充黃色，效果如圖1-164所示。（3）在黃色V字形旁邊繪制4個(gè)小三角形，效果如圖1-165所示。用“顏料桶”工具分別為其填充綠色和深綠色，效果如圖1-166所示。1.2.4任務(wù)實(shí)施圖1-162

圖1-163

圖1-164

圖1-165

圖1-166（4）刪除邊線(xiàn)，利用“選擇”工具選擇繪制的所有圖形，將它們組合在一起，把圖形的中心點(diǎn)放到尖角位置，如圖1-167所示。打開(kāi)“變形”面板，對(duì)其進(jìn)行旋轉(zhuǎn)復(fù)制，復(fù)制出3個(gè)實(shí)例，將它們組成商標(biāo)的下半部分，如圖1-168所示。

圖1-167圖1-168（5）選擇“直線(xiàn)”工具繪制商標(biāo)最上面的部分，用“顏料桶”工具為V字形下左右兩個(gè)三角形填充不同深度的黃色，用“顏料桶”工具為上方V字形填充橘紅到橘黃的線(xiàn)性漸變，并用“漸變變形”工具調(diào)整漸變的方向和位置，刪除邊線(xiàn)，效果如圖1-169所示。圖1-169（6）用“文本”工具輸入“威力士”文字，在“屬性”面板中調(diào)整其顏色為綠色，字體為華文細(xì)黑。調(diào)整合適的大小并放到合適的位置，最后將文字打散，效果如圖1-170所示。圖1-170（7）用“鋼筆”工具勾繪出英文字母輪廓，效果如圖1-171所示，并用“顏料桶”工具為其填充紅色，效果如圖1-172所示。圖1-171

圖1-172（8）利用“直線(xiàn)”工具繪制一個(gè)小菱形，然后用“部分選取”工具選中菱形的角點(diǎn)，按Alt鍵調(diào)整角點(diǎn)使其弧度，效果如圖1-173所示。用“文本”工具輸入R，顏色為粉紅色，放置在菱形中間，效果如圖1-174所示。

圖1-173

圖1-1741.3.1案例效果分析

本案例設(shè)計(jì)的是雅潔彩妝企業(yè)標(biāo)識(shí)，桃紅色的背景、扇形的標(biāo)識(shí)圖案和醒目的文本效果，體現(xiàn)出雅潔彩妝面向年輕女性的企業(yè)定位，如圖1-175所示。1.3任務(wù)二——制作企業(yè)標(biāo)識(shí)圖1-1751.3.2設(shè)計(jì)思路（1）用“直線(xiàn)”工具、“顏料桶”工具和“變形”面板繪制標(biāo)識(shí)圖案。（2）用“文字”工具和“鋼筆”工具繪制商標(biāo)文字。1.3.3相關(guān)知識(shí)和技能點(diǎn)

使用“線(xiàn)條”工具、“橢圓”工具繪制標(biāo)識(shí)圖案，使用“顏料桶”工具填充圖形，使用“選擇”工具選擇繪制圖形，利用“變形”面板復(fù)制并變形圖案，使用“文本”工具輸入并設(shè)置文本。（1）新建一個(gè)Animate文檔，設(shè)置寬和高分別為450像素和400像素，背景顏色為粉紅色（#FF6699），如圖1-176所示。1.3.4任務(wù)實(shí)施圖1-176（2）選擇“線(xiàn)條”工具，設(shè)置筆觸顏色為白色，筆觸高度為0.1，如圖1-177所示。在“舞臺(tái)”上繪制一個(gè)閉合的三角形，效果如圖1-178所示。

圖1-177

圖1-178（3）選擇“顏料桶”工具，設(shè)置填充顏色為白色，為三角形填充白色，如圖1-179所示。圖1-179（4）選擇“橢圓”工具，設(shè)置其起始角度和結(jié)束角度分別為90°和270°，按住Shift鍵在“舞臺(tái)”上繪制一個(gè)寬為42，高與三角形高相同的正圓，將左半圓放置在三角形的左側(cè)，效果如圖1-180所示。圖1-180（5）使用“選擇”工具選擇繪制好的三角形和半圓，將其組合。使用“任意變形”工具選擇組合好的對(duì)象，將變形控制中心移至變形框中的右下方角點(diǎn)，如圖1-181所示。

圖1-181（6）保持組合對(duì)象為選中狀態(tài)，在“變形”面板中，設(shè)置旋轉(zhuǎn)角度，然后5次單擊復(fù)制選區(qū)和“變形”按鈕，復(fù)制組合對(duì)象，效果如圖1-182所示。（7）選擇“橢圓”工具，設(shè)置開(kāi)始角度和結(jié)束角度為180°和0°，按住Shift鍵繪制寬為65的正圓，然后調(diào)整其位置，效果如圖1-183所示。圖1-182

圖1-183（8）選擇“文本”工具，設(shè)置字體為黑體，大小為75點(diǎn)，顏色為白色，在“舞臺(tái)”中輸入“雅潔彩妝”文本，效果如圖1-184所示。選擇文字，再執(zhí)行“文本”＞“樣式”＞“粗體”命令，使字體更加醒目，如圖1-185所示。圖1-184

圖1-185（9）選擇“文本”工具，在“舞臺(tái)”中輸入“YAJIECZ”，效果如圖1-186所示，完成商標(biāo)的制作。圖1-1861.4.1實(shí)訓(xùn)概述1．制作效果及設(shè)計(jì)理念

本實(shí)訓(xùn)制作效果如圖1-187所示。

將阿拉伯?dāng)?shù)字“2”變化成“人”，體現(xiàn)了第2屆校園文化節(jié)的人文色彩。在色彩上運(yùn)用紅色和黃色體現(xiàn)熱情奔放的特點(diǎn)，滲透著現(xiàn)代化氣息。閃動(dòng)的文字也體現(xiàn)了校園文化節(jié)的多姿多彩。1.4實(shí)訓(xùn)任務(wù)——制作校園文化節(jié)會(huì)徽?qǐng)D1-1872．動(dòng)畫(huà)設(shè)計(jì)

利用AnimateCC2019制作校園文化節(jié)會(huì)徽動(dòng)態(tài)效果，體現(xiàn)校園文化節(jié)的流動(dòng)旋律。3．素材收集與處理

收集標(biāo)志、VI設(shè)計(jì)圖片作為參考和設(shè)計(jì)資料。（1）使用“鋼筆”工具、“顏料桶”工具繪制并填充會(huì)徽輪廓。（2）使用“文本”工具、分離功能輸入并設(shè)置文本。（3）利用遮罩制作“第2屆校園文化節(jié)”動(dòng)畫(huà)。（4）利用傳統(tǒng)補(bǔ)間動(dòng)畫(huà)制作“平頂山工業(yè)職業(yè)技術(shù)學(xué)院”文字動(dòng)畫(huà)。1.4.2實(shí)訓(xùn)要點(diǎn)（1）新建一個(gè)Animate文檔，并設(shè)置名稱(chēng)為“校園文化節(jié)會(huì)徽”。使用“鋼筆”工具繪制會(huì)徽輪廓，效果如圖1-188所示。（2）使用“顏料桶”工具，設(shè)置紅到黃的漸變，如圖1-189所示。為輪廓填充相應(yīng)的顏色，效果如圖1-190所示。1.4.3實(shí)訓(xùn)步驟圖1-188

圖1-189（3）使用“選擇”工具選擇繪制的圖形，在“屬性”面板中將筆觸顏色設(shè)置為無(wú)，去除會(huì)徽輪廓，效果如圖1-191所示。（4）新建“文字”圖層，使用“文本”工具，在編輯區(qū)中的合適位置創(chuàng)建相應(yīng)的文本內(nèi)容，效果如圖1-192所示。圖1-191

圖1-192（5）選擇“平頂山工業(yè)職業(yè)技術(shù)學(xué)院”文字將其打散，選擇所有被打散的文字圖形，用右鍵單擊，在彈出的快捷菜單中選擇“分散到圖層”命令，效果如圖1-193所示。圖1-193（6）在“平”層的第1幀、第6幀插入關(guān)鍵幀，分別設(shè)置第1幀中的“Alpha”值為0，大小為200，如圖1-194所示。設(shè)第6幀的“中”的“Alpha”值為70，大小為150，如圖1-195所示。在該層的第1～3幀和第3～6幀創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫(huà)，如圖1-196所示。圖1-194

圖1-195

圖1-196（7）其他圖層每個(gè)向后退相應(yīng)的幀數(shù)，制作方法與“平”層一樣，如圖1-197所示。圖1-197（8）選擇圖形中的“第2屆校園文化節(jié)”字樣，將其轉(zhuǎn)化為圖形元件，效果如圖1-198所示。新建矩形元件，用“矩形”工具繪制幾個(gè)矩形，效果如圖1-199所示，再用“顏料桶”工具為矩形填充白色。圖1-198

圖1-199（9）新建“閃動(dòng)”影片剪輯，將“校園文化節(jié)”圖形元件拖入“圖層1”中，在其下層新建“矩形”圖層，將“矩形”元件拖入該圖層中，并將其旋轉(zhuǎn)一定角度，效果如圖1-200所示。復(fù)制“圖層1”，將其拖到“矩形”層下方。

圖1-200（10）在“矩形”層的第30幀插入關(guān)鍵幀，將“矩形”元件向后移動(dòng)一定距離，效果如圖1-201所示。在第1～30幀創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫(huà)，并將“圖層1”設(shè)為遮罩層，效果如圖1-202所示。圖1-201

圖1-202（11）返回場(chǎng)景1，選擇“文字”中的“校園文化節(jié)”圖形元件，用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“交換元件”命令，在彈出的“交換元件”對(duì)話(huà)框中選擇“閃動(dòng)”影片剪輯，效果如圖1-203所示。（若替換的元件位置不對(duì)，可以適當(dāng)調(diào)整其位置。）

圖1-203

（12）新建“腳本”層，在該層的第68幀插入空白關(guān)鍵幀，并添加停止腳本，效果如圖1-204所示。（13）在所有層的第68幀插入普通幀。（14）按Ctrl+Enter組合鍵測(cè)試影片，保存文檔。圖1-2041.5評(píng)價(jià)考核能力類(lèi)型考核內(nèi)容評(píng)價(jià)學(xué)習(xí)目標(biāo)評(píng)價(jià)項(xiàng)目321職業(yè)能力掌握繪制圖形、編輯圖形的方法和技能；掌握編輯和修飾對(duì)象的各種方法和技巧；掌握使用Animate設(shè)計(jì)VI的技能能夠選擇合適的Animate繪制模式

能夠使用工具箱中的各種工具

能夠使用“顏色”面板

能夠使用“變形”面板

能夠使用Animate設(shè)計(jì)VI

通用能力造型能力

審美能力

組織能力

解決問(wèn)題能力

自主學(xué)習(xí)能力

創(chuàng)新能力

綜合評(píng)價(jià)

項(xiàng)目一任務(wù)評(píng)價(jià)考核表1.6.1參考制作效果

參考效果如圖1-205所示。1.6課外拓展——制作飲料廣告標(biāo)牌圖1-2051.6.2知識(shí)要點(diǎn)（1）元件的使用。（2）應(yīng)用傳統(tǒng)補(bǔ)間動(dòng)畫(huà)制作圖片逐漸出現(xiàn)和消失的動(dòng)畫(huà)。1.6.3參考制作過(guò)程Animate動(dòng)畫(huà)設(shè)計(jì)與制作實(shí)例教程

（AnimateCC2019）

項(xiàng)目二

制作電子賀卡項(xiàng)目簡(jiǎn)介

電子賀卡是人們通過(guò)網(wǎng)絡(luò)傳遞信息和交流情感的一種媒介。要想制作出生動(dòng)的邀請(qǐng)卡、生日賀卡、友情賀卡、春節(jié)賀卡等電子賀卡，就必須掌握Animate動(dòng)畫(huà)的制作方法。

本項(xiàng)目主要介紹Animate動(dòng)畫(huà)的制作原理、方法和技巧，以及制作電子賀卡的方法。通過(guò)本項(xiàng)目的學(xué)習(xí)，讀者可以掌握利用AnimateCC2019制作各類(lèi)電子賀卡的方法與技巧。學(xué)習(xí)目標(biāo)掌握創(chuàng)建逐幀動(dòng)畫(huà)、動(dòng)作補(bǔ)間動(dòng)畫(huà)、形狀補(bǔ)間動(dòng)畫(huà)、引導(dǎo)路徑動(dòng)畫(huà)、傳統(tǒng)補(bǔ)間動(dòng)畫(huà)、遮罩動(dòng)畫(huà)的方法；掌握春節(jié)賀卡、端午節(jié)賀卡、生日賀卡、友情賀卡的制作方法。

幀是構(gòu)成動(dòng)畫(huà)的最基本元素之一，在Animate中根據(jù)幀的不同功能，可以將幀分為普通幀、空白關(guān)鍵幀和關(guān)鍵幀3種。1．普通幀

普通幀在時(shí)間軸中以黑灰色方塊表示，常常處于關(guān)鍵幀的后面，作為關(guān)鍵幀之間的過(guò)渡，用于延長(zhǎng)關(guān)鍵幀中動(dòng)畫(huà)的播放時(shí)間。是由系統(tǒng)經(jīng)過(guò)計(jì)算自動(dòng)生成的，用戶(hù)無(wú)法直接對(duì)普通幀上的對(duì)象進(jìn)行編輯。2.1知識(shí)準(zhǔn)備——Animate動(dòng)畫(huà)2．空白關(guān)鍵幀

空白關(guān)鍵幀在時(shí)間軸中以空心的小圓表示，這種關(guān)鍵幀中沒(méi)有任何的內(nèi)容，主要用于結(jié)束前一個(gè)關(guān)鍵幀的內(nèi)容或分割兩個(gè)相連的補(bǔ)間動(dòng)畫(huà)。3．關(guān)鍵幀

關(guān)鍵幀在時(shí)間軸中以黑色的實(shí)心小圓表示，主要用于定義動(dòng)畫(huà)中表現(xiàn)關(guān)鍵性動(dòng)作或關(guān)鍵性?xún)?nèi)容變化的幀，一般的動(dòng)畫(huà)元素都必須在關(guān)鍵幀中編輯。根據(jù)創(chuàng)建動(dòng)畫(huà)的不同，關(guān)鍵幀在時(shí)間軸中的顯示效果也不相同。4．動(dòng)作腳本

幀單元格中有一個(gè)字母“a”，它表示在這一幀中帶有動(dòng)作腳本，如圖2-1所示，動(dòng)畫(huà)播放到這一幀時(shí)，就會(huì)執(zhí)行相應(yīng)的動(dòng)作。5．聲音

若單元格中有像電波一樣的波形圖像，表示加載了聲音，如圖2-2所示，波形的振幅表示音量的大小。圖2-1

圖2-26．標(biāo)簽

幀標(biāo)簽有3種，分別是“名稱(chēng)”“注釋”和“錨記”標(biāo)簽，它們的外觀(guān)如圖2-3所示。圖2-37．幀的相關(guān)操作（1）選擇幀：在“時(shí)間軸”面板中，單擊一個(gè)幀，可以看到它變成藍(lán)色，表示已經(jīng)把它選中；選擇一幀后，按住Shift鍵的同時(shí)單擊需要選擇的連續(xù)幀的最后一幀，即可選擇兩幀之間所有的幀；選擇一幀后按住Ctrl鍵的同時(shí)單擊其他需要選擇的幀，即可選擇不連續(xù)的多個(gè)幀。（2）移動(dòng)幀：如果按住選中的幀進(jìn)行拖動(dòng)，那么可以改變這個(gè)幀的位置。（3）使用右鍵菜單：用鼠標(biāo)右鍵單擊選中的幀，在彈出的快捷菜單中可選擇幀的相應(yīng)操作命令，如圖2-4所示。

圖2-4（4）使用命令菜單：執(zhí)行“編輯”>“時(shí)間軸”、“插入”>“時(shí)間軸”或者“修改”>

“時(shí)間軸”命令，可以選取與幀操作相關(guān)的命令。（5）設(shè)置幀頻：幀頻（FPS）是動(dòng)畫(huà)播放的速度，以每秒播放的幀數(shù)為度量。例如，某個(gè)影片在播放時(shí)，每秒播放15幀，那么幀頻就是“15幀每秒”，幀頻太小會(huì)使動(dòng)畫(huà)看起來(lái)一頓一頓的，幀頻太大會(huì)使動(dòng)畫(huà)的細(xì)節(jié)變模糊，一般可以將幀頻設(shè)置為12～30幀每秒。1．逐幀動(dòng)畫(huà)的制作

將動(dòng)畫(huà)中的每一幀都設(shè)置為關(guān)鍵幀，在每一個(gè)關(guān)鍵幀中創(chuàng)建不同的內(nèi)容，該動(dòng)畫(huà)就稱(chēng)為逐幀動(dòng)畫(huà)。將這些靜態(tài)圖片快速連續(xù)播放形成動(dòng)畫(huà)，可以靈活地表現(xiàn)豐富多變的動(dòng)畫(huà)效果，最適于圖像在每一幀中都需要發(fā)生變化的復(fù)雜動(dòng)畫(huà)。2.1.1逐幀動(dòng)畫(huà)2．運(yùn)用繪圖紙功能編輯圖形

使用“時(shí)間軸”面板中提供的繪圖紙功能，可以在編輯動(dòng)畫(huà)的同時(shí)查看多個(gè)幀中的動(dòng)畫(huà)內(nèi)容。圖2-9所示是使用繪圖紙功能后的時(shí)間軸。在制作逐幀動(dòng)畫(huà)時(shí)，利用該功能可以對(duì)各關(guān)鍵幀中圖形的大小和位置進(jìn)行更好的定位，并可參考相仿關(guān)鍵幀中的圖形，對(duì)當(dāng)前幀中的圖形進(jìn)行修改和調(diào)整。圖2-9

繪圖紙相關(guān)按鈕的功能如下?！袄L圖紙外觀(guān)”按鈕：?jiǎn)螕舸税粹o后，在時(shí)間軸的上方出現(xiàn)繪圖紙外觀(guān)標(biāo)記。拉動(dòng)外觀(guān)標(biāo)記的兩端，可以擴(kuò)大或縮小顯示范圍?！袄L圖紙外觀(guān)輪廓”按鈕：?jiǎn)螕舸税粹o后，場(chǎng)景中顯示各幀內(nèi)容的輪廓線(xiàn)，填充色消失，特別適合觀(guān)察對(duì)象輪廓，另外可以節(jié)省系統(tǒng)資源，加快顯示過(guò)程?！熬庉嫸鄠€(gè)幀”按鈕：?jiǎn)螕舸税粹o后可以顯示全部幀內(nèi)容，并且可以進(jìn)行“多幀同時(shí)編輯”?！靶薷臉?biāo)記”按鈕：?jiǎn)螕舸税粹o后，彈出下拉菜單，如圖2-10所示。

圖2-10“始終顯示標(biāo)記”選項(xiàng)：用于在時(shí)間軸標(biāo)題中顯示繪圖紙外觀(guān)標(biāo)記，無(wú)論繪圖紙外觀(guān)是否打開(kāi)?！板^定標(biāo)記”選項(xiàng)：用于將繪圖紙外觀(guān)標(biāo)記鎖定在它們?cè)跁r(shí)間軸標(biāo)題中的當(dāng)前位置上。通常情況下，繪圖紙外觀(guān)范圍是和當(dāng)前幀的指針及繪圖紙外觀(guān)標(biāo)記相關(guān)的。通過(guò)錨定繪圖紙外觀(guān)標(biāo)記，可以防止它們隨當(dāng)前幀的指針移動(dòng)?！皹?biāo)記范圍2”選項(xiàng)：用于在當(dāng)前幀的兩邊顯示兩幀。“標(biāo)記范圍5”選項(xiàng)：用于在當(dāng)前幀的兩邊顯示5幀。“標(biāo)記所有范圍”選項(xiàng)：用于在當(dāng)前幀的兩邊顯示全部幀。

在關(guān)鍵幀中放置一個(gè)元件，然后在另一個(gè)關(guān)鍵幀中改變這個(gè)元件的大小、顏色、位置、透明度等，Animate根據(jù)二者之間的幀的值創(chuàng)建的動(dòng)畫(huà)被稱(chēng)為動(dòng)作補(bǔ)間動(dòng)畫(huà)。

構(gòu)成動(dòng)作補(bǔ)間動(dòng)畫(huà)的元素是元件，包括影片剪輯、圖形、按鈕、文字、位圖、組合等。只有把形狀或者組合轉(zhuǎn)換成“元件”后，才可以制作“動(dòng)作補(bǔ)間動(dòng)畫(huà)”。如果創(chuàng)建動(dòng)作補(bǔ)間動(dòng)畫(huà)后，又改變了兩個(gè)關(guān)鍵幀之間的幀數(shù)，或者在某個(gè)關(guān)鍵幀中移動(dòng)了群組或?qū)嵗?，則Animate將自動(dòng)重新生成兩個(gè)關(guān)鍵幀之間的過(guò)渡幀。2.1.2動(dòng)作補(bǔ)間動(dòng)畫(huà)1．創(chuàng)建動(dòng)作補(bǔ)間動(dòng)畫(huà)的兩種方法（1）選擇圖層的第1幀，用鼠標(biāo)右鍵單擊該幀，在彈出的快捷菜單中選擇“創(chuàng)建補(bǔ)間動(dòng)畫(huà)”命令即可創(chuàng)建動(dòng)作補(bǔ)間動(dòng)畫(huà)，如圖2-14所示。（2）選擇要?jiǎng)?chuàng)建動(dòng)畫(huà)的第1個(gè)關(guān)鍵幀，執(zhí)行“插入”＞“補(bǔ)間動(dòng)畫(huà)”命令，如圖2-15所示，Animate將自動(dòng)創(chuàng)建動(dòng)作補(bǔ)間動(dòng)畫(huà)。圖2-14

圖2-15

然后在結(jié)束幀的位置用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”＞“位置”等選項(xiàng)后，設(shè)置結(jié)束幀，即可完成動(dòng)作補(bǔ)間動(dòng)畫(huà)的創(chuàng)建。動(dòng)作補(bǔ)間動(dòng)畫(huà)創(chuàng)建后，“時(shí)間軸”面板的背景色變?yōu)辄S色，如圖2-16所示。

圖2-162．動(dòng)作補(bǔ)間動(dòng)畫(huà)參數(shù)設(shè)置（1）緩動(dòng)：設(shè)置物體的加速減速運(yùn)動(dòng)?！驍?shù)值范圍為－100～1，速度由慢到快，朝運(yùn)動(dòng)結(jié)束的方向加速度補(bǔ)間。◎數(shù)值范圍為1～100，速度由快到慢，朝運(yùn)動(dòng)結(jié)束的方向減慢補(bǔ)間。默認(rèn)情況下，補(bǔ)間幀之間的變化速率是不變的。（2）旋轉(zhuǎn)：讓物體旋轉(zhuǎn)，有無(wú)、順時(shí)針、逆時(shí)針3種旋轉(zhuǎn)方式?！蝽槙r(shí)針：順時(shí)針旋轉(zhuǎn)相應(yīng)的圈數(shù)?！蚰鏁r(shí)針：逆時(shí)針旋轉(zhuǎn)相應(yīng)的圈數(shù)。圈數(shù)在“X”后面的數(shù)值框中輸入即可。（3）調(diào)整到路徑：此功能主要用于引導(dǎo)層動(dòng)畫(huà)中，可將物體調(diào)整到引導(dǎo)路徑上。3．編輯動(dòng)作補(bǔ)間動(dòng)畫(huà)

以下的動(dòng)畫(huà)效果經(jīng)常需要使用動(dòng)畫(huà)編輯器來(lái)實(shí)現(xiàn)。（1）添加不同的緩動(dòng)預(yù)設(shè)或自定義緩動(dòng)：使用動(dòng)畫(huà)編輯器可以添加不同預(yù)設(shè)、添加多個(gè)預(yù)設(shè)或創(chuàng)建自定義緩動(dòng)。對(duì)補(bǔ)間屬性添加緩動(dòng)是模擬對(duì)象真實(shí)行為的最簡(jiǎn)便方式。（2）合成曲線(xiàn)：可以對(duì)單個(gè)屬性應(yīng)用緩動(dòng)，然后使用合成曲線(xiàn)在單個(gè)屬性圖上查看緩動(dòng)的效果。（3）錨點(diǎn)和控制點(diǎn)：可以使用錨點(diǎn)和控制點(diǎn)隔離補(bǔ)間的關(guān)鍵部分并進(jìn)行編輯。（4）動(dòng)畫(huà)的精細(xì)調(diào)整：動(dòng)畫(huà)編輯器是制作某些種類(lèi)動(dòng)畫(huà)的唯一方式，如對(duì)單個(gè)屬性通過(guò)調(diào)整其屬性曲線(xiàn)來(lái)創(chuàng)建彎曲的路徑補(bǔ)間。

在時(shí)間軸上，選擇要調(diào)整的補(bǔ)間動(dòng)畫(huà)，然后雙擊該補(bǔ)間范圍；也可以用鼠標(biāo)右鍵單擊該補(bǔ)間范圍，然后在彈出的快捷菜單中選擇“調(diào)整補(bǔ)間”命令來(lái)調(diào)出動(dòng)畫(huà)編輯器，如圖2-21所示。圖2-21

可補(bǔ)間的對(duì)象的屬性如下。（1）2D下的X和Y位置屬性。（2）3D下的Z位置屬性（僅限影片剪輯）。（3）2D下的旋轉(zhuǎn)（圍繞z軸）屬性。（4）3D下的X、Y和Z旋轉(zhuǎn)（僅限影片剪輯）屬性。（5）3D動(dòng)畫(huà)要求FLA文件在發(fā)布設(shè)置中面向ActionScript3.0和FlashPlayer10或更高版本。AdobeAIR還支持3D動(dòng)畫(huà)。（6）傾斜的X和Y屬性。（7）縮放的X和Y屬性。（8）顏色效果屬性。（9）色彩效果包括alpha（透明）、亮度、色調(diào)和高級(jí)顏色設(shè)置。（10）濾鏡屬性。不能將濾鏡應(yīng)用于圖形元件。1．創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫(huà)

在傳統(tǒng)補(bǔ)間動(dòng)畫(huà)中，可在動(dòng)畫(huà)的重要位置定義關(guān)鍵幀，AnimateCC2019會(huì)自動(dòng)在關(guān)鍵幀之間創(chuàng)建內(nèi)容。

首先，在同一圖層中創(chuàng)建兩個(gè)關(guān)鍵幀。然后用鼠標(biāo)右鍵單擊兩個(gè)關(guān)鍵幀之間的任一普通幀，執(zhí)行“創(chuàng)建傳統(tǒng)補(bǔ)間”命令，即可為這兩個(gè)關(guān)鍵幀建立傳統(tǒng)補(bǔ)間關(guān)系。兩個(gè)關(guān)鍵幀之間的插補(bǔ)幀會(huì)顯示一個(gè)箭頭。2.1.3傳統(tǒng)補(bǔ)間動(dòng)畫(huà)2．編輯傳統(tǒng)補(bǔ)間動(dòng)畫(huà)（1）緩動(dòng)

傳統(tǒng)補(bǔ)間可以使用一組常用的緩動(dòng)預(yù)設(shè)?？梢詮木弰?dòng)預(yù)設(shè)列表中選擇預(yù)設(shè)，然后將其應(yīng)用于選定屬性。

在Animate時(shí)間軸中單擊包含補(bǔ)間的圖層，單擊“屬性”面板中的“補(bǔ)間”類(lèi)別。可以使用“緩動(dòng)”下拉列表去設(shè)置緩動(dòng)類(lèi)型，如圖2-22所示。圖2-22

可以對(duì)傳統(tǒng)補(bǔ)間應(yīng)用緩動(dòng)預(yù)設(shè)屬性。在“屬性”面板中，提供了用于設(shè)置緩動(dòng)屬性的選項(xiàng)。可以選擇“單獨(dú)每個(gè)屬性”以對(duì)每個(gè)屬性應(yīng)用不同的緩動(dòng)預(yù)設(shè)。如圖2-23所示。圖2-23（2）旋轉(zhuǎn)

除了設(shè)置元件的緩動(dòng)外，Animate還支持設(shè)置元件的旋轉(zhuǎn)。在“屬性”面板的“補(bǔ)間”選項(xiàng)卡的“旋轉(zhuǎn)”下拉列表中有4種旋轉(zhuǎn)方式。

在一個(gè)關(guān)鍵幀中繪制一個(gè)形狀，然后在另一個(gè)關(guān)鍵幀中更改該形狀或繪制另一個(gè)形狀，Animate根據(jù)二者之間的幀的值或形狀來(lái)創(chuàng)建的動(dòng)畫(huà)稱(chēng)為“形狀補(bǔ)間動(dòng)畫(huà)”。

形狀補(bǔ)間動(dòng)畫(huà)可以實(shí)現(xiàn)兩個(gè)圖形之間顏色、形狀、大小、位置的相互變化，其使用的元素多為繪制出來(lái)的“形狀”，如果使用圖形元件、按鈕、文字，則必先“打散”，將其轉(zhuǎn)換為“形狀”才能創(chuàng)建形狀補(bǔ)間動(dòng)畫(huà)。2.1.4形狀補(bǔ)間動(dòng)畫(huà)1．創(chuàng)建形狀補(bǔ)間動(dòng)畫(huà)（1）在“時(shí)間軸”面板上動(dòng)畫(huà)開(kāi)始播放的地方繪制動(dòng)畫(huà)的初始形狀，在動(dòng)畫(huà)結(jié)束處插入空白關(guān)鍵幀，繪制動(dòng)畫(huà)的結(jié)束圖形。（2）用鼠標(biāo)右鍵單擊開(kāi)始幀或者用鼠標(biāo)右鍵單擊兩個(gè)關(guān)鍵幀之間的任意幀，在彈出的快捷菜單中選擇“創(chuàng)建補(bǔ)間形狀”命令，這樣便在這兩個(gè)關(guān)鍵幀之間創(chuàng)建了形狀補(bǔ)間動(dòng)畫(huà)，如圖2-35所示。圖2-352．形狀補(bǔ)間動(dòng)畫(huà)“屬性”面板參數(shù)設(shè)置（1）“緩動(dòng)”選項(xiàng)

設(shè)置物體的加速減速運(yùn)動(dòng)，與傳統(tǒng)補(bǔ)間動(dòng)畫(huà)參數(shù)相同。（2）“混合”選項(xiàng)◎“角形”選項(xiàng)：創(chuàng)建的動(dòng)畫(huà)中間形狀會(huì)保留明顯的角和直線(xiàn)，適合于具有銳化轉(zhuǎn)角和直線(xiàn)的混合形狀?！颉胺植际健边x項(xiàng)：創(chuàng)建的動(dòng)畫(huà)中間形狀比較平滑和不規(guī)則，形狀變化得更加自然。3．使用形狀提示（1）單擊開(kāi)始關(guān)鍵幀，執(zhí)行“修改”>“形狀”>“添加形狀提示”命令，該幀的形狀中會(huì)增加一個(gè)帶字母的紅色圓圈（一般第一個(gè)提示是字母“a”），在結(jié)束幀形狀中也會(huì)相應(yīng)地出現(xiàn)一個(gè)一模一樣的紅色圓圈。（2）在不同的關(guān)鍵幀中單擊，并分別將這2個(gè)“提示圓圈”拖放到適當(dāng)?shù)奈恢?，如果使用形狀提示成功后，開(kāi)始幀上的“提示圓圈”就變?yōu)辄S色，結(jié)束幀上的“提示圓圈”會(huì)變?yōu)榫G色。安放不成功或者它們不在一條曲線(xiàn)上時(shí)，“提示圓圈”顏色保持不變。（3）刪除所有的形狀提示，可執(zhí)行“修改”>“形狀”>“刪除所有提示”命令，刪除單個(gè)形狀提示，可用鼠標(biāo)右鍵單擊它，在彈出的快捷菜單中選擇“刪除提示”命令。4．使用可變寬度向筆觸添加形狀補(bǔ)間動(dòng)畫(huà)

在AnimateCC2019中可以給可變寬度的筆觸添加形狀補(bǔ)間動(dòng)畫(huà)，也可以對(duì)可變寬度配置文件的筆觸添加形狀補(bǔ)間動(dòng)畫(huà)。

引導(dǎo)路徑動(dòng)畫(huà)是指創(chuàng)建一條路徑，引導(dǎo)動(dòng)畫(huà)對(duì)象按照一定的路徑運(yùn)動(dòng)。1．引導(dǎo)方式

引導(dǎo)方式可分為兩種，即普通引導(dǎo)和傳統(tǒng)運(yùn)動(dòng)引導(dǎo)。（1）普通引導(dǎo)方式

在制作動(dòng)畫(huà)過(guò)程中，為了在繪制時(shí)幫助對(duì)齊對(duì)象，可創(chuàng)建引導(dǎo)層。在“時(shí)間軸”面板中，普通引導(dǎo)方式所在的引導(dǎo)層，通常以“尺子”為標(biāo)記。該圖層主要用于輔助靜態(tài)對(duì)象定位，不會(huì)導(dǎo)出，不會(huì)顯示在發(fā)布的SWF文件中。2.1.5引導(dǎo)路徑動(dòng)畫(huà)

在“時(shí)間軸”面板中，選中圖層，然后用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“引導(dǎo)層”命令，即將該圖層轉(zhuǎn)化為引導(dǎo)圖層。創(chuàng)建引導(dǎo)層后，即可在引導(dǎo)圖層中繪制引導(dǎo)路徑。在插入的新圖層中，可以使用引導(dǎo)路徑為其他圖層中的對(duì)象定位。創(chuàng)建了引導(dǎo)圖層的“時(shí)間軸”面板如圖2-50所示。（2）傳統(tǒng)運(yùn)動(dòng)引導(dǎo)方式

在“時(shí)間軸”面板中，選中圖層，然后用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“添加傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層”命令，即將該圖層轉(zhuǎn)化為傳統(tǒng)運(yùn)動(dòng)引導(dǎo)圖層。在傳統(tǒng)運(yùn)動(dòng)引導(dǎo)圖層所引導(dǎo)的圖層中，可將補(bǔ)間動(dòng)畫(huà)關(guān)鍵幀中的元件與引導(dǎo)路徑的兩個(gè)端點(diǎn)綁定。運(yùn)動(dòng)對(duì)象將按照引導(dǎo)路徑的軌跡移動(dòng)。創(chuàng)建了傳統(tǒng)運(yùn)動(dòng)引導(dǎo)圖層的“時(shí)間軸”面板如圖2-51所示。圖2-50

圖2-512．創(chuàng)建引導(dǎo)路徑動(dòng)畫(huà)的方法（1）一個(gè)最基本的引導(dǎo)路徑動(dòng)畫(huà)由兩個(gè)圖層組成，上面一層是“引導(dǎo)層”，下面一層是“被引導(dǎo)層”。（2）引導(dǎo)路徑動(dòng)畫(huà)最基本的操作就是使一個(gè)運(yùn)動(dòng)動(dòng)畫(huà)“附著”在“引導(dǎo)路徑”上，所以操作時(shí)要特別注意引導(dǎo)路徑的兩端，被引導(dǎo)的對(duì)象起始、終點(diǎn)的2個(gè)“中心點(diǎn)”一定要對(duì)準(zhǔn)引導(dǎo)路徑的2個(gè)端點(diǎn)。3．將圖層與傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層鏈接起來(lái)

如需要把其他圖層也放置到當(dāng)前傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層的路徑上來(lái)，被其引導(dǎo)，就將現(xiàn)有圖層拖到傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層的下面，該圖層在傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層下面以縮進(jìn)形式顯示，該圖層上的所有對(duì)象自動(dòng)與傳統(tǒng)運(yùn)動(dòng)路徑對(duì)齊。4．?dāng)嚅_(kāi)圖層與傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層的鏈接

斷開(kāi)被引導(dǎo)層與引導(dǎo)層的引導(dǎo)關(guān)系，有以下兩種方法。（1）拖動(dòng)該圖層到傳統(tǒng)運(yùn)動(dòng)引導(dǎo)層的上面。（2）執(zhí)行“修改”>“時(shí)間軸”>“圖層屬性”命令，然后選擇圖層類(lèi)型為“一般”。

Aniamte中的遮罩可分為靜態(tài)遮罩和動(dòng)畫(huà)遮罩兩種。（1）靜態(tài)遮罩用于控制圖層的顯示區(qū)域。遮罩層一般是由普通層轉(zhuǎn)換而來(lái)的。（2）動(dòng)畫(huà)遮罩即在動(dòng)畫(huà)中的遮罩層，其既可以是在遮罩層制作的動(dòng)畫(huà)，又可以是在被遮罩層制作的動(dòng)畫(huà)。2.1.6遮罩動(dòng)畫(huà)1．創(chuàng)建遮罩

在“時(shí)間軸”面板中用鼠標(biāo)右鍵單擊創(chuàng)建的遮罩層，從彈出的快捷菜單中選擇“遮罩層”命令，如圖2-66所示。該層將轉(zhuǎn)換為遮罩層，用一個(gè)遮罩層圖標(biāo)來(lái)表示，如圖2-67所示。圖2-66

圖2-672．添加多個(gè)被遮罩層

要添加多個(gè)被遮罩層可以進(jìn)行以下3種操作。（1）將現(xiàn)有的圖層直接拖到遮罩層的下面，如圖2-68所示。（2）在遮罩層下面的任何地方創(chuàng)建一個(gè)新圖層。（3）執(zhí)行“修改”>“時(shí)間軸”>“圖層屬性”命令，然后選擇“被遮罩”選項(xiàng)。圖2-683．?dāng)嚅_(kāi)遮罩

要斷開(kāi)遮罩可以進(jìn)行以下兩種操作。（1）將圖層拖到遮罩層的上面。（2）執(zhí)行“修改”>“時(shí)間軸”>“圖層屬性”命令，然后選擇圖層類(lèi)型為“一般”，如圖2-69所示。圖2-69

動(dòng)畫(huà)預(yù)設(shè)是Animate預(yù)先配置的運(yùn)動(dòng)補(bǔ)間動(dòng)畫(huà)，可以將它們應(yīng)用于舞臺(tái)上的對(duì)象。用戶(hù)可以創(chuàng)建并保存自己的自定義預(yù)設(shè)，可以使用修改過(guò)的現(xiàn)有動(dòng)畫(huà)預(yù)設(shè)，也可以使用自己創(chuàng)建的自定義補(bǔ)間。使用預(yù)設(shè)可極大節(jié)約項(xiàng)目的制作時(shí)間，提高動(dòng)畫(huà)設(shè)計(jì)制作效率。2.1.7動(dòng)畫(huà)預(yù)設(shè)1．動(dòng)畫(huà)預(yù)設(shè)

動(dòng)畫(huà)預(yù)設(shè)可應(yīng)用于各種文本字段、影片剪輯元件和按鈕元件。在為元件應(yīng)用動(dòng)畫(huà)預(yù)設(shè)之前，需要先執(zhí)行“窗口”>“動(dòng)畫(huà)預(yù)設(shè)”命令，打開(kāi)“動(dòng)畫(huà)預(yù)設(shè)”面板，如圖2-88所示。

“動(dòng)畫(huà)預(yù)設(shè)”面板包括“預(yù)設(shè)瀏覽”“預(yù)設(shè)列表”等區(qū)域以及下方的一些按鈕等。在工作區(qū)中選擇要添加的動(dòng)畫(huà)預(yù)設(shè)的元件和文本后，即可在“動(dòng)畫(huà)預(yù)設(shè)”面板中選擇相應(yīng)的預(yù)設(shè)項(xiàng)目，查看“預(yù)設(shè)瀏覽”，如圖2-89所示。圖2-88

圖2-892．自定義動(dòng)畫(huà)預(yù)設(shè)

用戶(hù)可以自定義動(dòng)畫(huà)預(yù)設(shè)。

在保存動(dòng)畫(huà)預(yù)設(shè)時(shí)，打開(kāi)“將預(yù)設(shè)另存為”對(duì)話(huà)框，可在該對(duì)話(huà)框中設(shè)置這些自定義動(dòng)畫(huà)預(yù)設(shè)的名稱(chēng)。圖2-90所示的abc即為預(yù)設(shè)動(dòng)畫(huà)。

用戶(hù)自定義的預(yù)設(shè)是沒(méi)有預(yù)設(shè)預(yù)覽的。在“動(dòng)畫(huà)預(yù)設(shè)”面板中單擊“刪除項(xiàng)目”按鈕，可將已添加的動(dòng)畫(huà)預(yù)設(shè)從列表中刪除。圖2-902.2.1案例效果分析

本設(shè)計(jì)作品以紅色為主色調(diào)，配上春節(jié)的代表物燈籠和金牛，鼠標(biāo)滑過(guò)金牛時(shí)呈現(xiàn)“牛年行大運(yùn)”圖片，4個(gè)福字轉(zhuǎn)動(dòng)出拜年的“吉祥語(yǔ)”，突出體現(xiàn)了春節(jié)熱鬧嘉慶的氣氛，如圖2-91所示。2.2任務(wù)一——制作春節(jié)賀卡圖2-912.2.2設(shè)計(jì)思路（1）制作影片剪輯元件“福字動(dòng)”和“金牛微動(dòng)”。（2）制作4個(gè)“福字”按鈕和“金?！卑粹o。（3）制作燈籠和影片剪輯元件“穂動(dòng)”。（4）制作底圖和祥云效果。2.2.3相關(guān)知識(shí)點(diǎn)和技能點(diǎn)

“變形”面板的使用，在制作圖形元件時(shí)綜合使用各種繪圖工具；影片剪輯元件、按鈕、傳統(tǒng)補(bǔ)間動(dòng)畫(huà)的制作。2.3.1案例效果分析

本案例設(shè)計(jì)的端午節(jié)賀卡，畫(huà)面以綠色為主，將翠竹、粽葉和粽子等端午節(jié)特有的元素應(yīng)用到動(dòng)畫(huà)中。整個(gè)動(dòng)畫(huà)輕柔、流暢，配上好聽(tīng)的音樂(lè)，給人一種美的享受，效果如圖2-113所示。2.3任務(wù)二——制作端午節(jié)賀卡圖2-1132.3.2設(shè)計(jì)思路（1）制作背景、邊框、圖框。（2）制作翠竹、漣漪、星星。（3）制作粽子的傳統(tǒng)補(bǔ)間動(dòng)畫(huà)。（4）制作文本動(dòng)畫(huà)。（5）插入背景音樂(lè)。（6）添加腳本。2.3.3相關(guān)知識(shí)和技能點(diǎn)

使用形狀補(bǔ)間動(dòng)畫(huà)制作畫(huà)面過(guò)渡效果，使用動(dòng)作補(bǔ)間動(dòng)畫(huà)創(chuàng)建文本動(dòng)畫(huà)，以及圖層的操作。2.4.1實(shí)訓(xùn)概述1．動(dòng)畫(huà)的制作目的與設(shè)計(jì)理念

本實(shí)訓(xùn)的目的是掌握文本內(nèi)容的輸入、按鈕元件的創(chuàng)建、引導(dǎo)層動(dòng)畫(huà)的創(chuàng)建、應(yīng)用遮罩動(dòng)畫(huà)、使用圖層文件夾功能的方法，以及熟悉電子賀卡的制作流程。

本實(shí)訓(xùn)制作的友情賀卡主要通過(guò)四葉草來(lái)傳達(dá)友情的內(nèi)涵，再配以音樂(lè)烘托主題，效果如圖2-126所示。2.4實(shí)訓(xùn)任務(wù)——制作友情賀卡圖2-1262．動(dòng)畫(huà)整體風(fēng)格設(shè)計(jì)

動(dòng)畫(huà)主體風(fēng)格舒緩柔美，伴隨著輕柔的音樂(lè)，一句句表達(dá)友情的話(huà)語(yǔ)帶給人們對(duì)友情的美好向往。3．素材收集與處理

收集四葉草植物、動(dòng)態(tài)植物組合、動(dòng)態(tài)氣泡、半透明漸變圓（自己制作）、小房子、背景圖片、音樂(lè)等素材。（1）背景的設(shè)定，通過(guò)靜的背景和動(dòng)的四葉草植物組合，以及一些動(dòng)的裝飾元件（如動(dòng)態(tài)氣泡、漸變半圓、動(dòng)態(tài)星星）的添加，使背景更有生氣，友情賀卡的內(nèi)容更豐富。（2）祝福語(yǔ)文本動(dòng)畫(huà)的設(shè)定。主要通過(guò)四葉草引出文本，文本逐漸出現(xiàn)。（3）按鈕、音樂(lè)的添加。2.4.2實(shí)訓(xùn)要點(diǎn)2.5評(píng)價(jià)考核能力類(lèi)型考核內(nèi)容評(píng)價(jià)學(xué)習(xí)目標(biāo)評(píng)價(jià)項(xiàng)目321職業(yè)能力掌握逐幀動(dòng)畫(huà)、動(dòng)作補(bǔ)間動(dòng)畫(huà)、傳統(tǒng)補(bǔ)間動(dòng)畫(huà)引導(dǎo)路徑動(dòng)畫(huà)和遮罩動(dòng)畫(huà)的制作方法和技巧；會(huì)使用形狀提示制作形狀補(bǔ)間動(dòng)畫(huà)；會(huì)運(yùn)用繪圖紙功能編輯圖形；會(huì)使用Animate制作電子動(dòng)畫(huà)賀卡能夠制作逐幀動(dòng)畫(huà)

能夠制作動(dòng)作補(bǔ)間動(dòng)畫(huà)及傳統(tǒng)補(bǔ)間動(dòng)畫(huà)

能夠制作引導(dǎo)路徑動(dòng)畫(huà)

能夠制作遮罩動(dòng)畫(huà)

能夠使用Animate制作電子賀卡

通用能力造型能力

審美能力

組織能力

解決問(wèn)題能力

自主學(xué)習(xí)能力

創(chuàng)新能力

綜合評(píng)價(jià)

項(xiàng)目二任務(wù)評(píng)價(jià)考核表2.6.1參考制作效果

本實(shí)例設(shè)計(jì)的生日賀卡，動(dòng)畫(huà)一開(kāi)始顯示逐漸放大的轉(zhuǎn)場(chǎng)效果、從空中掉下來(lái)的生日蛋糕和燃燒的火柴，然后蠟燭點(diǎn)燃，緊接著出現(xiàn)音樂(lè)、彩帶、蒲公英、閃爍的星星、心形氣球和祝福語(yǔ)。靜幀效果如圖2-197所示。2.6課外拓展——制作生日賀卡圖2-197

導(dǎo)入外部庫(kù)的素材元件、文本和影片剪輯，應(yīng)用“發(fā)光”濾鏡，創(chuàng)建形狀補(bǔ)間動(dòng)畫(huà)制作過(guò)渡效果。設(shè)置不同的“Alpha”值，制作傳統(tǒng)補(bǔ)間動(dòng)畫(huà)。使用“屬性”面板和“變形”面板、編寫(xiě)腳本，實(shí)現(xiàn)動(dòng)畫(huà)播放的控制。使用文字動(dòng)畫(huà)制作“點(diǎn)上生日蠟燭”文字效果。2.6.2知識(shí)要點(diǎn)Animate動(dòng)畫(huà)設(shè)計(jì)與制作實(shí)例教程

（AnimateCC2019）

項(xiàng)目三

制作電子相冊(cè)項(xiàng)目簡(jiǎn)介

隨著多媒體拍攝設(shè)備的普及，電子相冊(cè)以多樣性和低成本等特性受到人們的喜愛(ài)。因?yàn)橹谱鞣椒ê?jiǎn)單，動(dòng)態(tài)效果逼真，越來(lái)越多的人開(kāi)始使用Animate制作電子相冊(cè)。

本項(xiàng)目主要介紹元件、實(shí)例和“庫(kù)”面板的使用。通過(guò)本項(xiàng)目的學(xué)習(xí)，讀者可以掌握元件、實(shí)例和庫(kù)的相關(guān)知識(shí)，以及用Animate制作電子相冊(cè)的方法和技巧。學(xué)習(xí)目標(biāo)掌握?qǐng)D形元件、按鈕元件和影片剪輯元件的使用方法；掌握實(shí)例和“庫(kù)”面板的使用方法；掌握成長(zhǎng)相冊(cè)、婚禮相冊(cè)、家庭相冊(cè)的制作方法。3.1.1元件和實(shí)例

元件和實(shí)例是Animate動(dòng)畫(huà)的重要內(nèi)容之一。元件是指在Animate中創(chuàng)建的、可以在影片中重復(fù)使用的一個(gè)小部件，它是構(gòu)成Animate動(dòng)畫(huà)的基本單位。元件分為圖形、影片剪輯、按鈕三種類(lèi)型。實(shí)例是指位于“舞臺(tái)”或嵌入另一個(gè)元件內(nèi)的元件副本。通過(guò)元件與實(shí)例的結(jié)合使用，可以保證在動(dòng)畫(huà)文件很小的基礎(chǔ)上，實(shí)現(xiàn)Animate作品的交互能力和動(dòng)感表現(xiàn)。

首先做個(gè)試驗(yàn)，用“橢圓”工具在“舞臺(tái)”上任意畫(huà)一個(gè)圓形。選中這個(gè)矩形，看看它的“屬性”面板，如圖3-1所示。我們會(huì)發(fā)現(xiàn)這個(gè)圓形被叫作“形狀”（shape），它的屬性也只有寬度、高度和坐標(biāo)值。在Animate中，可以改變“形狀”的外形、尺寸、位置，能進(jìn)行“形狀變形”，但“形狀”的用途相當(dāng)有限。要使“動(dòng)畫(huà)元件”得到有效管理并發(fā)揮更大作用，就必須把它轉(zhuǎn)換為“元件”。3.1知識(shí)準(zhǔn)備——元件、實(shí)例和庫(kù)圖3-1

選擇這個(gè)圓形形狀，執(zhí)行“修改”>“轉(zhuǎn)換為元件”命令（或者按F8鍵），彈出“轉(zhuǎn)換為元件”對(duì)話(huà)框，默認(rèn)的“名稱(chēng)”為“元件1”，選擇“類(lèi)型”為“圖形”，單擊“確定”按鈕，把“形狀”轉(zhuǎn)為圖形元件。

執(zhí)行“窗口”>“庫(kù)”命令（或按Ctrl+L組合鍵），打開(kāi)Animate的管理機(jī)構(gòu)“庫(kù)”面板，發(fā)現(xiàn)“庫(kù)”面板中有了第一個(gè)項(xiàng)目：元件1。

接著選擇“舞臺(tái)”上的這個(gè)對(duì)象，發(fā)現(xiàn)對(duì)象已經(jīng)不像圖3-1所示的“離散狀”了，而是變成了一個(gè)“整體”，它的“屬性”面板也豐富了很多，如圖3-2所示。這個(gè)對(duì)象能夠轉(zhuǎn)化“角色”，有序列幀播放選項(xiàng)和顏色設(shè)置等。此外，它還能進(jìn)行功能最全面的“動(dòng)作變形”。圖3-2

元件僅存在于“庫(kù)”面板中，元件從“庫(kù)”面板中進(jìn)入“舞臺(tái)”就稱(chēng)為該元件的“實(shí)例”。如圖3-3所示，從庫(kù)中把“元件1”向場(chǎng)景拖放3次（也可以復(fù)制場(chǎng)景中的實(shí)例），這樣，“舞臺(tái)”上就有了元件1的3個(gè)實(shí)例。圖3-3

可以試著分別把各個(gè)實(shí)例的顏色、方向、大小設(shè)置成不同樣式，具體操作可以配合使用不同的面板，例如，可以在“屬性”面板中設(shè)置圖3-3所示的“實(shí)例1”的“寬”“高”參數(shù)，如圖3-4所示。在“變形”面板中設(shè)置它的“旋轉(zhuǎn)”參數(shù)，如圖3-5所示。與“實(shí)例1”一樣，“實(shí)例2”和“實(shí)例3”也可在“變形”面板和“屬性”面板中進(jìn)行相應(yīng)的設(shè)置，“實(shí)例2”具體設(shè)置如圖3-6所示。圖3-4

圖3-5圖3-6

能創(chuàng)建圖形元件的元素可以是導(dǎo)入的位圖圖像、矢量圖形、文本對(duì)象以及用Animate工具創(chuàng)建的線(xiàn)條、色塊等。

選擇相關(guān)元素，按F8鍵，彈出“轉(zhuǎn)換為元件”對(duì)話(huà)框，在“名稱(chēng)”文本框中輸入元件的名稱(chēng)，在“類(lèi)型”下拉列表中選擇“圖形”，如圖3-7所示，單擊“確定”按鈕，在“庫(kù)”面板中生成相應(yīng)的元件，在“舞臺(tái)”中，元素變成了元件的一個(gè)實(shí)例。

圖形元件中可包含圖形元素或者其他圖形元件，它接受Animate中的大部分變化操作，如大小、位置、方向、顏色設(shè)置以及動(dòng)作變形等。3.1.2圖形元件圖3-7

影片剪輯元件就是通常所說(shuō)的MC（MovieClip）。可以把“舞臺(tái)”上任何看得到的對(duì)象，甚至整個(gè)時(shí)間軸的內(nèi)容創(chuàng)建為一個(gè)MC，可以把一個(gè)MC放置到另一個(gè)MC中，還可以把一段動(dòng)畫(huà)（如逐幀動(dòng)畫(huà)）轉(zhuǎn)換成MC。

從以上描述可以看出，創(chuàng)建影片剪輯相當(dāng)靈活，而且創(chuàng)建過(guò)程非常簡(jiǎn)單：選擇“舞臺(tái)”上需要轉(zhuǎn)換的對(duì)象，按F8鍵，彈出“轉(zhuǎn)換為元件”對(duì)話(huà)框，在“類(lèi)型”下拉列表中選擇“影片剪輯”，如圖3-12所示，單擊“確定”按鈕。3.1.3影片剪輯元件圖3-12

按鈕元件是一種特殊的交互式影片剪輯，它只包含4個(gè)幀。當(dāng)新建一個(gè)按鈕元件時(shí)，Animate自動(dòng)創(chuàng)建一個(gè)含有4幀的時(shí)間軸，分別是“彈起”“指針經(jīng)過(guò)”“按下”和“點(diǎn)擊”。按鈕元件時(shí)間軸上的每一幀都具有特殊的含義?！颉皬椘稹睅罕硎景粹o的原始狀態(tài)，即鼠標(biāo)指針沒(méi)有對(duì)此按鈕產(chǎn)生任何動(dòng)作時(shí)，按鈕表現(xiàn)出的狀態(tài)。◎“指針經(jīng)過(guò)”幀：表示鼠標(biāo)指針位于該按鈕上時(shí)，按鈕的外觀(guān)狀態(tài)?！颉鞍聪隆睅罕硎締螕粼摪粹o時(shí)，按鈕的外觀(guān)狀態(tài)。◎“點(diǎn)擊”幀：用于定義響應(yīng)鼠標(biāo)單擊時(shí)的相應(yīng)區(qū)域，該幀上的區(qū)域在影片中是不可見(jiàn)的。3.1.4按鈕元件

“庫(kù)”面板如圖3-20所示。利用“庫(kù)”面板中的各種按鈕及“庫(kù)”菜單，可以進(jìn)行元件管理與編輯的大部分操作。①“庫(kù)”面板標(biāo)簽：拖動(dòng)它，能夠隨意移動(dòng)“庫(kù)”面板。②“庫(kù)”菜單：?jiǎn)螕羲艽蜷_(kāi)“庫(kù)”面板的菜單。③“文件”下拉列表：當(dāng)前“庫(kù)”面板所屬的文件。④元件區(qū)當(dāng)前選中的元件。3.1.5管理、使用庫(kù)圖3-20⑤“排序”按鈕：這是元件項(xiàng)目列表“排序”切換按鈕。⑥元件屬性按鈕：?jiǎn)螕艨梢愿脑傩?。⑦“添加文件夾”按鈕：?jiǎn)螕艨稍凇皫?kù)”面板中添加新的文件夾。⑧“添加元件”按鈕：?jiǎn)螕艨稍凇皫?kù)”面板中添加新的元件。⑨“刪除”按鈕單擊可刪除“庫(kù)”面板中選中的元件。3.2.1案例效果

利用元件素材制作寶寶的成長(zhǎng)電子相冊(cè)，可愛(ài)小寶寶的成長(zhǎng)過(guò)程記錄在電子相冊(cè)中，效果如圖3-21所示。3.2任務(wù)一——制作成長(zhǎng)相冊(cè)圖3-213.2.2設(shè)計(jì)思路（1）導(dǎo)入素材。（2）制作開(kāi)始按鈕元件。（3）利用學(xué)過(guò)的Animate動(dòng)畫(huà)制作動(dòng)畫(huà)效果。3.2.3相關(guān)知識(shí)和技能點(diǎn)（1）元件：圖形、按鈕、影片剪輯。（2）Animate動(dòng)畫(huà)：逐幀動(dòng)畫(huà)、傳統(tǒng)補(bǔ)間動(dòng)畫(huà)。（1）啟動(dòng)AnimateCC2019，執(zhí)行“文件”>

“新建”命令，在彈出的“新建文檔”對(duì)話(huà)框中選擇“角色動(dòng)畫(huà)”選項(xiàng)下方的預(yù)設(shè)為“標(biāo)準(zhǔn)”，設(shè)置寬度為410像素，高度為310像素，在“屬性”面板設(shè)置幀頻為12。3.2.4任務(wù)實(shí)施圖3-22（2）執(zhí)行“文件”>“導(dǎo)入”>“導(dǎo)入到庫(kù)”命令，依次將圖片素材baby、baby1、baby2、baby3、baby4導(dǎo)入“庫(kù)”面板中，如圖3-22所示。觀(guān)察“庫(kù)”面板中的素材類(lèi)型發(fā)現(xiàn)導(dǎo)入的素材為“位圖”，此時(shí)依次將位圖素材拖動(dòng)到“舞臺(tái)”上，執(zhí)行“修改”>“轉(zhuǎn)換為元件”命令，在彈出的“轉(zhuǎn)換為元件”對(duì)話(huà)框中選擇“類(lèi)型”為“圖形”，并修改元件名稱(chēng)，如圖3-23所示。全部轉(zhuǎn)換完成后的效果如圖3-24所示。圖3-23

圖3-24（3）制作成長(zhǎng)相冊(cè)的封面。①將“庫(kù)”面板中的圖形元件1拖到“舞臺(tái)”中，按Ctrl+K組合鍵，打開(kāi)“對(duì)齊”面板，設(shè)置元件1相對(duì)于“舞臺(tái)”“匹配寬和高”，水平、垂直居中，效果如圖3-25所示。②制作“小芽轉(zhuǎn)動(dòng)”影片剪輯元件。圖3-25圖3-26

圖3-27圖3-28

圖3-29圖3-30

圖3-31圖3-32

圖3-33圖3-34圖3-35圖3-36

圖3-37④回到場(chǎng)景1中，輸入文字，導(dǎo)入“小芽按鈕”元件，效果如圖3-38所示。圖3-38（4）設(shè)置相框內(nèi)容。新建“圖層_2”，在第2幀插入空白關(guān)鍵幀。設(shè)計(jì)相框，在第100幀插入普通幀。設(shè)計(jì)完成后的效果如圖3-39所示。（5）設(shè)置相冊(cè)頁(yè)內(nèi)容。圖3-39圖3-40圖3-41

圖3-42圖3-43

圖3-44（6）設(shè)置動(dòng)作。

選中文字按鈕，在“屬性”面板中設(shè)置實(shí)例名為“play_btn”，選中“封面”圖層第1幀，用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“動(dòng)作”命令，在彈出的“動(dòng)作”面板中，輸入圖3-45所示的腳本。（7）保存文件，按Ctrl+Enter組合鍵預(yù)覽效果。圖3-453.3.1案例效果

利用Animate的幀動(dòng)畫(huà)，制作出炫美的切換效果，烘托出婚禮相冊(cè)的華美，效果如圖3-46所示。3.3任務(wù)二——制作婚禮相冊(cè)圖3-463.3.2設(shè)計(jì)思路（1）導(dǎo)入素材，將位圖素材轉(zhuǎn)換為圖形元件。（2）制作封面按鈕元件素材：心形圖形元件、心形旋轉(zhuǎn)影片剪輯元件、文字按鈕。（3）使用遮罩動(dòng)畫(huà)制作相片切換效果。3.3.3相關(guān)知識(shí)和技能點(diǎn)（1）元件：圖形元件、按鈕元件、影片剪輯元件。（2）遮罩動(dòng)畫(huà)、傳統(tǒng)補(bǔ)間動(dòng)畫(huà)。（3）在“動(dòng)作”面板設(shè)置動(dòng)作。（1）啟動(dòng)AnimateCC2019，執(zhí)行“文件”>“新建”命令，在彈出的“新建文檔”對(duì)話(huà)框中選擇“角色動(dòng)畫(huà)”選項(xiàng)下方的預(yù)設(shè)為“標(biāo)準(zhǔn)”，設(shè)置寬度為400像素，高度為520像素。在“屬性”面板中設(shè)置幀頻為12。（2）執(zhí)行“文件”>“導(dǎo)入”>“導(dǎo)入到庫(kù)”命令，依次將圖片素材新娘0、新娘1、新娘2、新娘3、新娘4導(dǎo)入“庫(kù)”面板中。觀(guān)察“庫(kù)”面板中的素材類(lèi)型發(fā)現(xiàn)導(dǎo)入的素材為“位圖”，此時(shí)依次將位圖素材拖動(dòng)到“舞臺(tái)”上，執(zhí)行“修改”>“轉(zhuǎn)換為元件”命令，在彈出的“轉(zhuǎn)換為元件”對(duì)話(huà)框中選擇“類(lèi)型”為“圖形”，修改元件名稱(chēng)。全部轉(zhuǎn)換完成后的效果如圖3-47所示。（3）制作封面。3.3.4任務(wù)實(shí)施圖3-47（4）制作相框。（5）制作相冊(cè)頁(yè)。（6）設(shè)置動(dòng)作。（7）測(cè)試發(fā)布影片，完成婚禮相冊(cè)的制作。圖3-703.4.1實(shí)訓(xùn)概述

本實(shí)訓(xùn)制作效果如圖3-71所示。3.4實(shí)訓(xùn)任務(wù)——制作家庭相冊(cè)圖3-711．動(dòng)畫(huà)的制作目的與設(shè)計(jì)理念

制作本實(shí)訓(xùn)的目的是強(qiáng)化元件和“庫(kù)”面板的使用，以及“動(dòng)作”面板的引入。

本實(shí)訓(xùn)是制作一個(gè)家庭相冊(cè)，體現(xiàn)和諧的家庭氛圍，增進(jìn)親人的感情。2．動(dòng)畫(huà)整體風(fēng)格設(shè)計(jì)

本實(shí)訓(xùn)以漫畫(huà)人物為原型，所以動(dòng)畫(huà)的整體風(fēng)格生動(dòng)活潑，連按鈕也是一只淘氣的小貓咪，同時(shí)給按鈕配上相應(yīng)的貓咪叫聲。3．素材收集與處理

素材包括以“歡樂(lè)家庭”為主題的素材圖片和貓咪的叫聲。1．主題設(shè)計(jì)

小女孩的家庭合影。2．造型設(shè)計(jì)

按照卡通人物原型為基礎(chǔ)設(shè)計(jì)。3．場(chǎng)景設(shè)計(jì)

按照卡通原型為基礎(chǔ)設(shè)計(jì)。3.4.2實(shí)訓(xùn)要點(diǎn)（1）新建一個(gè)Animate文檔，保存名稱(chēng)為“家庭相冊(cè).fla”。將素材圖片依次導(dǎo)入“庫(kù)”面板中。導(dǎo)入的素材類(lèi)型為“位圖”，將位圖依次轉(zhuǎn)換為圖形元件，方法同前面的案例。轉(zhuǎn)換完成后的效果如圖3-72所示。（2）制作按鈕元件，在這個(gè)按鈕元件中會(huì)學(xué)習(xí)如何給按鈕添加聲音。執(zhí)行“插入”>“新建元件”>“按鈕元件”命令，選中“彈起”幀，將“按鈕圖片”圖形元件從“庫(kù)”面板中拖入“舞臺(tái)”中心，效果如圖3-73所示。3.4.3實(shí)訓(xùn)步驟圖3-72

圖3-73（3）用鼠標(biāo)右鍵單擊“指針經(jīng)過(guò)”幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，在“變形”面板中將實(shí)例調(diào)整為原始大小的120%，如圖3-74和圖3-75所示。（4）用鼠標(biāo)右鍵單擊“彈起”幀，在彈出的快捷菜單中選擇“復(fù)制幀”命令；用鼠標(biāo)右鍵單擊“按下幀”，在彈出的快捷菜單中選擇“粘貼幀”命令，把“彈起”幀中的內(nèi)容復(fù)制到“按下”幀；用鼠標(biāo)右鍵單擊“點(diǎn)擊幀”，在彈出的快捷菜單中選擇“插入幀”命令完成按鈕的制作。圖3-74

圖3-75（5）新建“圖層_2”，用鼠標(biāo)右鍵單擊“彈起幀”，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，選擇“文字”工具，輸入文字“play”，效果及屬性設(shè)置如圖3-76和圖3-77所示。（6）執(zhí)行“文件”>“導(dǎo)入”>“導(dǎo)入到庫(kù)”命令，將素材中的“喵喵.wav”聲音文件導(dǎo)入“庫(kù)”面板中，導(dǎo)入的效果如圖3-78所示。圖3-76

圖3-77

圖3-78（7）新建“圖層_3”，選擇“指針經(jīng)過(guò)”幀，用鼠標(biāo)右鍵單擊，選擇“插入關(guān)鍵幀”命令，將元件“喵喵.wav”從“庫(kù)”面板中拖入“舞臺(tái)”，效果如圖3-79所示。注意：要想按鈕的聲音顯示，“屬性”面板中的“同步”選項(xiàng)一定要設(shè)置為“事件”，如圖3-80所示。至此完成按鈕的制作。（8）回到場(chǎng)景1中，制作幾張相片間的切換效果，利用所學(xué)的Animate幀動(dòng)畫(huà)知識(shí)制作各種美觀(guān)的效果。本項(xiàng)目使用的是簡(jiǎn)單的顏色透明度動(dòng)作補(bǔ)間動(dòng)畫(huà)。制作完成的面板效果如圖3-81所示。圖3-79

圖3-80圖3-81（9）給相冊(cè)添加動(dòng)作，實(shí)現(xiàn)單擊按鈕開(kāi)始播放。新建“圖層_2”，查看“幀”面板，看到“圖層_2”被自動(dòng)添加到與“圖層_1”相同的幀數(shù)120幀，選擇“圖層_2”的第11幀，用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“動(dòng)作”命令，在彈出的“動(dòng)作”面板中輸入“stop();”，效果如圖3-82所示。圖3-82（10）測(cè)試影片發(fā)現(xiàn)影片沒(méi)有自動(dòng)播放，是靜止的，接下來(lái)添加按鈕。新建“圖層_3”，選中第1幀，將“按鈕元件”元件從“庫(kù)”面板拖到“舞臺(tái)”，并放置在合適的位置，用鼠標(biāo)右鍵單擊“圖層_3”的第2幀，在彈出的快捷菜單中選擇“插入空白關(guān)鍵幀”命令，將第3～120幀刪除，如圖3-83所示。圖3-83（11）選中“舞臺(tái)”上的“按鈕元件”按鈕實(shí)例，在“屬性”面板中設(shè)置實(shí)例名為“play_btn”，選中“圖層_2”圖層第1幀，用鼠標(biāo)右鍵單擊，在彈出的快捷菜單中選擇“動(dòng)作”命令，在彈出的“動(dòng)作”面板中，輸入圖3-84所示的腳本。（12）發(fā)布導(dǎo)出影片，即可查看制作的家庭相冊(cè)。圖3-843.5評(píng)價(jià)考核能力類(lèi)型考核內(nèi)容評(píng)價(jià)學(xué)習(xí)目標(biāo)評(píng)價(jià)項(xiàng)目321職業(yè)能力掌握?qǐng)D形元件、按鈕元件和影片剪輯元件的制作方法；會(huì)使用“庫(kù)”面板；會(huì)運(yùn)用Animate制作電子相冊(cè)能夠制作圖形元件

能夠制作按鈕元件

能夠制作影片剪輯元件

能夠使用“庫(kù)”面板

能夠使用Animate制作電子相冊(cè)

通用能力造型能力

審美能力

組織能力

解決問(wèn)題能力

自主學(xué)習(xí)能力

創(chuàng)新能力

綜合評(píng)價(jià)

項(xiàng)目三任務(wù)評(píng)價(jià)考核表3.6.1參考制作效果

動(dòng)漫相冊(cè)的最終效果如圖3-85所示。3.6課外拓展——制作動(dòng)漫相冊(cè)圖3-85動(dòng)漫相冊(cè)（1）按鈕元件的使用。（2）各補(bǔ)間動(dòng)畫(huà)的使用。（3）簡(jiǎn)單的動(dòng)作與行為。3.6.2知識(shí)要點(diǎn)（1）啟動(dòng)AnimateCC2019，單擊文檔“屬性”面板下方的“高級(jí)設(shè)置”按鈕，打開(kāi)“文檔設(shè)置”面板，取消選中“使用高級(jí)圖層”復(fù)選框，如圖3-86所示。將素材依次導(dǎo)入“庫(kù)”面板中，在“庫(kù)”面板中新建“素材”文件夾，把導(dǎo)入的圖片素材拖動(dòng)到“素材”文件夾下。（2）將對(duì)應(yīng)位圖素材依次建立為按鈕元件，如圖3-87所示，其中一個(gè)例子如圖3-88所示。3.6.3參考制作過(guò)程圖3-86

圖3-87圖3-88（3）新建“圖層1”，重命名為“背景”，導(dǎo)入圖片素材1.jpg，效果如圖3-89所示。圖3-89（4）新建“圖層2”，重命名為“灰照片”，單擊第1幀，在舞臺(tái)上擺好圖片的位置，如圖3-90所示，分別在第2幀、第16幀、第45幀和第62幀插入關(guān)鍵幀，在第2幀、第16幀、第45幀和第62幀依次刪除圖片htl、lyy、myy、nyy、xhh，并調(diào)整圖片的大小，效果如圖3-91所示。圖3-90圖3-91（5）選擇“灰照片”圖層的第1幀，然后依次選中每一個(gè)按鈕元件，在“屬性”面板修改實(shí)例名稱(chēng)分別為htl1_btn，lyy1_btn，nyy1_btn，myy1_btn，xhh1_btn，如圖3-92所示。圖3-92（6）新建文字層，輸入文字“喜羊羊與灰太狼”，效果如圖3-93所示。圖3-93（7）新建“圖層4”，重名為“灰太狼”，在這一層實(shí)現(xiàn)灰太狼圖片的預(yù)覽。在第1幀插入空白關(guān)鍵幀，選擇第2幀右鍵單擊，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，使用“繪圖紙”工具將有色的灰太狼圖片與原來(lái)無(wú)色的圖片的位置對(duì)應(yīng)。用鼠標(biāo)右鍵單擊第29幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”命令，用鼠標(biāo)右鍵單擊第15幀，在彈出的快捷菜單中選擇“插入關(guān)鍵幀”后，調(diào)整圖片的大小和位置，使其位于“舞臺(tái)”中央。用鼠標(biāo)右鍵單擊第16幀建立關(guān)鍵幀，在第2幀、第15幀、第16～29幀建立動(dòng)作補(bǔ)間動(dòng)畫(huà)，效果如圖3-94所示。圖3-94（8）選擇該圖層第15幀，修改htl元件的實(shí)例名稱(chēng)為“htl_btn”，如圖3-95所示，在該層的第15幀上添加動(dòng)作腳本，如圖3-96所示。圖3-95

圖3-96（9）同樣的方法依次建立“懶羊羊”“美羊羊”“暖羊羊”和“小灰灰”圖層，建立完成后的效果如圖3-97所示。圖3-97（10）建立“動(dòng)作1”圖層和“動(dòng)作2”圖層用來(lái)實(shí)現(xiàn)單擊自動(dòng)播放，如圖3-98和圖3-99所示。（11）執(zhí)行保存、發(fā)布操作，即可完成動(dòng)漫相冊(cè)的制作。圖3-98

圖3-9