Animate動(dòng)畫(huà)設(shè)計(jì)教程（Animate CC 2018 微課版）

項(xiàng)目一 走進(jìn)Animate動(dòng)畫(huà)世界　1
任務(wù)一　認(rèn)識(shí)Animate動(dòng)畫(huà)\t2
一、任務(wù)目標(biāo)\t2
二、相關(guān)知識(shí)\t2
（一）Animate動(dòng)畫(huà)設(shè)計(jì)的優(yōu)勢(shì)\t2
（二）Animate動(dòng)畫(huà)的應(yīng)用領(lǐng)域\t3
（三）Animate動(dòng)畫(huà)文件類(lèi)型\t5
（四）動(dòng)畫(huà)制作流程\t5
三、任務(wù)實(shí)施\t6
（一）打開(kāi)Animate文件\t6
（二）預(yù)覽與發(fā)布動(dòng)畫(huà)\t7
任務(wù)二　制作“豹子奔跑”動(dòng)畫(huà) \t8
一、 任務(wù)目標(biāo)\t8
二、相關(guān)知識(shí)\t8
（一）Animate CC 2018的工作界面\t9
（二）Animate CC 2018動(dòng)畫(huà)文件的基本操作\t11
三、任務(wù)實(shí)施\t13
（一）新建Animate文件\t13
（二）制作與預(yù)覽Animate動(dòng)畫(huà)\t14
實(shí)訓(xùn)一　轉(zhuǎn)換“放大鏡”動(dòng)畫(huà)的類(lèi)型并發(fā)布\t14
實(shí)訓(xùn)二　調(diào)整“宇宙”動(dòng)畫(huà)的尺寸大小 \t15
課后練習(xí)\t\t\t16
技巧提升\t\t\t17
項(xiàng)目二 繪制與編輯圖形 18
任務(wù)一　繪制卡通小熊圖形 \t19
一、任務(wù)目標(biāo)\t19
二、相關(guān)知識(shí)\t19
（一）圖形圖像的基礎(chǔ)知識(shí)\t19
（二）幾何繪圖工具\(yùn)t21
（三）自由繪圖工具\(yùn)t25
（四）繪圖輔助工具\(yùn)t27
（五）選擇類(lèi)工具\(yùn)t29
三、任務(wù)實(shí)施\t30
（一）繪制小熊頭部\t30
（二）繪制小熊的身體\t32
任務(wù)二　為“荷塘月色”填色 \t33
一、任務(wù)目標(biāo)\t33
二、相關(guān)知識(shí)\t34
（一）認(rèn)識(shí)顏色\t34
（二）“顏色”面板\t34
（三）“樣本”面板\t35
（四）編輯漸變填充\t35
（五）使用填充工具\(yùn)t37
三、任務(wù)實(shí)施\t38
（一）線(xiàn)性漸變填充\t38
（二）徑向漸變填充\t40
任務(wù)三　制作郊外場(chǎng)景 \t41
一、任務(wù)目標(biāo)\t41
二、相關(guān)知識(shí)\t41
（一）變形對(duì)象\t41
（二）翻轉(zhuǎn)對(duì)象\t43
（三）合并對(duì)象\t43
（四）組合與分離對(duì)象\t44
（五）排列與對(duì)齊對(duì)象\t45
三、任務(wù)實(shí)施\t46
（一）調(diào)整背景、草地、太陽(yáng)和云\t46
（二）調(diào)整樹(shù)木、房屋和花\t47
實(shí)訓(xùn)一　繪制臉譜 \t48
實(shí)訓(xùn)二　繪制卡通場(chǎng)景 \t49
課后練習(xí)\t\t\t50
技巧提升\t\t\t51
項(xiàng)目三 添加與編輯文本 52
任務(wù)一　制作“音樂(lè)節(jié)”海報(bào) \t53
一、任務(wù)目標(biāo)\t53
二、相關(guān)知識(shí)\t53
（一）文本工具\(yùn)t53
（二）文本工具的“屬性”面板\t54
（三）“時(shí)間軸”面板\t54
三、任務(wù)實(shí)施\t56
任務(wù)二　制作招聘DM單\t59
一、 任務(wù)目標(biāo)\t59
二、相關(guān)知識(shí)\t60
（一）文本變形\t60
（二）文本填充\t61
（三）文本邊框\t61
三、任務(wù)實(shí)施\t61
（一）制作標(biāo)題文本\t61
（二）添加其他文本\t63
實(shí)訓(xùn)一　制作中秋橫幅廣告 \t64
實(shí)訓(xùn)二　制作環(huán)保宣傳廣告 \t64
課后練習(xí)\t\t\t65
技巧提升\t\t\t66
項(xiàng)目四 使用元件與素材 67
任務(wù)一　制作生日賀卡 \t68
一、任務(wù)目標(biāo)\t68
二、相關(guān)知識(shí)\t68
（一）認(rèn)識(shí)元件和實(shí)例\t68
（二）創(chuàng)建元件\t69
（三）編輯元件\t70
（四）為實(shí)例添加濾鏡效果\t70
（五）認(rèn)識(shí)“庫(kù)”面板\t72
（六）調(diào)用外部庫(kù)文件\t72
三、任務(wù)實(shí)施\t73
（一）從外部庫(kù)文件中調(diào)用素材\t73
（二）創(chuàng)建元件并添加濾鏡\t74
任務(wù)二　制作“水彩畫(huà)”動(dòng)畫(huà)\t75
一、 任務(wù)目標(biāo)\t75
二、相關(guān)知識(shí)\t75
（一）導(dǎo)入一般位圖\t75
（二）導(dǎo)入PSD文件\t76
（三）導(dǎo)入AI文件\t77
（四）將位圖轉(zhuǎn)換為矢量圖\t77
三、任務(wù)實(shí)施\t78
實(shí)訓(xùn)一　制作小池場(chǎng)景 \t80
實(shí)訓(xùn)二　制作夏日沙灘場(chǎng)景 \t81
課后練習(xí)\t\t\t81
技巧提升\t\t\t83
項(xiàng)目五 制作基本動(dòng)畫(huà) 84
任務(wù)一　制作“跳動(dòng)文字”動(dòng)畫(huà) \t85
一、任務(wù)目標(biāo)\t85
二、相關(guān)知識(shí)\t85
（一）幀的編輯\t85
（二）圖層的運(yùn)用\t87
（三）動(dòng)畫(huà)播放控制\t91
三、任務(wù)實(shí)施\t92
（一）插入關(guān)鍵幀\t92
（二）添加效果\t93
任務(wù)二　制作“風(fēng)景相冊(cè)”動(dòng)畫(huà)\t94
一、 任務(wù)目標(biāo)\t94
二、相關(guān)知識(shí)\t95
（一）Animate的基本動(dòng)畫(huà)類(lèi)型\t95
（二）各種動(dòng)畫(huà)在時(shí)間軸中的標(biāo)識(shí)\t96
（三）創(chuàng)建逐幀動(dòng)畫(huà)\t96
（四）創(chuàng)建補(bǔ)間形狀動(dòng)畫(huà)\t97
（五）創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫(huà)\t97
（六）創(chuàng)建補(bǔ)間動(dòng)畫(huà)\t98
三、任務(wù)實(shí)施\t98
（一）制作傳統(tǒng)補(bǔ)間動(dòng)畫(huà)\t98
（二）制作補(bǔ)間形狀動(dòng)畫(huà)\t100
任務(wù)三　制作“促銷(xiāo)廣告”動(dòng)畫(huà)\t101
一、 任務(wù)目標(biāo)\t101
二、相關(guān)知識(shí)\t102
（一）設(shè)置補(bǔ)間形狀動(dòng)畫(huà)屬性\t102
（二）設(shè)置傳統(tǒng)補(bǔ)間動(dòng)畫(huà)屬性\t103
（三）設(shè)置補(bǔ)間動(dòng)畫(huà)屬性\t104
三、任務(wù)實(shí)施\t105
（一）創(chuàng)建傳統(tǒng)補(bǔ)間動(dòng)畫(huà)和補(bǔ)間動(dòng)畫(huà)\t105
（二）為動(dòng)畫(huà)添加緩動(dòng)效果\t109
實(shí)訓(xùn)一　制作“汽車(chē)行駛”動(dòng)畫(huà) \t109
實(shí)訓(xùn)二　制作“籃球”動(dòng)畫(huà) \t110
課后練習(xí)\t\t\t111
技巧提升\t\t\t112
項(xiàng)目六 制作高級(jí)動(dòng)畫(huà) 113
任務(wù)一　制作“紙飛機(jī)”動(dòng)畫(huà) \t114
一、任務(wù)目標(biāo)\t114
二、相關(guān)知識(shí)\t114
（一）引導(dǎo)動(dòng)畫(huà)原理\t114
（二）創(chuàng)建引導(dǎo)動(dòng)畫(huà)\t114
（三）引導(dǎo)動(dòng)畫(huà)的“屬性”面板\t115
（四）制作引導(dǎo)動(dòng)畫(huà)的注意事項(xiàng)\t116
三、任務(wù)實(shí)施\t116
（一）創(chuàng)建引導(dǎo)動(dòng)畫(huà)\t116
（二）設(shè)置引導(dǎo)動(dòng)畫(huà)的屬性\t117
任務(wù)二　制作“高山流水”動(dòng)畫(huà)\t118
一、 任務(wù)目標(biāo)\t118
二、相關(guān)知識(shí)\t119
（一）遮罩動(dòng)畫(huà)原理\t119
（二）創(chuàng)建遮罩層\t119
（三）創(chuàng)建遮罩動(dòng)畫(huà)的注意事項(xiàng)\t120
三、任務(wù)實(shí)施\t120
（一）創(chuàng)建補(bǔ)間動(dòng)畫(huà)\t120
（二）創(chuàng)建遮罩動(dòng)畫(huà)\t121
任務(wù)三　制作“人物行走”動(dòng)畫(huà)\t123
一、 任務(wù)目標(biāo)\t123
二、相關(guān)知識(shí)\t124
（一）認(rèn)識(shí)骨骼動(dòng)畫(huà)\t124
（二）添加骨骼\t124
（三）編輯骨骼\t125
（四）創(chuàng)建骨骼動(dòng)畫(huà)\t127
（五）設(shè)置骨骼動(dòng)畫(huà)的屬性\t128
三、任務(wù)實(shí)施\t128
（一）創(chuàng)建骨骼\t128
（二）編輯骨骼動(dòng)畫(huà)\t129
實(shí)訓(xùn)一　制作“楓葉飄落”動(dòng)畫(huà) \t130
實(shí)訓(xùn)二　制作海浪效果 \t131
實(shí)訓(xùn)三　制作“舞蹈剪影”動(dòng)畫(huà) \t132
課后練習(xí)\t\t\t133
技巧提升\t\t\t134
項(xiàng)目七 添加音頻和視頻 135
任務(wù)一　制作“音樂(lè)片頭”動(dòng)畫(huà) \t136
一、任務(wù)目標(biāo)\t136
二、相關(guān)知識(shí)\t136
（一）聲音的格式\t136
（二）導(dǎo)入與添加聲音\t137
（三）修改與刪除聲音\t137
（四）設(shè)置聲音播放次數(shù)\t137
（五）設(shè)置聲音的屬性\t137
三、任務(wù)實(shí)施\t139
（一）添加背景音樂(lè)\t139
（二）添加按鈕音效\t139
任務(wù)二　制作“夜色朦朧”動(dòng)畫(huà)\t140
一、 任務(wù)目標(biāo)\t141
二、相關(guān)知識(shí)\t141
（一）視頻的格式\t141
（二）導(dǎo)入視頻文件\t141
三、任務(wù)實(shí)施\t143
（一）制作背景\t143
（二）導(dǎo)入視頻\t144
實(shí)訓(xùn)一　制作“有聲飛機(jī)”動(dòng)畫(huà) \t144
實(shí)訓(xùn)二　制作“電視節(jié)目預(yù)告”動(dòng)畫(huà) \t146
課后練習(xí)\t\t\t146
技巧提升\t\t\t147
項(xiàng)目八 制作腳本與組件動(dòng)畫(huà) 148
任務(wù)一　制作“動(dòng)態(tài)風(fēng)光”相冊(cè) \t149
一、任務(wù)目標(biāo)\t149
二、相關(guān)知識(shí)\t149
（一）JavaScript和CreateJS\t149
（二）“動(dòng)作”面板的使用\t150
（三）變量\t151
（四）數(shù)據(jù)類(lèi)型\t152
（五）表達(dá)式和運(yùn)算符\t152
（六）函數(shù)\t154
（七）語(yǔ)句\t154
（八）時(shí)間軸導(dǎo)航函數(shù)\t156
（九）事件處理\t157
三、任務(wù)實(shí)施\t157
（一）添加圖片和按鈕\t157
（二）輸入腳本程序代碼\t158
任務(wù)二　制作“電子時(shí)鐘”動(dòng)畫(huà)\t161
一、 任務(wù)目標(biāo)\t161
二、相關(guān)知識(shí)\t161
（一）處理時(shí)間和日期\t161
（二）顯示動(dòng)態(tài)文本\t161
三、任務(wù)實(shí)施\t162
（一）繪制動(dòng)態(tài)文本框\t162
（二）輸入腳本程序代碼\t163
任務(wù)三　制作“雪花飛舞”動(dòng)畫(huà)\t164
一、 任務(wù)目標(biāo)\t164
二、相關(guān)知識(shí)\t165
（一）隨機(jī)函數(shù)\t165
（二）設(shè)置影片剪輯屬性\t165
（三）使用腳本從庫(kù)中創(chuàng)建對(duì)象\t166
三、任務(wù)實(shí)施\t166
（一）制作雪花飄落影片剪輯元件\t166
（二）輸入腳本程序代碼\t167
任務(wù)四　制作問(wèn)卷調(diào)查表\t168
一、任務(wù)目標(biāo)\t168
二、相關(guān)知識(shí)\t168
（一）組件的類(lèi)型\t168
（二）組件的操作\t169
（三）常用組件的使用\t169
（四）調(diào)試腳本程序\t171
三、任務(wù)實(shí)施\t173
（一）輸入文本并添加組件\t173
（二）輸入腳本程序代碼\t175
實(shí)訓(xùn)一　制作交互式滾動(dòng)廣告 \t177
實(shí)訓(xùn)二　制作“鐘表”動(dòng)畫(huà) \t178
實(shí)訓(xùn)三　制作美食問(wèn)卷調(diào)查表 \t179
課后練習(xí)\t\t\t180
技巧提升\t\t\t181
項(xiàng)目九 優(yōu)化、發(fā)布與導(dǎo)出動(dòng)畫(huà) 182
任務(wù)一　測(cè)試和優(yōu)化“雪夜”動(dòng)畫(huà) \t183
一、任務(wù)目標(biāo)\t183
二、相關(guān)知識(shí)\t183
（一）測(cè)試動(dòng)畫(huà)\t183
（二）優(yōu)化動(dòng)畫(huà)\t184
三、任務(wù)實(shí)施\t186
（一）測(cè)試動(dòng)畫(huà)\t186
（二）優(yōu)化動(dòng)畫(huà)\t186
任務(wù)二　發(fā)布“恭賀新禧”動(dòng)畫(huà)\t189
一、 任務(wù)目標(biāo)\t189
二、相關(guān)知識(shí)\t189
（一）發(fā)布設(shè)置\t189
（二）發(fā)布動(dòng)畫(huà)\t193
三、任務(wù)實(shí)施\t193
任務(wù)三　導(dǎo)出“汽車(chē)廣告”動(dòng)畫(huà)\t194
一、 任務(wù)目標(biāo)\t194
二、相關(guān)知識(shí)\t195
（一）導(dǎo)出圖像\t195
（二）導(dǎo)出影片\t196
（三）導(dǎo)出視頻\t196
（四）導(dǎo)出GIF動(dòng)畫(huà)\t197
三、任務(wù)實(shí)施\t198
實(shí)訓(xùn)一　測(cè)試并發(fā)布“動(dòng)態(tài)風(fēng)光相冊(cè)” \t199
實(shí)訓(xùn)二　導(dǎo)出“有聲飛機(jī)”動(dòng)畫(huà) \t200
課后練習(xí)\t\t\t201
技巧提升\t\t\t202
項(xiàng)目十 綜合案例 203
任務(wù)一　制作網(wǎng)站進(jìn)入動(dòng)畫(huà) \t204
一、任務(wù)目標(biāo)\t204
二、相關(guān)知識(shí)\t204
（一）構(gòu)建Animate網(wǎng)站的常用技術(shù)\t204
（二）如何規(guī)劃Animate網(wǎng)站\t204
三、任務(wù)實(shí)施\t205
（一）制作進(jìn)入動(dòng)畫(huà)\t205
（二）制作網(wǎng)頁(yè)導(dǎo)航條動(dòng)畫(huà)\t209
任務(wù)二　制作“打地鼠”游戲\t214
一、任務(wù)目標(biāo)\t214
二、相關(guān)知識(shí)\t214
（一）Animate游戲概述\t214
（二）Animate游戲制作流程\t214
三、任務(wù)實(shí)施\t216
（一）制作動(dòng)畫(huà)界面\t216
（二）編輯元件\t218
（三）編輯交互式腳本\t225
（四）測(cè)試和發(fā)布動(dòng)畫(huà)\t226
實(shí)訓(xùn)一　制作“童年”MV \t227
實(shí)訓(xùn)二　制作“青蛙跳”游戲\t228
課后練習(xí)\t\t\t229
技巧提升\t\t\t230