形狀補間動畫

搜尋

上次更新時間 2023年5月24日

Animate

開啟應用程式

Adobe Animate 使用手冊

Animate 簡介

動畫

互動

工作區和工作流程

多媒體和視訊

平台

匯出與發佈

疑難排解

在形狀補間動畫中，您會先在「時間軸」中的一個特定影格上繪製向量形狀，然後在另一個特定影格上更改該形狀或繪製另一個形狀。Animate 接著會在影格之間補上一個中間形狀，創造某個形狀變化為另一個形狀的動畫。

Animate 讓您可以將形狀補間動畫增加至一致的實色筆畫及非一致的花式筆畫。此外，您也可以將形狀補間動畫增加至使用「變數寬度工具」加深的筆畫。並測試您要使用的形狀，以判斷結果。您可以使用形狀提示點，告知 Animate 起始形狀上的哪個點對應至結束形狀上的特定點。

您也可以在形狀補間動畫中，將形狀的位置和顏色製成補間動畫。

若要將形狀補間動畫套用到群組、實體或點陣圖影像上，請先打散這些元素。若要將形狀補間動畫套用到文字上，必須將文字打散兩次，才能將文字轉換成圖像。請參閱打散元件實體。

建立形狀補間動畫

下列步驟將說明如何從「時間軸」的影格 1 到影格 30 建立形狀補間動畫。但是，您可以在「時間軸」中選定的任何部分建立補間動畫。

在影格 1 中，使用「矩形」工具繪製一個正方形。
選取位於相同圖層的影格 30，然後選擇「插入 > 時間軸 > 空白關鍵影格」或按 F7，加入空白關鍵影格。
在「舞台」上，使用「橢圓形」工具在影格 30 中繪製一個圓形。

現在，包含正方形的影格 1 中有一個關鍵影格，而且包含圓形的影格 30 中也有一個關鍵影格。
在「時間軸」中，於包含兩個形狀之圖層內的兩個關鍵影格之間選取其中一個影格。
選擇「插入 > 形狀補間動畫」。

Animate 會在這兩個關鍵影格之間的所有影格中插補這些形狀。
若要預覽補間動畫，請在「時間軸」中的所有影格上控制播放磁頭，或按 Enter 鍵。
除了形狀以外，如果還要製作補間動畫，請將影格 30 中的形狀與影格 1 中的形狀不同的位置。

按 Enter 鍵預覽動畫。
若要將形狀的顏色製成補間動畫，請設定影格 1 中的形狀顏色，使其與影格 30 中的形狀顏色不同。
若要將加/減速加入至補間動畫，請選取其中一個影格，然後在「屬性」檢測器的「加/減速」欄位中輸入值。

若要在補間動畫的開頭套用加/減速，請輸入負值。若要在補間動畫的結尾套用加/減速，請輸入正值。

建立加/減速預設效果或自訂加/減速

加/減速預設效果是預先設定的加/減速，可套用至舞台上的物件。

形狀補間動畫有一組常用的加/減速預設效果。您可以從加/減速預設效果清單中選取預設效果，然後套用到選取的屬性。此外，您也可以將自訂加/減速套用到形狀補間動畫。

按一下 Animate 時間軸中包含形狀補間動畫的圖層。
若要開啟「補間動畫」屬性，請按一下屬性面板中的「補間動畫」類別。

「補間動畫」屬性
在「加/減速」類型彈出式對話框中選取加/減速預設效果。按兩下要套用的預設效果類型。

如果您選擇套用傳統加/減速，也可以移動滑桿來增加或減少加/減速強度。

加/減速預設集的類型
按一下「加/減速」旁邊的「編輯」圖示，即可套用自訂加/減速。

「自訂速度」對話方塊會以圖表，顯示動作隨時間移動的程度。水平軸是影格，而垂直軸則代表變化百分比。第一個關鍵影格會以 0% 表示，最後一個關鍵影格則為 100%。

圖表曲線的傾斜度代表物件的變動速率。當曲線為水平 (沒有傾斜) 時，表示速度為零；當曲線為垂直時，則表示有瞬間的變動速率。

您可以儲存自訂加/減速度，之後從「自訂」清單選擇即可重複使用。進行變更後，按一下編輯模式中的「儲存並套用」按鈕。在下方螢幕快照中，您可以找到自訂的加/減速預設集，名稱為 MyEase1。

