Animate CC 大自然水滴滴落動畫

更新於 發佈於 閱讀時間約 4 分鐘
raw-image

檢視範例】【下載範例

在大自然的場景下,除了昆蟲與樹葉的動態表現外,樹葉上的露水滴落往往成為動畫的焦點,因此水滴滴落時的動態表現,不同於雨滴,需要更細膩的表現出來。

目標動畫效果:利用影片片段元件與導引線動畫,表現大自然之中的元素動態,包括昆蟲飛舞、葉子晃動、葉上水滴滴落等。
使用動畫技巧:影片片段元件、傳統補間動畫、導引線動畫。

Step1.
範例檔元件庫中的水滴(漸層填色繪製,包含半透明的填色)葉子與小瓢蟲是所需要的簡單素材。首先點取右側的小葉子並轉換為影片片段元件『葉子晃動』,進入葉子晃動元件內,點取葉子再轉換為葉子影片片段元件。

raw-image

Step2.
繼續在葉子晃動元件內,使用變形工具改變形中心至葉子梗的尾端處,並在影格30、60、90插入關鍵影格,設定影格30葉子向左下稍微旋轉、影格60葉子向右上稍微旋轉,建立傳統補間動畫,完成葉子晃動元件。

raw-image

回到場景上,原來的葉子影已經是包含晃動的動作,請直接再複製小葉子並搭配翻轉、旋轉與縮放,另外再安排場景上其他處的小葉子。

Step3.
進到瓢蟲飛元件內,依序個別點取二翅膀與身體轉換為影片片段元件,並分散至圖層(整理圖層順序,刪去空的圖層1),使用變形工具更改二翅膀的變形中心至與身體連接處,二翅膀圖層於影格3與5插入關鍵影格、身體圖層於影格5插入影格,調整影格3上的翅膀成向後收起狀,建立二翅膀圖層傳統補間動畫,完成瓢蟲飛元件。

raw-image

Step4.
回到場景上,新增瓢蟲飛圖層並置入瓢蟲飛元件(略縮小瓢蟲飛元件),在瓢蟲飛圖層於影格90插入關鍵影格並建立傳統補間動畫,點取瓢蟲飛圖層並增加移動導引線圖層,使用鉛筆工具繪製瓢蟲飛路徑,路徑請通過右下角花朵中心處,移動影格1與90上的瓢蟲飛元件使其中心吸附於導引線之上,完成瓢蟲飛導引線動畫。

raw-image

Step5.
再新增瓢蟲圖層於最上方,於影格90插入關鍵影格並置入瓢蟲元件,位置請對齊瓢蟲飛元件的位置,除了瓢蟲飛與導引線圖層外,其他圖層請至影格180處插入影格;移動瓢蟲圖層上的關鍵影格90至影格100、瓢蟲飛圖層至影格99插入關鍵影格插入影格,完成飄蟲停在花上的動作安排。

raw-image

Step6.
點取場景上的大葉子並轉換為影片片段元件『葉子與水滴』,進入葉子與水滴元件內,使用變形工具改葉子中心至梗的末端;新增水滴圖層並置入水滴元件於葉子中央,請旋轉水滴元件成橫向,水滴圖層於影格8、40插入關鍵影格,大葉子圖層請於影格8、46、50、60、70、80插入關鍵影格、120插入影格。

raw-image

Step7.
縮小影格1上的水滴至最小且設定Alpha:0、移動影格40上的水滴至葉子尾端,繼續再於水滴圖層的影格46插入關鍵影格並移動水滴至葉子尖端處,變形旋轉水滴成直向並略拉長,最後於水滴圖層的影格50插入關鍵影格並移動水滴至下方,建立傳統補間動畫。接著設定如下的葉子狀態,並建立影格8-80間的傳統補間動畫。

raw-image
raw-image

Step8.
新增光點圖層於最上方並於影格20插入關鍵影格,置入光點元件並略微縮小尺寸,於影格25、40、45、50插入關鍵影格,依序設定光點屬性:

raw-image
raw-image

最後建立光點圖層上20-50間傳統補間動畫,移除影格50之後的多餘影格完成此範例。

