Animate CC 動物簡易可愛跑步動畫

更新 發佈閱讀 2 分鐘
raw-image

檢視範例】【下載範例

對於動物跑步較複雜之處是在四隻腳的動作表現上,包括跑步時的腳彎曲,是不易以補間動畫表現的,因此需藉由預先準備的彎曲腳元件來替換,由於是不同的元件替換,因此僅能以逐格動畫來表現。

目標動畫效果:應用影片片段元件表現可愛動物四隻腳的簡易跑步,除了元件的準備與安排表現動作之外,適時的替換腳彎曲元件將是動畫關鍵。
使用動畫技巧:影片片段元件、逐格動畫、變形中心、替換元件。

Step1.
範例檔元件庫中包含了所有動物的各個元件,其中腳的部分是只有直的與彎曲的腳。

raw-image

首先進入到馬動作元件內,更改各元件變形中心至與身體連接處(頭、腳、尾巴),接著為所有圖層(影子圖層除外)於影格6、9、14、17處插入關鍵影格,所有圖層於影格21插入影格。

raw-image

Step2.
依序設定影格6、9、14、17上的馬姿勢,並注意需要替換的元件:

raw-image
raw-image
raw-image
raw-image

Step3.
最後回到場景上,新增馬圖層於花草之下,置入馬動作於左側場景之外,於影格240插入關鍵影格,移動馬動作元件至右側場景外,建立傳統補間動畫,其餘圖層於影格240處插入影格完成此範例。

raw-image

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