您可以透過選取對應的範圍和套用加/減速，在時間軸的多個範圍中使用預設加/減速。

為多個範圍套用加/減速預設集

以形狀提示點控制形狀變更

若要控制更複雜或難度更高的變形效果，可以採用形狀提示點。形狀提示點會識別出在開始和結束形狀中相互對應的點。例如，如果正在將更改表情的臉孔製作成補間動畫，可以使用形狀提示點，標示兩隻眼睛。接著，發生形狀改變時，臉孔將不會糊成一團；眼睛仍然可以辨識得出來，並在轉換時分別改變。

形狀提示點包含字母 (a 到 z)，用來識別在開始和結束形狀中相互對應的點。您最多可以使用 26 個形狀提示點。

形狀提示點會在開始關鍵影格中呈現黃色、在結束關鍵影格中呈現綠色，不在曲線上時則會呈現紅色。

如果要讓形狀補間動畫達到最佳效果，請遵守這些原則：

在複雜的形狀補間動畫中，請建立中間形狀，然後在這些中間形狀之間建立補間動畫，而不僅是定義開始和結束形狀。
請確認形狀提示點是合理的。例如，如果將三個形狀提示點用於一個三角形上，它們在原始三角形和補間動畫三角形上必須具有相同的順序。如果第一個關鍵影格上的順序是 a,b,c，則第二個關鍵影格上的順序不能是 a,c,b。
若將形狀提示點從形狀的左上角按逆時針順序放置，可以得到最佳效果。

使用形狀提示點

在形狀補間動畫的序列中選取第一個關鍵影格。
選取「修改 > 形狀 > 增加形狀提示點」。起始形狀提示點會以具有字母 a 的紅色圓形，出現在形狀上的某處。
請將形狀提示點移動到要標記的點上。
選取補間動畫序列中的最後一個關鍵影格。結束形狀提示點會以具有字母 a 的紅色圓形，出現在形狀上的某處。
將形狀提示點移動到結束形狀中的某一點上，該點會對應至您先前標記的第一個點。
若要檢視形狀提示點如何更改形狀補間動畫，再次播放動畫。若要對補間動畫進行細部調整，請移動形狀提示點。
若要新增更多形狀提示點，請重複執行這個程序。新的提示點會按照字母的順序出現 (如：b、c 等等)。

檢視所有形狀提示點

選取「檢視 > 顯示形狀提示點」。包含形狀提示點的圖層和關鍵影格必須是作用中的圖層和關鍵影格，「顯示形狀提示點」才能使用。

移除形狀提示點

將它拖曳到舞台之外。

移除所有形狀提示點

選取「修改 > 形狀 > 移除全部提示點」。

使用變數寬度為筆畫增加形狀補間動畫

Animate 讓您可以使用「變數寬度」為筆畫增加形狀補間動畫。之前，Animate 只支援為實色一致筆畫和形狀建立形狀補間動畫。這使得設計人員無法為非一致筆畫 (例如使用「變數寬度工具」加深的筆畫) 建立形狀補間動畫。使用變數寬度將筆畫製成補間動畫，會大幅擴展在 Animate 內的設計可能性。

將形狀補間動畫增加至花式筆畫，不同於將形狀或實色一致筆畫製成補間動畫。此工作流程會需要您定義補間動畫的開頭和最後形狀，並且 Animate 會建立補間動畫的轉變影格。

關於變數寬度工具

「變數寬度」工具可讓您將一致的實色筆畫加深，以建立優美的花式筆畫。

將形狀補間動畫增加至變數寬度筆畫

在 Animate CC 中，使用「線段工具」繪製線段。

在「舞台」上使用「線段工具」繪製的線段筆畫，並且「筆畫」值設定為 2 像素。
使用「變數寬度」工具，在筆畫中間增加寬度 (請見下圖)。如需有關使用「變數寬度工具」的詳細資訊，請參閱使用變數寬度工具加深筆畫。

使用「變數寬度工具」建立的變數寬度筆畫，並且「筆畫」值設定為 68.0 像素。
選取時間軸上的其他影格，例如影格 30，並為補間動畫建立筆畫的最後形狀。

最後形狀已增加至形狀補間動畫的最後一個關鍵影格。
以滑鼠右鍵按一下 1 到 30 之間的任何影格，並選取「建立形狀補間動畫」。