- 1 -
投影片 1 動畫播放
1 開啟「補間動畫.fla」檔。
2 若要檢視Flash動畫，可參照以下任一方式：
使用滑鼠來拖曳「時間軸線」來逐格檢視。
執行「控制 /播放」（Enter）：此時播放的影片速度不等於最後瀏覽者所看到的速度；且影片中若更互動部份（例：按鈕）則無法產生作用。
執行「控制 /測試影片」（Ctrl +Enter）：使用Flash Player來播放動畫，此測試方式較為準確。
執行「檔案 /發佈預覽 /預設」（F12）：使用網頁瀏覽器來預覽Flash動畫，此方式可摸擬最後影片發佈的效果。
投影片 2 移動影格
3 使用滑鼠先「點選」時間軸內的關鍵影格30，再「拖曳」此關鍵影格至影格15；如此猴子變成必頇在15個影格內（一秒）從舞台右側移動到左側，因此移動速度會加快。
若直接在影格上使用滑鼠拖曳則會變成反白影格，而無法移動關鍵影格。
4 接著，重複上步驟來將關鍵影格60拖曳至影格30：如此猴子在影格30之後便會在原地不動。
投影片 3 縮短動畫
5 在時間軸反白猴子圖層影格31之後的所更影格，再執行「右鍵 /移除影格」：如此猴子至影格31之後就會消失不見。
若要刪除關鍵影格，可在時間軸內點選關鍵影格後執行「右鍵 /清除關鍵影格」。
6 最後，利用滑鼠拖曳方式反白「草」及「背景」圖層內影格30之後的影格，並執行「右鍵 /移除影格」來縮短整個動畫。
投影片 4 延長影片
7 （方式一）在猴子圖層的影格40執行「右鍵 /插入影格」（快速鍵F5）：如此猴子至影格31之後仍會停留在舞台上，但不會移動位置。
8 （方式二）點選猴子圖層的關鍵影格30，並拖曳至影格40；如此猴子由左向右移動時會變得較慢。
若要使猴子來回均為等速移動，可在時間軸內將關鍵影格15拖曳至影格20。
9 將猴子影格延長後，接著再至草與背景圖層的「影格40」中按下鍵盤的F5來補齊影格。
投影片 5 Flash動畫製作流程（方式一）
10 (1) 在舞台上繪製圖案。
11 (2) 將圖案執行「修改 /轉換成元件」。
12 (3) 將舞台上的實體新增關鍵影格來製作動畫。
投影片 6 Flash動畫製作流程（方式二）
13 (1) 執行「插入 /新增元件」：並在元件編輯模式內繪製圖案。
14 (2) 將製作好的元件從元件庫拖曳至舞台以成為實體。
15 (3) 替舞台上的實體新增關鍵影格來製作動畫。 投影片 7 簡易補間動畫製作
16 在時間軸左下角點選「插入圖層」按鈕。
17 在新圖層名稱上按兩下滑鼠左鍵，並重新命名為「雲」；接著將此圖層拖曳至猴子圖層之下（仍保持雲圖層為選取狀態）。
18 啟用「橢圓形工具」，將填色設為白色、筆畫為無；在舞台內繪製多個重疊的橢圓形來做為雲朵圖案。
19 使用選取工具點選雲朵，並執行「修改 /轉換成元件」：在對話框內名稱設為「雲朵」，類型設為「圖像」，按「確定」（接續下頁…）。
投影片 8 簡易補間動畫製作
20 使用「選取工具」在舞台內點選雲朵實體，並將其拖曳至舞台左側之外。
21 在時間軸雲圖層的影格40執行「右鍵 /插入關鍵影格」（快速鍵F6）；接著再使用選取工具將雲朵實體拖曳至舞台的右側之外。
22 最後，將滑鼠游標移至雲圖層影格1-40之間的任意一個影格，並執行「右鍵 /建立移動補間動畫」。
若要移除補間動畫，可在雲圖層的影格1-40之間執行「右鍵 /移除補間動畫」。
投影片 9 複製影格
23 在時間軸內將雲圖層的關鍵影格40拖曳至影格120來延長動畫。
- 2 -
若要在時間軸中一次顯示較多的影格，可在時間軸右上角點選選單按鈕，並設為「較小」選項。
24 在時間軸點選猴子圖層的圖層名稱來全選此圖層影格，再至影格上方執行「右鍵 /複製影格」。
25 接著，點選猴子圖層的影格41，執行「右鍵 /貼上影格」；完畢後再點選影格81，執行「右鍵 /貼上影格」來將猴子動畫延長至影格120。
26 最後，在草與背景圖層的影格120位置執行「右鍵 /插入影格」（快速鍵F5）來補齊影格。
投影片 10 發佈設定
27 執行「檔案 /發佈設定」，在對話框內可設定Flash動畫發佈的檔案格式：
Flash：輸出為swf格式，此格式可內嵌動畫至網頁內。
HTML：可配合swf檔一同發佈，以便在網頁瀏覽器內測試Flash動畫。
GIF：勾選後可切換至GIF標籤，再勾選「動畫」選項來將動畫輸出成GIF圖檔。
JPEG：將目前影格的影像匯出為圖檔。
PNG：將目前影格的影像匯出為圖檔。
Windows 放映檔：此類型的檔案不需要Flash Player也可以獨立播放。
28 設定完畢後，在對話框內按下「發佈」按鈕即可產生指定格式的檔案（或執行「檔案 /發佈」）。
畫投影片 11 透明度動
29 開啟「太空猴.fla」檔。
30 開啟元件庫，並將「太空猴」元件拖曳至舞台之右側。
31 在時間軸內的影格30執行「右鍵 /插入關鍵影格」（快速鍵F6）；接著再選取「背景」圖層，並在影格30執行「右鍵 /插入影格」（快速鍵F5）。
32 點選太空猴圖層的關鍵影格30，並在舞台內按住Shift鍵拖曳猴子實體至舞台的左側。
33 最後，將游標移至太空猴圖層的影格1-30之間，並執行「右鍵 /建立移動補間動畫」（接續下頁…）。
投影片 12 透明度動畫
34 在太空猴圖層的影格60按F6插入「關鍵影格」，並在影格30-60之間執行「右鍵 /建立移動補間動畫」。
35 在時間軸內選取背景圖層，並在影格60按F5來插入一般影格。
36 點選太空猴圖層的關鍵影格60，再至舞台內點選猴子實體；接著在屬性面板的顏色下拉選單中將Alpha值設為0，如此猴子實體會變為透明的狀態。
37 在太空猴圖層的影格35按F6插入關鍵影格；接著在舞台內點選猴子實體，並在屬性面板的顏色下拉選單選取「亮度」，同時將數值調至100%來將猴子實體轉為白色。
投影片 13 動畫變速
38 點選太空猴圖層的關鍵影格1；在「屬性面板」內可針對動畫設定加、減速效果。
若將加/減速滑桿向上調為100（在外），則猴子在動畫結束時會更「減速」效果。
若將加/減速滑桿向下調為 -100（在內），則猴子在動畫開始時會更「加速」效果。
投影片 14 進階變速設定
39 在Flash 8可針對補間動畫的加、減速進行進階設定；在屬性面板內點選「編輯」便可開啟動畫曲線圖，在曲線上可利用滑鼠拖曳來加強加速或減速之效果。
橫向座標單位：時間（單位：影格）
縱向座標單位：補間動畫的完成百分比。
40 若要將動畫曲線還原為直線狀態（即等速運動），則可在對話框內按下「重設」按鈕。
投影片 15 動態模糊效果
41 執行「檔案 /回復至上次儲存」。
42 在元件庫內選取太空猴元件，並執行「右鍵 /類型」：在子選單中點選「影片片段」。
43 將太空猴從元件庫拖曳舞台之右側，並在時間軸依序在影格20與影格60按F6插入關鍵影格；完畢後在時間軸內選取背景圖層，並在影格60按F5來插入一般影格。
44 點選太空猴圖層的關鍵影格60，並在舞台內按
- 3 -
住Shift鍵拖曳猴子實體至舞台的左側；接著在影格20-60之間執行「右鍵 /建立移動補間動畫」（接續下頁…）。
投影片 16 動態模糊效果
45 點選太空猴圖層的關鍵影格20，並在屬性面板內將加減速設為100。
此處可按「編輯」按鈕來加強變速效果。
46 在太空猴圖層的影格21按F6插入關鍵影格。
47 在舞台內點選太空猴實體，並在屬性面板切換至濾鏡標籤：按「+」號按鈕來新增模糊濾鏡。
48 在「+」號按鈕右側先點選上鎖圖示來解除「等比例」，並將模糊X、Y值設為45和0；品質選單則設為「高」。
49 最後，按Enter來在舞台內測試動畫效果。
投影片 17 註冊點設定
50 開啟「搖頭猴.jpg」檔。
51 使用選取工具在舞台內框選猴子的頭部，並執行「修改 /轉換成元件」：在對話框的名稱欄鍵入「頭」，類型設為「圖像」，註冊點設在正下方，按「確定」。
52 確認猴子的頭部仍為選取狀態；在工具箱啟用「自由變形工具」，並在猴子頭部中央的圓點按兩下滑鼠左鍵；如此該圓點會自動移至註冊點上（接續下頁…）。
投影片 18 頭部搖晃動畫
53 依序在頭圖層的影格10、20、30、40按鍵盤的F6來插入關鍵影格。
54 在時間軸點選頭圖層的影格10，在舞台內使用自由變形工具將猴子的頭略做逆時針旋轉；接著點選頭圖層的影格30，並在舞台內使用自由變形工具將猴子的頭略做順時針旋轉。
55 在時間軸點選頭圖層的圖層名稱（如此可全選該圖層影格）；接著在影格內執行「右鍵 /建立移動補間動畫」。
56 最後，反白左手、右手及背景圖層的影格40，並按F5來補齊一般影格。設定完畢後按Enter鍵來測試動畫。
投影片 19 翹翹板動畫
57 開啟「翹翹板.fla」檔。
58 在工具箱啟用「自由變形工具」，在舞台內將翹翹板中央的圓點拖曳至翹翹板的軸心上。
59 在時間軸選點魚圖層，並依序在影格15, 30, 37, 60按F6插入關鍵影格。
60 點選魚圖層的影格15，並利用「自由變形工具」將翹翹板向左旋轉，使其左下角的端點觸及舞台下邊框；接著點選魚圖層的影格37，再將翹翹板向右旋轉，使其右下角的端點觸及舞台下邊框（接續下頁…）。
投影片 20 翹翹板動畫
61 在時間軸點選魚圖層的圖層名稱，並在影格內執行「右鍵 /建立移動補間動畫」。
62 在時間軸選點魚圖層的關鍵影格1，並在屬性面板內將「加/減速」欄設為-100以產生加速下墜效果。
63 接著，再將關鍵影格30的加/減速欄設為-100。
投影片 21 圖層註解
64 在時間軸左下角點選「插入圖層」按鈕，並命名為「註解」；接著點選此圖層的影格1，並在屬性面板的影格標籤欄鍵入「//加減速欄設為-100」。
65 在註解圖層的影格30處按F6來插入關鍵影格，並同樣在屬性面板的影格標籤欄鍵入與影格1相同的註解文字。
投影片 22 簡易影格動畫
66 在時間軸內將所更隱藏的圖層設為顯示狀態（點選圖層的眼睛圖示）。
67 在時間軸選點猴子圖層，並依序在影格15, 30, 37, 60按F6插入關鍵影格。
68 點選猴子圖層的影格15，並使用選取工具來將猴子移至魚的頭上；接著再將影格37的猴子同樣移至魚的頭上。
69 在時間軸點選猴子圖層的圖層名稱，並在影格內執行「右鍵 /建立移動補間動畫」。
70 在時間軸選點猴子圖層的關鍵影格1，並在屬性面板內將「加/減速」欄設為-100；接著再將關鍵影格30的加/減速欄同樣設為-100（接續下頁…）。
- 4 -
投影片 23 簡易影格動畫
71 在時間軸選點猴子圖層，並依序在影格36、38、39、40按F6插入關鍵影格。
72 在時間軸選點猴子圖層關鍵影格37（翹翹板落地之影格）；接著在舞台內點選猴子實體，並使用自由變形工具按住Alt鍵來向下拖曳猴子的上邊框，使猴子略為變矮。
73 選點猴子圖層關鍵影格39，並使用自由變形工具按住Alt鍵來向上拖曳猴子實體的上邊框，使猴子略為變高。
74 最後，按Ctrl +Enter來測試整個翹翹板動畫。
沒有留言:
張貼留言