Animate CC 簡易半側面人物走路動畫

2020/02/13閱讀時間約 1 分鐘
對於人物角色的走路動作,首先介紹最輕易可完成的半側面角度,這個角度的動作姿勢是最好表現的,只要準備好角色各肢體的獨立元件,搭配變形中心與傳統補間動畫即可完成。
目標動畫效果:應用影片片段元件表現角色人物的走路,除了元件的準備與安排來表現動作之外,將以傳統補間動畫製作肢體的動作,讓動作更為流暢。
使用動畫技巧:影片片段元件、傳統補間動畫、變形中心。
Step1.
範例檔元件庫中的人物元件,包括頭、手與腳均是以獨立元件與圖層來組合起來。首先進入到人物影片片段元件內,即可看到所有的肢體元件均已分散至個別獨立圖層上。
Step2.
使用自由變形工具來改變每個元件製作動畫時需要的變形中心點位置,頭於下巴處、二隻手均於與身體連接處、花於與左手相接處,二隻腳的變形重心請移至約為身體中央處,好讓腳的旋轉更自然。接著影子圖層於影格24插入影格,其餘圖層於影格6、11、14、19、24插入關鍵影格,準備開始調整走路時的各元件角度。
Step3.
使用自由變形工具依序旋轉調整每個關鍵影格上各元件,於走路時所該呈現的角度,影格6與19上保持原站姿不動。
除了影子外,建立影格1-11與14-24間的傳統補間動畫,影格11-14間的安排是要讓該姿勢稍作停留,因此不建立傳統補間動畫。
Step4.
最後回到場景上新增人物圖層於背景圖層之上,置入人物元件於右側場景之外,於影格300處插入關鍵影格,移動人物元件至左側場景之外,建立傳統補間動畫,背景圖層於影格300處插入影格,完成此範例。
相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果
為什麼會看到廣告
哩老師
哩老師
現職:精誠資訊 恆逸教育訓練中心 專任多媒體設計 資深講師 專長:精通多媒體網頁視覺設計、平面設計與多媒體整合應用、Photoshop影像處理、網站視覺設計、Illustrator向量繪圖、Animate動畫效果設計、Dreamweaver網頁互動效果、Dreamweaver資料庫整合及RWD等。
留言0
查看全部
發表第一個留言支持創作者!