Animate CC 動畫類型

哩老師

2020/02/05閱讀時間約 1 分鐘

1. 基本四大類型

AnimateCC的基礎動畫可分為基本四大類型，逐格動畫、形狀補間動畫、傳統(移動)補間動畫、(新的)移動補間動畫，全都是要成為 Animate CC動畫得心應手的必備動畫基礎。

(1)逐格動畫

製作方式:依序在要設定內容的時間點上插入關鍵影格，設定更改內容即可。

(2)形狀補間動畫

製作方式:
STEP1. 在要設定內容的時間點上插入關鍵影格，設定更改內容。
STEP2. 在二個關鍵影格之間【建立形狀補間】。

(3)傳統(移動)補間動畫

製作方式:
STEP1. 準備好要製作傳統捕間動畫的元件，可以新增元件(插入>新增元件)並由元件庫拉入場景；也可以直接點取畫面上的物件傳換成元件(修改>轉換成元件)，圖像元件與影片片段元件均可。
STEP2. 依序在要設定不同屬性(尺寸、位置等)的時間點上插入關鍵影格，再更改元件屬性。
STEP3. 在二個關鍵影格之間【建立傳統補間】。

(4)(新的)移動補間動畫

製作方式:
STEP1. 直接點取畫面上的物件並【建立移動補間】(按下滑鼠右鍵)，並自動建立影片片段元件，影格長度預設為1秒，請自行增加影格長度。
STEP2. 依序在要設定不同屬性(尺寸、位置等)的時間點上插入關鍵影格(選擇全部)，再更改元件屬性；也可以在要設定不同屬性(尺寸、位置等)的時間點上直接更改屬性，則會自動產生屬性關鍵影格。

2.移動補間動畫與傳統補間動畫

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

即將進入廣告，捲動後可繼續閱讀

為什麼會看到廣告

#AnimateCC動畫類型

#動畫基礎

哩老師的沙龍Animate CC 網頁動畫與JS互動動畫基礎

哩老師的沙龍

29會員

161內容數

藉由Animate CC製作網頁上的動畫，並發佈成HTML5+CANVAS+JAVASCRIPT格式，已是最有效率設計製作專業網頁動畫效果的方式，筆者將藉由此空間分享與介紹Animate CC製作網頁動畫技巧，歡迎一起讓網頁上的內容動起來!

留言0

查看全部

發表第一個留言支持創作者！

哩老師的沙龍的其他內容

Animate CC 時間軸與各種影格

要構成動畫的二大元素『時間』與『動畫內容』，在Animate中都是仰賴時間軸控制版，動畫內容即是以圖層來構成，而動畫時間的控制就得仰賴時間軸上的『影格』，來進行動畫設計製作與記錄。 1.時間軸 Adobe Animate CC 中的「時間軸」會隨著時間的經過，在圖層與影格中組織並控制文件內容。就像影

#動畫基礎

Animate CC 設計漸層文字動畫素材

建立文字打散後的漸層編輯應用，設定製作出文字倒影與陰影素材，進而隨後表現其動畫效果。 STEP1. 在深色背景上建立白色文字並打散二次成圖像，各向上、下複製出另二份文字圖像共三份。首先選取第二份文字，使用油漆桶工具為第二份文字填入黑白線性漸層(請確認使用油漆桶工具於文字上點一下倒入整體漸層)，

#動畫基礎 #動畫素材準備

Animate CC繪製漸層球與光動畫素材

使用橢圓、矩型、鋼筆工具建立物件基本造型，搭配物件重疊合併的編輯，以及漸層填色技巧，完成仿3D的場景內之球、舞台、光線、陰影等動畫素材物件。 STEP1. 為方便編輯請先設定場景背景色為灰色，選擇填色為黑白放射狀漸層，繪製正圓形無邊框黑白漸層，再使用漸層變形工具調整漸層中心至圓內左上角，放大漸層範圍

#動畫基礎 #動畫素材準備