Animate CC 開心跳躍動畫

【檢視範例】【下載範例】

角色的動作還可以是跳躍的方式，類似球拋物線彈跳的方式來表現角色活潑的跳躍動作，讓角色由場景左上角跳躍至場中央，再跳躍至場景右上角，最後再跳躍回原處，由於動作特別，因此每個身上元件都需要仔細的調整。

目標動畫效果:應用影片片段元件表現可愛的角色跳躍動作，除了元件的準備與安排來表現動作之外，將以傳統補間動畫讓動作更為流暢。
使用動畫技巧:影片片段元件、傳統補間動畫、變形中心。

Step1.
範例檔元件庫中的人物開心跳躍元件，包括頭、手與腳均是以獨立元件與圖層來組合起來。首先進入到開心跳躍影片片段元件內，即可看到所有的肢體元件均已分散至個別獨立圖層上，元件內的參考線位置即是依照場景尺寸所建立，也就是場景範圍。

Step2.
使用自由變形工具來改變每個元件製作動畫時需要的變形中心點位置，頭於下巴處、二隻手與二隻腳均於與身體連接處。為所有圖層於影格13、15、17、30插入關鍵影格，準備開始調整跳躍時的各元件。

Step3.
首先暫時鎖定影子圖層，再依序調整影格13、15、17三個位置上的動作，使用移動與旋轉來調整元件姿勢。

接著複製影格13上所有關鍵影格至影格1上，並全選所有元件一起移動至左上角參考線交叉處之外；複製影格17上所有關鍵影格至影格30上，並全選所有元件一起移動至右上角參考線交叉處之外。

Step4.
解除影子圖層鎖定，繼續設定影子的位置、尺寸與半透明：

於影格40為所有圖層插入關鍵影格，選取所有影格17上的關鍵影格複製至影格53、選取所有15上的關鍵影格複製至影格55、選取所有13上的關鍵影格複製至影格57、選取所有1上的關鍵影格複製至影格70，均建立傳統補間動畫，設定影格1-13與影格40-53加減速：-50，設定影格17-30與影格57-70加減速：50，完成此範例。

相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果