Animate動畫製作實用教程（微課視頻版）

目 錄

案例素材

習題答案

第1章　Animate CC動畫製作基礎 ………………………………………1

1.1　Animate CC的工作環境 …………………………………………………………………1

1.1.1　Animate CC的操作界面 ………………………………………………………………1

1.1.2　設置工作環境 …………………………………………………………………………5

1.2　文檔的基本操作……………………………………………………………………………8

1.2.1　新建文檔 ………………………………………………………………………………8

1.2.2　設置文檔屬性 ………………………………………………………………………10

1.2.3　保存文檔 ………………………………………………………………………………11

1.2.4　打開和關閉文檔 ……………………………………………………………………12

1.3　影片的測試和導出………………………………………………………………………14

1.3.1　預覽和測試動畫 ……………………………………………………………………14

1.3.2　文件的導出 …………………………………………………………………………15

1.4　文件的發布………………………………………………………………………………15

1.4.1　文件的發布設置 ……………………………………………………………………15

1.4.2　針對HTML5的發布 ………………………………………………………………16

1.5　本章小結…………………………………………………………………………………21

1.6　本章習題…………………………………………………………………………………21

1.7　上機練習與指導…………………………………………………………………………22

1.7.1　Animate CC界面的操作 ……………………………………………………………22

1.7.2　使用模板並發布為可執行文件 ……………………………………………………22

第2章　繪制圖形 …………………………………………………………23

2.1　繪制規則圖形……………………………………………………………………………23

2.1.1　矩形工具和基本矩形工具 …………………………………………………………23

2.1.2　橢圓工具和基本橢圓工具 …………………………………………………………26

2.1.3　多角星形工具 ………………………………………………………………………28

2.1.4　實戰範例—田園農舍 ……………………………………………………………29

2.2　繪制不規則圖形…………………………………………………………………………33

2.2.1　線條工具 ……………………………………………………………………………33

Animate動畫製作實用教程（微課視頻版）

VI

2.2.2　鉛筆工具 ……………………………………………………………………………35

2.2.3　鋼筆工具 ……………………………………………………………………………36

2.2.4　實戰範例—卡通獅子 ……………………………………………………………38

2.3　三種畫筆工具……………………………………………………………………………40

2.3.1　傳統畫筆工具 ………………………………………………………………………40

2.3.2　畫筆工具 ……………………………………………………………………………42

2.3.3　流暢畫筆工具 ………………………………………………………………………44

2.3.4　實戰範例—草地 …………………………………………………………………45

2.4　其他輔助繪圖工具………………………………………………………………………49

2.4.1　選取對象 ……………………………………………………………………………49

2.4.2　擦除對象 ……………………………………………………………………………52

2.4.3　查看對象 ……………………………………………………………………………53

2.4.4　實戰範例—雨傘 …………………………………………………………………53

2.5　本章小結…………………………………………………………………………………56

2.6　本章練習…………………………………………………………………………………56

2.7　上機練習和指導…………………………………………………………………………57

2.7.1　繪制卡通魚 …………………………………………………………………………57

2.7.2　繪制足球 ……………………………………………………………………………57

第3章　圖形的色彩 ………………………………………………………58

3.1　純色填充…………………………………………………………………………………58

3.1.1　創建顏色 ……………………………………………………………………………58

3.1.2　填充純色 ……………………………………………………………………………62

3.1.3　實戰範例—線稿上色 ……………………………………………………………64

3.2　漸變填充…………………………………………………………………………………65

3.2.1　創建漸變 ……………………………………………………………………………66

3.2.2　漸變的調整 …………………………………………………………………………67

3.2.3　實戰範例—水晶時鐘 ……………………………………………………………70

3.3　位圖填充…………………………………………………………………………………73

3.3.1　填充位圖 ……………………………………………………………………………73

3.3.2　調整位圖填充 ………………………………………………………………………74

3.3.3　實戰範例—國畫捲軸 ……………………………………………………………75

3.4　本章小結…………………………………………………………………………………80

3.5　本章練習…………………………………………………………………………………80

3.6　上機練習和指導…………………………………………………………………………81

3.6.1　蘋果 …………………………………………………………………………………81

