Animate CC 遮色片光澤效果動畫
2020/02/07閱讀時間約 1 分鐘
目標動畫效果:應用影片片段元件與傳統補間動畫，以及遮色片動畫技巧，表現金屬框與文字的光澤效果。
使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。
使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。
Step1.
範例檔元件庫中包含文字、圓與漸層光三元件。點取場景上文字元件並複製，新增圖層，於圖層上原地貼上文字元件，整理為亮文字、暗文字。暫時隱藏亮文字，點取暗文字圖層上的文字物件，設定顏色效果『亮度：-30 ％』。
範例檔元件庫中包含文字、圓與漸層光三元件。點取場景上文字元件並複製，新增圖層，於圖層上原地貼上文字元件，整理為亮文字、暗文字。暫時隱藏亮文字，點取暗文字圖層上的文字物件，設定顏色效果『亮度：-30 ％』。
Step2.
顯示亮文字圖層、新增文字遮色片圖層於亮文字圖層上，在文字遮色片圖層上置入圓元件於文字左側，於影格30、60處插入關鍵影格，移動影格30上的圓元件至文字右側，建立傳統補間，其餘圖層於影格60處插入影格；啟動文字遮色片圖層的遮色片功能，完成暗文字上的光澤。
顯示亮文字圖層、新增文字遮色片圖層於亮文字圖層上，在文字遮色片圖層上置入圓元件於文字左側，於影格30、60處插入關鍵影格，移動影格30上的圓元件至文字右側，建立傳統補間，其餘圖層於影格60處插入影格；啟動文字遮色片圖層的遮色片功能，完成暗文字上的光澤。
Step3.
新增漸層光圖層於金屬框之上，置入漸層光元件於金屬框右側，於影格20、40、60插入關鍵影格，移動影格20上的漸層光元件至中央、移動影格40上的漸層光元件至金屬框左側，建立傳統補間動畫，設定影格1-20順時針旋轉、影格21-40間逆時針旋轉。
新增漸層光圖層於金屬框之上，置入漸層光元件於金屬框右側，於影格20、40、60插入關鍵影格，移動影格20上的漸層光元件至中央、移動影格40上的漸層光元件至金屬框左側，建立傳統補間動畫，設定影格1-20順時針旋轉、影格21-40間逆時針旋轉。
Step4.
顯示框遮色片圖層，由於圖層上的一般矩型線框無法成為遮色片，請選取整個矩型線框，執行『修改 > 形狀 > 將線段轉換成填色』；啟動框遮色片圖層的遮色片功能，完成框上的光澤效果。
顯示框遮色片圖層，由於圖層上的一般矩型線框無法成為遮色片，請選取整個矩型線框，執行『修改 > 形狀 > 將線段轉換成填色』；啟動框遮色片圖層的遮色片功能，完成框上的光澤效果。
相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果
為什麼會看到廣告
留言0
查看全部