Transcript 第3課 flash如何動起來

第3課 flash如何動起來
•
•
•
•
•
•
•
•
關鍵影格、空白影格
逐格動畫
移動補間動畫
時間軸特效
形狀補間動畫
導引線動畫
遮色片
淡入淡出
第6週
關鍵影格、空白影格
• 插入關鍵影格：有變化的影格
– 圖形內容不一樣時。（黑點）
• 插入影格：只延長播放時間。
– （白色長方形）
• 空白關鍵影格：尚未繪製內容
– 繪製後變成關鍵影格（白點）
• 複製影格
• 移除影格
• 反轉影格（配合複製影格）
逐格動畫
•
範
例
：
貓
頭
鷹
逐格動畫重點
• 加入關鍵影格，逐格繪製
• 不同的動作需繪製在不同圖層
• 善用圖層鎖定功能，以免破壞
其他圖層
• 描圖紙模式（燈箱模式）
• 反轉影格
移動補間動畫
•
範
例
魚
第8週
移動補間動畫重點
• 口訣：
– 兩個關鍵影格中移動補間隔。
• 需建立兩個關鍵影格，並在其
中建立移動補間隔動畫。
• 前後關鍵影格，圖形需不同位
置
時間軸特效
•
範
例
：
嘴
第7週
時間軸特效
/特效
• 插入/時間軸特效/特效
時間軸特效
變形/轉場
• 插入/時間軸特效/變形/轉場
考試
• 利用逐格動畫及時間軸特效編
製動畫
形狀補間動畫
•
範
例
形
狀
補
間
第 11、12 週
形狀補間動畫重點
• 先繪製一個無框的三角形。
• 在第20格插入關鍵影格，將原
先的三角形刪除，在繪製一個
無框的圓形。
• 在兩個關鍵影格中建立形狀補
間動畫。
形狀補間動畫範例二
•
範
例
形
狀
形狀補間動畫範例二
• 利用修改/群組與打散功能。
• 分別繪製後使用群組整合為
一。
• 形狀補間動畫實需打散成為形
狀物件
導引線動畫
•
範
例
導
引
線
第 10 週
導引線動畫重點
• 在魚的圖層先完成移動補間動畫
• 在魚的圖層按右鍵增加導引線。
• 在導引線圖層利用鉛筆繪製移動的軌
跡。
• 在影格1，利用貼齊物件功能，將魚
吸附在導引線上。
• 在魚圖層第30格位置將圖形貼齊導引
線末端。
考試
• 移動補間動畫
• 導引線動畫
第 13 週
猜猜我是誰
遮色片
• 方法一：
• 先匯入底圖。
• 新增圖層畫圓，背景設定成黑色、
並完成移動補間隔動畫。
• 在新增的圖層按右鍵設定成遮色
片。
• 方法二：
• 匯入底圖，完成移動補間動畫
• 新增圖層畫圓，按右鍵設成遮色片
猜猜我是誰
淡入淡出
•
•
•
•
匯入圖檔
將圖檔轉成圖像元件
設定圖像/顏色/Apha值
設定移動補間動畫
自我反思
• 同學剛接觸如何讓畫動起來，感到有
興趣，不時有讚嘆聲。
• 教導時需掌握動畫的技巧與精神，學
生才能容易學習，例如說：關鍵影格
的意義，何謂移動補間、導引線、形
狀補間，重點為何，需解釋與演示清
楚，學生才能掌握學習重點，並不易
忘記。
• 需讓學生有充分練習的時間，多操作
幾次，才會更熟練。
• 需結合第二課的繪圖技巧，讓學生自
己覺得有進步。