飛翔蜻蜓 - 移動導引線動畫

　動畫搶先看本章作品透過導引線功能，讓主角：蜻蜓依循繪製的行進路線自由飛翔。一開始蜻蜓由左側飛入，盤旋在下方；接著在第四秒由左側另外飛入的蜻蜓，與第五秒由右上方飛入的蜻蜓，交會並盤旋在天空，並在第二十秒及第三十秒所有蜻蜓飛出舞台，結束動畫。

動態效果

元件角色此範例元件庫內的元件主要是協助作品：美化設計、傳統補間動畫製作、導引線建置 ... 等動作，分為以下二大類：

舞台佈置元件 影片片段相關元件

製作流程

　製作傳統補間動畫傳統補間動畫是在運用 移動導引線 功能前，一個移動動畫的基礎建置動作，因為唯有產生補間動畫，才可以搭配後續的導引線，有效控制動畫的行進路徑。所以傳統補間動畫與移動導引線二者必須相輔相成、互相配合才可以達到最大功效。

請開啟練習檔 ，以下便依循步驟，先利用 傳統補間動畫 功能為靜止的蜻蜓建立基礎移動效果，讓牠不再「靜悄悄」喔！

此練習檔已於 背景 圖層佈置上動畫的底圖，而後續說明要加入的元件、導引線將會一一設計在其他相關圖層中。

STEP 1 　佈置蜻蜓飛入與飛出的位置STEP 2 　建立傳統補間動畫

　移動導引線的建置

傳統補間動畫所產生的「直線式」路徑，讓動畫在行進上只為單一方向，此節將藉由移動導引線圖層的增加，於其中自行繪製或調整導引線，讓傳統補間動畫可以依循導引線圖層內所繪製的路線自由移動，不再只是單純的平行線。

STEP 1 　新增移動導引線圖層STEP 2 　繪製導引線STEP 3 　將一般圖層轉換成移動導引線圖層

物件的佈置與轉彎效果前面建置了移動導引線，接下來如何讓元件實體的位置與導引線 「緊密接觸」，以充份發揮導引線功能，是本節重點所在，只要一些細部調整，就可以讓元件實體靈活移動，宛如注入生命喔！

STEP 1 　調整元件實體的起迄位置STEP 2 　調整元件實體的大小與角度STEP 3 　讓元件實體沿著路徑角度轉彎

　同個導引線引導多個圖層移動導引線圖層的建立，不單只能影響一個元件實體，倘若遇有數個元件實體要共用一個導引線路徑時，只要透過時間軸上影格設定、物件大小或位置調整 ...等，即使是相同路徑，也可效果大不同。

STEP 1 　現有移動導引線圖層之下再新增一導引線圖層STEP 2 　同個路徑上佈置另一個元件實體的位置STEP 3 　透過影格的調整縮短蜻蜓飛行時間STEP 4 　建立傳統補間動畫STEP 5 　調整元件實體的大小、角度與飛行效果STEP 6 　 測試作品完成結果完成導引線及元件實體的佈置後，請儲存檔案再按 + 鍵，瀏覽整個作品的動態效果。三隻蜻蜓隨著我們所繪製的二條導引線，分別飛翔在天空與草原間。

延伸應用 - 網站歡迎動畫