留言
avatar-img
留言分享你的想法!
avatar-img
哩老師的沙龍
29會員
129內容數
多媒體設計的專業能力養成過程,除了有效率學習軟體之外,更重要的是各個軟體間的整合應用! Photoshop、Illustrator、Dreamweaver、Animate、CSS、Bootstrap響應式網頁等,相關的整合應用有機會皆會與大家分享喔~
哩老師的沙龍的其他內容
2020/02/13
Q版人物通常都是頭大、手短、腳短,因此在跑步時的動作步伐比較小,同樣需要注意手腳與身體元件的配合,搭配傳統補間動畫即可確保跑步動作的流暢。 目標動畫效果:應用影片片段元件表現可愛人物的跑步動作,除了元件的準備與安排來表現動作之外,以傳統補間動畫讓動作更為流暢。 使用動畫技
Thumbnail
2020/02/13
Q版人物通常都是頭大、手短、腳短,因此在跑步時的動作步伐比較小,同樣需要注意手腳與身體元件的配合,搭配傳統補間動畫即可確保跑步動作的流暢。 目標動畫效果:應用影片片段元件表現可愛人物的跑步動作,除了元件的準備與安排來表現動作之外,以傳統補間動畫讓動作更為流暢。 使用動畫技
Thumbnail
2020/02/13
對於是以相片人物來製作動畫時,當然必需要在Photoshop中事先處裡好每個元件細節,然後再正確匯入Animate中來完成動畫,同樣是需要注意元件變形中心與動畫動作的設定。 目標動畫效果:應用影片片段元件表現以影像為素材的人物動畫,需注意匯入檔案的正確方式,除了元件的準備
Thumbnail
2020/02/13
對於是以相片人物來製作動畫時,當然必需要在Photoshop中事先處裡好每個元件細節,然後再正確匯入Animate中來完成動畫,同樣是需要注意元件變形中心與動畫動作的設定。 目標動畫效果:應用影片片段元件表現以影像為素材的人物動畫,需注意匯入檔案的正確方式,除了元件的準備
Thumbnail
2020/02/13
接著將介紹更為細膩的角色跑步動畫,細膩處即是手與腳都各分為二部分,因此無論是各元件的調整與設定都需要更仔細,否則將有元件中途分開的問題。 目標動畫效果:應用影片片段元件表現線條人物的的跑步,除了元件的準備與安排來表現動作之外,手與腳的部分均以二元件組成,所有元件將以傳統補
Thumbnail
2020/02/13
接著將介紹更為細膩的角色跑步動畫,細膩處即是手與腳都各分為二部分,因此無論是各元件的調整與設定都需要更仔細,否則將有元件中途分開的問題。 目標動畫效果:應用影片片段元件表現線條人物的的跑步,除了元件的準備與安排來表現動作之外,手與腳的部分均以二元件組成,所有元件將以傳統補
Thumbnail
看更多
你可能也想看
Thumbnail
透過蝦皮分潤計畫,輕鬆賺取零用金!本文分享5-6月實測心得,包含數據流程、實際收入、平臺優點及注意事項,並推薦高分潤商品,教你如何運用空閒時間創造被動收入。
Thumbnail
透過蝦皮分潤計畫,輕鬆賺取零用金!本文分享5-6月實測心得,包含數據流程、實際收入、平臺優點及注意事項,並推薦高分潤商品,教你如何運用空閒時間創造被動收入。
Thumbnail
單身的人有些會養寵物,而我養植物。畢竟寵物離世會傷心,植物沒養好再接再厲就好了~(笑)
Thumbnail
單身的人有些會養寵物,而我養植物。畢竟寵物離世會傷心,植物沒養好再接再厲就好了~(笑)
Thumbnail
不知你有沒有過這種經驗?衛生紙只剩最後一包、洗衣精倒不出來,或電池突然沒電。這次一次補貨,從電池、衛生紙到洗衣精,還順便分享使用心得。更棒的是,搭配蝦皮分潤計畫,愛用品不僅自己用得安心,分享給朋友還能賺回饋。立即使用推薦碼 X5Q344E,輕鬆上手,隨時隨地賺取分潤!
Thumbnail
不知你有沒有過這種經驗?衛生紙只剩最後一包、洗衣精倒不出來,或電池突然沒電。這次一次補貨,從電池、衛生紙到洗衣精,還順便分享使用心得。更棒的是,搭配蝦皮分潤計畫,愛用品不僅自己用得安心,分享給朋友還能賺回饋。立即使用推薦碼 X5Q344E,輕鬆上手,隨時隨地賺取分潤!
Thumbnail
身為一個典型的社畜,上班時間被會議、進度、KPI 塞得滿滿,下班後只想要找一個能夠安靜喘口氣的小角落。對我來說,畫畫就是那個屬於自己的小樹洞。無論是胡亂塗鴉,還是慢慢描繪喜歡的插畫人物,那個專注在筆觸和色彩的過程,就像在幫心靈按摩一樣,讓緊繃的神經慢慢鬆開。
Thumbnail
身為一個典型的社畜,上班時間被會議、進度、KPI 塞得滿滿,下班後只想要找一個能夠安靜喘口氣的小角落。對我來說,畫畫就是那個屬於自己的小樹洞。無論是胡亂塗鴉,還是慢慢描繪喜歡的插畫人物,那個專注在筆觸和色彩的過程,就像在幫心靈按摩一樣,讓緊繃的神經慢慢鬆開。
Thumbnail
散步時來到彩虹輪狀跑道練習場,看到小朋友在晃晃走路都還搖搖晃晃的時候,就已經可以開始練習滑步車了,樣子真是可愛極了。滑步車的練習可以幫助小朋友鍛鍊平衡感、協調性和肌肉力量,為日後學習騎自行車打下基礎。 這個大人這一直繞著到這整個場地不斷的來回溜著,看起來好瀟灑。不過也替旁邊騎小車子的小朋友擔心,萬
Thumbnail
散步時來到彩虹輪狀跑道練習場,看到小朋友在晃晃走路都還搖搖晃晃的時候,就已經可以開始練習滑步車了,樣子真是可愛極了。滑步車的練習可以幫助小朋友鍛鍊平衡感、協調性和肌肉力量,為日後學習騎自行車打下基礎。 這個大人這一直繞著到這整個場地不斷的來回溜著,看起來好瀟灑。不過也替旁邊騎小車子的小朋友擔心,萬
Thumbnail
CG人物也會跳肚皮舞? 看看她如何跳! 〈3d構圖渲染〉CG人物在空靈城前跳起了肚皮舞了… 以上內容如果喜歡的話,也可以點擊收看完整 短片動畫喔~ 好了以上就是今天分享的內容,作品全部屬於自己繪制後再制作成動畫的 ,純屬不易 ,請多多點贊支持喔,如果喜歡我的作品,請記得追蹤我~~
Thumbnail
CG人物也會跳肚皮舞? 看看她如何跳! 〈3d構圖渲染〉CG人物在空靈城前跳起了肚皮舞了… 以上內容如果喜歡的話,也可以點擊收看完整 短片動畫喔~ 好了以上就是今天分享的內容,作品全部屬於自己繪制後再制作成動畫的 ,純屬不易 ,請多多點贊支持喔,如果喜歡我的作品,請記得追蹤我~~
Thumbnail
除了控制場景上時間軸的影格播放外,更可以控制影片片段元件內時間軸的播放,因此只要影片片段元件安排得當,並正確加上元件實體名稱,就可以做出更有互動性的動畫內容控制安排,請注意在程式碼中需正確完整撰寫由場景至每個影片片段元件的順序。 STEP1. 範例檔中已完成摩托車的動畫
Thumbnail
除了控制場景上時間軸的影格播放外,更可以控制影片片段元件內時間軸的播放,因此只要影片片段元件安排得當,並正確加上元件實體名稱,就可以做出更有互動性的動畫內容控制安排,請注意在程式碼中需正確完整撰寫由場景至每個影片片段元件的順序。 STEP1. 範例檔中已完成摩托車的動畫
Thumbnail
角色的動作還可以是跳躍的方式,類似球拋物線彈跳的方式來表現角色活潑的跳躍動作,讓角色由場景左上角跳躍至場中央,再跳躍至場景右上角,最後再跳躍回原處,由於動作特別,因此每個身上元件都需要仔細的調整。 目標動畫效果:應用影片片段元件表現可愛的角色跳躍動作,除了元件的準備與安排
Thumbnail
角色的動作還可以是跳躍的方式,類似球拋物線彈跳的方式來表現角色活潑的跳躍動作,讓角色由場景左上角跳躍至場中央,再跳躍至場景右上角,最後再跳躍回原處,由於動作特別,因此每個身上元件都需要仔細的調整。 目標動畫效果:應用影片片段元件表現可愛的角色跳躍動作,除了元件的準備與安排
Thumbnail
可愛版的動物走路,最大特色是在於腳的部分將省略因走路而彎曲的動作,而是以短比例的腳來表現可愛風格,所以仍然需要注意走路時腳元件的調整。 目標動畫效果:應用影片片段元件表現可愛動物四隻腳的走路,除了元件的準備與安排來表現動作之外,將以傳統補間動畫讓動作更為流暢。 使用動畫技
Thumbnail
可愛版的動物走路,最大特色是在於腳的部分將省略因走路而彎曲的動作,而是以短比例的腳來表現可愛風格,所以仍然需要注意走路時腳元件的調整。 目標動畫效果:應用影片片段元件表現可愛動物四隻腳的走路,除了元件的準備與安排來表現動作之外,將以傳統補間動畫讓動作更為流暢。 使用動畫技
Thumbnail
對於動物跑步較複雜之處是在四隻腳的動作表現上,包括跑步時的腳彎曲,是不易以補間動畫表現的,因此需藉由預先準備的彎曲腳元件來替換,由於是不同的元件替換,因此僅能以逐格動畫來表現。 目標動畫效果:應用影片片段元件表現可愛動物四隻腳的簡易跑步,除了元件的準備與安排表現動作之外,
Thumbnail
對於動物跑步較複雜之處是在四隻腳的動作表現上,包括跑步時的腳彎曲,是不易以補間動畫表現的,因此需藉由預先準備的彎曲腳元件來替換,由於是不同的元件替換,因此僅能以逐格動畫來表現。 目標動畫效果:應用影片片段元件表現可愛動物四隻腳的簡易跑步,除了元件的準備與安排表現動作之外,
Thumbnail
在交通工具中,就屬腳踏車動畫的細節最多,因為除了輪子的轉動外,人物角色二隻腳來踩動腳踏車踏板是最需要注意動畫細節的,其中包括雙腳的動作與踏板的旋轉,雙腳動作需注意變形中心與補間動畫的應用,踏板的旋轉即是要依靠導引線來控制繞圈旋轉,最後搭配場景上場景元件的移動,即可完成騎腳
Thumbnail
在交通工具中,就屬腳踏車動畫的細節最多,因為除了輪子的轉動外,人物角色二隻腳來踩動腳踏車踏板是最需要注意動畫細節的,其中包括雙腳的動作與踏板的旋轉,雙腳動作需注意變形中心與補間動畫的應用,踏板的旋轉即是要依靠導引線來控制繞圈旋轉,最後搭配場景上場景元件的移動,即可完成騎腳
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News