相關課程 : 優勢多媒體 - 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
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
這一天,叮噹在陽台上整理花草,瞥見一隻披著黃色衣裳的大蝴蝶正在花間穿來插去,優雅歡樂地飛舞。 蝴蝶是昆蟲中的美麗大使,但又容易受驚,倘觀賞者動作太大,牠們會拍翼遠飛。於是,叮噹小心翼翼走近蝴蝶,心想近距離觀賞一下就好了。怎料,小蝴蝶多番停下來休息,讓叮噹可以細心觀賞牠的美態,叫人特别興奮! 這一
Thumbnail
這一天,叮噹在陽台上整理花草,瞥見一隻披著黃色衣裳的大蝴蝶正在花間穿來插去,優雅歡樂地飛舞。 蝴蝶是昆蟲中的美麗大使,但又容易受驚,倘觀賞者動作太大,牠們會拍翼遠飛。於是,叮噹小心翼翼走近蝴蝶,心想近距離觀賞一下就好了。怎料,小蝴蝶多番停下來休息,讓叮噹可以細心觀賞牠的美態,叫人特别興奮! 這一
Thumbnail
蝴蝶忽忽而至。它拍動翅膀,宛如不請自來的客人。你不動聲色,凝神屏氣接近。
Thumbnail
蝴蝶忽忽而至。它拍動翅膀,宛如不請自來的客人。你不動聲色,凝神屏氣接近。
Thumbnail
小時候很喜歡看小昆蟲到處跑,心裡一直有疑問他們在做什麼? 為什麼總是這麼忙碌,又要把東西搬去哪裡? 常常在學校的 池塘邊(蝌蚪、蚱蜢、螳螂) 水溝邊(紅蟲) 樹下邊(螞蟻、紅瓢蟲、蚯蚓) 馬路邊(蝴蝶) 山上處(喇牙-會吃害蟲是好生物哦,看到請不要打牠哦!) 天花板處(蜘蛛、不知名小蟲) 後陽台邊(
Thumbnail
小時候很喜歡看小昆蟲到處跑,心裡一直有疑問他們在做什麼? 為什麼總是這麼忙碌,又要把東西搬去哪裡? 常常在學校的 池塘邊(蝌蚪、蚱蜢、螳螂) 水溝邊(紅蟲) 樹下邊(螞蟻、紅瓢蟲、蚯蚓) 馬路邊(蝴蝶) 山上處(喇牙-會吃害蟲是好生物哦,看到請不要打牠哦!) 天花板處(蜘蛛、不知名小蟲) 後陽台邊(
Thumbnail
四月到黃蝶翠谷的水底溪遊玩,雖然河乾,但也相遇很多小生物。在乾枯時節,生物們更需要群聚在避難水潭渡過旱期。是一段走沒有溪的走溪經驗。
Thumbnail
四月到黃蝶翠谷的水底溪遊玩,雖然河乾,但也相遇很多小生物。在乾枯時節,生物們更需要群聚在避難水潭渡過旱期。是一段走沒有溪的走溪經驗。
Thumbnail
【可愛的蟲蟲派對,大展身手】穀雨慶典/活動p2 一起創造的時刻,留下的歡樂畫面, 也有著繽紛的氣息在這時間線裡擴大了心裡的畫面。 不管是蝴蝶、蜘蛛、蚱蜢、螳螂、螞蟻⋯ 還有好多好多奇特的昆蟲, 真的好美! 但背後都有著被分割的時間, 每個人在上班下班中, 都仍有著需要去配合的大小事。 我們會說一聲『
Thumbnail
【可愛的蟲蟲派對,大展身手】穀雨慶典/活動p2 一起創造的時刻,留下的歡樂畫面, 也有著繽紛的氣息在這時間線裡擴大了心裡的畫面。 不管是蝴蝶、蜘蛛、蚱蜢、螳螂、螞蟻⋯ 還有好多好多奇特的昆蟲, 真的好美! 但背後都有著被分割的時間, 每個人在上班下班中, 都仍有著需要去配合的大小事。 我們會說一聲『
Thumbnail
【穀雨活動慶典】《活動花絮影片》 日光草原的蟲蟲派對好歡樂 每一種昆蟲都好可愛, 在爸爸媽媽與孩子一起合作的創意製作下, 可以展現的各種裝扮, 讓孩子有了一個早上的變身機會。
Thumbnail
【穀雨活動慶典】《活動花絮影片》 日光草原的蟲蟲派對好歡樂 每一種昆蟲都好可愛, 在爸爸媽媽與孩子一起合作的創意製作下, 可以展現的各種裝扮, 讓孩子有了一個早上的變身機會。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News