3.6.2　水晶按鈕 ……………………………………………………………………………81

目錄

VII

第4章　圖形的變換 ………………………………………………………82

4.1　對象的變形………………………………………………………………………………82

4.1.1　線條的平滑和伸直 …………………………………………………………………82

4.1.2　對象的任意變形 ……………………………………………………………………83

4.1.3　對象的精確變形 ……………………………………………………………………85

4.1.4　實戰範例—禮品盒 ………………………………………………………………86

4.2　對象的對齊和排列………………………………………………………………………92

4.2.1　對象的對齊 …………………………………………………………………………92

4.2.2　對象的排列 …………………………………………………………………………94

4.2.3　對象的貼緊 …………………………………………………………………………94

4.2.4　實戰範例—手機 …………………………………………………………………96

4.3　對象的合並和組合………………………………………………………………………99

4.3.1　Animate CC的繪圖模式 ……………………………………………………………99

4.3.2　對象的合並 …………………………………………………………………………100

4.3.3　對象的組合 …………………………………………………………………………102

4.3.4　對象的分離 …………………………………………………………………………102

4.3.5　實戰範例—清晨 …………………………………………………………………103

4.4　本章小結…………………………………………………………………………………109

4.5　本章練習…………………………………………………………………………………109

4.6　上機練習和指導…………………………………………………………………………109

4.6.1　繪制圖案 ……………………………………………………………………………109

4.6.2　繪制各種花朵 ………………………………………………………………………110

第5章　在作品中應用文字 ………………………………………………111

5.1　文本的基本操作…………………………………………………………………………111

5.1.1　創建文本 ……………………………………………………………………………111

5.1.2　文本的選擇 …………………………………………………………………………112

5.1.3　設置文本方向 ………………………………………………………………………112

5.1.4　設置字符樣式 ………………………………………………………………………113

5.1.5　設置段落樣式 ………………………………………………………………………116

5.1.6　輸入文本和動態文本 ………………………………………………………………117

5.1.7　嵌入字體 ……………………………………………………………………………119

5.1.8　實戰範例—店內廣告 ……………………………………………………………120

5.2　使用濾鏡…………………………………………………………………………………124

5.2.1　濾鏡的操作 …………………………………………………………………………124

5.2.2　濾鏡詳解 ……………………………………………………………………………125

Animate動畫製作實用教程（微課視頻版）

5.2.3　實用範例—新年日歷 ……………………………………………………………129

5.3　本章小結…………………………………………………………………………………134

5.4　本章練習…………………………………………………………………………………134

5.5　上機練習和指導…………………………………………………………………………135

5.5.1　輝光文字效果 ………………………………………………………………………135

5.5.2　製作文字特效 ………………………………………………………………………136

第6章　 AnimateCC基礎動畫 …………………………………………137

6.1　逐幀動畫…………………………………………………………………………………137

6.1.1　時間軸上的幀 ………………………………………………………………………137

6.1.2　圖層的管理 …………………………………………………………………………142

6.1.3　實戰範例—盛開的雪蓮花 ………………………………………………………146

6.2　形狀補間動畫……………………………………………………………………………149

6.2.1　製作形狀補間動畫的方法 …………………………………………………………149

6.2.2　形狀補間動畫的參數設置 …………………………………………………………150

6.2.3　添加形狀提示 ………………………………………………………………………150

6.2.4　實戰範例—窗簾飄動 ……………………………………………………………151

6.3　傳統補間動畫……………………………………………………………………………154

6.3.1　傳統補間動畫的創建方法 …………………………………………………………154

6.3.2　傳統補間的參數設置 ………………………………………………………………156

6.3.3　傳統補間動畫的應用分析 …………………………………………………………158

6.3.4　實戰範例—彈簧振子模擬動畫 …………………………………………………161

6.4　沿路徑運動的傳統補間動畫……………………………………………………………163

6.4.1　製作路徑動畫的方法 ………………………………………………………………163

6.4.2　基於筆觸的路徑動畫 ………………………………………………………………165

6.4.3　實戰範例—台風模擬演示動畫 …………………………………………………168

6.5　自定義緩動效果…………………………………………………………………………170

6.5.1　製作自定義緩動動畫的方法 ………………………………………………………170

6.5.2　對緩動效果進行設置 ………………………………………………………………172

6.5.3　實戰範例—逼真彈跳的球 ………………………………………………………173

6.6　本章小結…………………………………………………………………………………176

6.7　本章練習…………………………………………………………………………………177

6.8　上機練習和指導…………………………………………………………………………178

6.8.1　倒計時動畫 …………………………………………………………………………178

6.8.2　網絡橫幅廣告 ………………………………………………………………………178

6.8.3　搖曳的燭光 …………………………………………………………………………179

6.8.4　沿路徑彈跳的小球 …………………………………………………………………182

目錄

第7章　元件和實例 ………………………………………………………183

7.1　初識元件和實例…………………………………………………………………………183

7.1.1　元件 …………………………………………………………………………………183

7.1.2　實例 …………………………………………………………………………………185

7.2　元件的類型和創建元件的方法…………………………………………………………185

7.2.1　元件的類型 …………………………………………………………………………185

7.2.2　元件的創建方法 ……………………………………………………………………186

7.2.3　編輯元件的三種方式 ………………………………………………………………187

7.2.4　元件的基本操作 ……………………………………………………………………188

7.3　影片剪輯元件……………………………………………………………………………192

7.3.1　認識影片剪輯元件 …………………………………………………………………192

7.3.2　影片剪輯的“9切片縮放” …………………………………………………………195

7.3.3　實戰範例—爭奇鬥艷的鮮花 ……………………………………………………196

7.4　按鈕元件…………………………………………………………………………………198

7.4.1　實戰範例—變色按鈕 ……………………………………………………………198

7.4.2　實戰範例—文字按鈕 ……………………………………………………………201

7.4.3　實戰範例—透明按鈕 ……………………………………………………………202

7.4.4　實戰範例—放電按鈕 ……………………………………………………………203

7.5　管理、使用【庫】 ………………………………………………………………………206

7.5.1　【庫】面板簡介 ………………………………………………………………………206

7.5.2　管理元件 ……………………………………………………………………………207

7.5.3　外部庫 ………………………………………………………………………………209

7.6　本章小結…………………………………………………………………………………210

7.7　本章習題…………………………………………………………………………………210

7.8　上機練習和指導…………………………………………………………………………211

7.8.1　小鳥飛入 ……………………………………………………………………………211

7.8.2　動態按鈕 ……………………………………………………………………………212

第8章　基於對象的補間動畫 ……………………………………………213

8.1　創建對象補間動畫………………………………………………………………………213

8.1.1　創建對象補間動畫的方法 …………………………………………………………213

8.1.2　對補間範圍進行操作 ………………………………………………………………218

8.1.3　創建對象補間的基本規則 …………………………………………………………220

8.1.4　實戰範例—跳躍的足球 …………………………………………………………222

8.2　使用“動畫編輯器” ……………………………………………………………………224

8.2.1　“動畫編輯器”面板簡介 ……………………………………………………………224

Animate動畫製作實用教程（微課視頻版）

8.2.2　應用“動畫編輯器”面板編輯動畫 ………………………………………………225

8.2.3　編輯屬性曲線的形狀 ………………………………………………………………229

8.2.4　實戰範例—汽車廣告 ……………………………………………………………231

8.3　動畫預設…………………………………………………………………………………238

8.3.1　使用動畫預設 ………………………………………………………………………238

8.3.2　實戰範例—文字動畫特效 ………………………………………………………239

8.4　本章小結…………………………………………………………………………………243

8.5　本章習題…………………………………………………………………………………243

8.6　上機練習與指導…………………………………………………………………………244

8.6.1　補間動畫應用—網絡廣告 ………………………………………………………244

8.6.2　“動畫編輯器”的應用—電話來了 ………………………………………………246

8.6.3　預設動畫的應用—文字廣告 ……………………………………………………247

第9章　Animate CC高級動畫製作 ……………………………………249

9.1　遮罩動畫…………………………………………………………………………………249

9.1.1　實戰範例—圖片切換 ……………………………………………………………249

9.1.2　實戰範例—電池掉電 ……………………………………………………………252

9.1.3　實戰範例—流動的光線 …………………………………………………………254

9.2　3D動畫 …………………………………………………………………………………257

9.2.1　影片剪輯的3D變換 ………………………………………………………………257

9.2.2　透視角度和消失點 …………………………………………………………………259

9.2.3　實戰範例—旋轉立方體 …………………………………………………………261

9.3　骨骼動畫…………………………………………………………………………………266

9.3.1　關於骨骼動畫 ………………………………………………………………………266

9.3.2　創建骨骼動畫 ………………………………………………………………………267

9.3.3　設置骨骼動畫屬性 …………………………………………………………………270

9.3.4　製作形狀骨骼動畫 …………………………………………………………………274

9.3.5　實戰範例—飛翔 …………………………………………………………………275

9.4　場景動畫…………………………………………………………………………………278

9.4.1　製作場景動畫 ………………………………………………………………………278

9.4.2　實戰範例—遠眺 …………………………………………………………………285

9.5　本章小結…………………………………………………………………………………288

9.6　本章習題…………………………………………………………………………………288

9.7　上機練習和指導…………………………………………………………………………289

9.7.1　遮罩動畫應用—捲軸畫 …………………………………………………………289

9.7.2　3D動畫應用—3D文字特效 ……………………………………………………290

9.7.3　3D動畫應用—翻書效果 …………………………………………………………291

目錄

9.7.4　骨骼動畫應用—搖曳 ……………………………………………………………292

9.7.5　骨骼動畫應用—人物行走 ………………………………………………………292

9.7.6　場景動畫應用—騎自行車 ………………………………………………………293

第10章　Animate CC的多媒體功能 ……………………………………295

10.1　聲音在動畫中的應用 …………………………………………………………………295

10.1.1　將聲音導入動畫 ……………………………………………………………………295

10.1.2　聲音屬性的設置和編輯 ……………………………………………………………296

10.1.3　壓縮聲音 ……………………………………………………………………………301

10.1.4　實戰範例—音樂按鈕 ……………………………………………………………304

10.2　視頻在動畫中的應用 …………………………………………………………………308

10.2.1　Animate CC視頻格式簡介 ………………………………………………………308

10.2.2　實戰範例—嵌入視頻 ……………………………………………………………309

10.2.3　實戰範例—漸進式下載播放外部視頻 …………………………………………314

10.3　本章小結 ………………………………………………………………………………319

10.4　本章習題 ………………………………………………………………………………319

10.5　上機練習和指導 ………………………………………………………………………320

10.5.1　聲音和動畫的同步效果 ……………………………………………………………320

10.5.2　3D影視牆 …………………………………………………………………………322

第11章　Animate CC的交互動畫 ………………………………………323

11.1　ActionScript 3.0開發環境 ……………………………………………………………323

11.1.1　ActionScript的首選參數設置 ……………………………………………………323

11.1.2　【動作】面板 ………………………………………………………………………325

11.1.3　使用代碼向導 ………………………………………………………………………327

11.1.4　使用【代碼片段】面板 ……………………………………………………………329

11.1.5　實戰範例—用代碼控制飛鳥飛行 ………………………………………………330

11.2　瞭解ActionScript 3.0 …………………………………………………………………333

11.2.1　認識類和對象 ………………………………………………………………………333

11.2.2　認識事件 ……………………………………………………………………………339

11.3　ActionScript 3.0應用範例 ……………………………………………………………340

11.3.1　應用範例1—文字的鼠標跟隨效果 ……………………………………………341

11.3.2　應用範例2—時鐘 ………………………………………………………………345

11.3.3　實戰範例3—用鼠標拖動圖片 …………………………………………………347

11.3.4　實戰範例4—用鍵盤控制對象的移動 …………………………………………348

11.3.5　實戰範例5—簡易音樂播放器 …………………………………………………350

11.4　本章小結 ………………………………………………………………………………353

Animate動畫製作實用教程（微課視頻版）

11.5　本章習題 ………………………………………………………………………………353

11.6　上機練習和指導 ………………………………………………………………………354

11.6.1　隨鼠標跳動的小球 …………………………………………………………………354

11.6.2　用鼠標控制的旋轉文字 ……………………………………………………………355

11.6.3　下雪動畫效果 ………………………………………………………………………357