Animate CC 書寫中文字動畫

更新於 發佈於 閱讀時間約 1 分鐘
在Animate動畫中的文字效果,還有中文字依筆畫,書寫出文字內容的文字動畫效果,只要將各筆畫分圖層,再依序以遮色片上的形狀補間動畫或逐格動畫,控制各筆畫出現即可。
目標動畫效果:應用遮色片圖層上的形狀補間或逐格動畫方式,來呈現分圖層的各文字筆畫書寫畫出,加上速度與時間差的控制,就可以表現更好的書寫中文字動畫。
使用動畫技巧:形狀補間、逐格動畫、遮色片。
Step1.
範例中文字已經依筆畫分散至各圖層上。首先僅顯示筆畫1與背景二圖層,並均於影格15處插入影格;於筆畫1圖層上新增遮色片1,使用矩型工具繪製高度略比筆畫1高的矩型,於影格15插入關鍵影格使用變形工具拉寬矩型覆蓋筆畫1,並建立遮色片1上的形狀補間動畫,設定遮色片圖層的色片功能,完成單一筆畫繪製的動畫。
Step2.
相同方式請繼續完成筆畫2與筆畫3的動畫。繼續顯示筆畫4同樣於影格15插入影格;新增遮色片4,使用筆刷工具繪製可覆蓋筆畫4上端的填色內容,繼續依序插入關鍵影格繪製填色覆蓋筆畫,直至全部覆蓋筆畫為止,並建立遮色片功能。
Step3.
同筆畫4的方式繼續設定筆畫5的遮色片動畫。因此可以判斷文字筆畫內容,若是較不規則的形狀就使用以筆刷工具繪製遮色片內容的逐格動畫方式,若是比較規則的筆畫內容就以色塊形狀補間動畫做為遮色片,來呈現筆畫畫出的動畫。請繼續完成剩下的筆畫,筆畫6、8、9使用形狀補間動畫的方式,筆畫7使用筆刷工具繪製填色的方式,完成所有筆畫的繪製動畫。
Step4.
最後顯示所有圖層與遮色片,依序選取每個筆畫圖層與遮色片圖層,移動影格安排時間順序,並於影格180處為所有圖層插入影格,完成此範例。
相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果
為什麼會看到廣告
avatar-img
29會員
129內容數
多媒體設計的專業能力養成過程,除了有效率學習軟體之外,更重要的是各個軟體間的整合應用! Photoshop、Illustrator、Dreamweaver、Animate、CSS、Bootstrap響應式網頁等,相關的整合應用有機會皆會與大家分享喔~
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
哩老師的沙龍 的其他內容
【檢視範例】【下載範例】 應用影片片段元件與傳統補間動畫來整合遮色片動畫,呈現照片上鏡片看圖的效果。使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。 Step1. 元件庫中包含放大鏡與鏡片元件。暫時隱藏放大鏡圖層,在鏡片遮色片圖層上插入多個關鍵影格,並依序移動遮色片元件於場景上不同位置,建立
【檢視範例】【下載範例】 應用影片片段元件與傳統補間動畫來整合遮色片動畫,呈現照片上鏡片看圖的效果。使用動畫技巧:影片片段元件、傳統補間動畫、遮色片動畫。 Step1. 元件庫中包含放大鏡與鏡片元件。暫時隱藏放大鏡圖層,在鏡片遮色片圖層上插入多個關鍵影格,並依序移動遮色片元件於場景上不同位置,建立
你可能也想看
Google News 追蹤
Thumbnail
在創作的路上真的很多人問我說 到底要怎麼做出符合自己期待 但又可以表現得很有美感的作品?🥹 這個問題真的應該是每個創作者都一直在學習的課題吧!
提問的內容越是清晰,強者、聰明人越能在短時間內做判斷、給出精準的建議,他們會對你產生「好印象」,認定你是「積極」的人,有機會、好人脈會不自覺地想引薦給你
Thumbnail
Animation Presets 是預設的動畫效果和屬性設定,套用後就可以做出動畫效果。 Animate Out 是預設的文字出場(離開)效果。
Thumbnail
Animation Presets 是預設的動畫效果和屬性設定,套用後就可以做出動畫效果,無需從零開始進行複雜的調整。 其中的 Animate In 是讓文字以各種動畫方式進場。可用來製作標題或字幕進場的動畫。
Thumbnail
從2021年就在日本巡迴的《Animage雜誌和吉卜力展》,現在從1/8~4/6在華山1914文創園區東2C、D棟展出。
Thumbnail
插畫和動畫之間有著密切的關係,但並不是說一定要先有插畫才有動畫。插畫通常是靜態的圖像,用來表達一個概念、故事或角色,而動畫則是將這些靜態圖像連續播放,創造出動態效果。 在很多情況下,動畫的製作確實會從插畫開始。插畫可以用來設計角色、場景和故事板,這些都是動畫製作的重要步驟。例如,漫畫或插畫書經
Thumbnail
本文介紹瞭如何使用 Photoshop 和 Cinema 4D 創建手繪風格動畫場景。從照片處理到模型建模、材質貼圖、額外元素建模、光線和打光、渲染與後期處理,逐步解說了創建過程。通過這些建議,你將能夠創建一個既細緻又富有動畫效果的手繪風格場景,為你的動畫作品增添獨特的魅力和視覺吸引力。
Thumbnail
Ae 小技巧:宣紙噪點+抽幀效果 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
Ae 小技巧:Adjustment Layer 調整圖層 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
Ae 小技巧:製作3D 方塊 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
在創作的路上真的很多人問我說 到底要怎麼做出符合自己期待 但又可以表現得很有美感的作品?🥹 這個問題真的應該是每個創作者都一直在學習的課題吧!
提問的內容越是清晰,強者、聰明人越能在短時間內做判斷、給出精準的建議,他們會對你產生「好印象」,認定你是「積極」的人,有機會、好人脈會不自覺地想引薦給你
Thumbnail
Animation Presets 是預設的動畫效果和屬性設定,套用後就可以做出動畫效果。 Animate Out 是預設的文字出場(離開)效果。
Thumbnail
Animation Presets 是預設的動畫效果和屬性設定,套用後就可以做出動畫效果,無需從零開始進行複雜的調整。 其中的 Animate In 是讓文字以各種動畫方式進場。可用來製作標題或字幕進場的動畫。
Thumbnail
從2021年就在日本巡迴的《Animage雜誌和吉卜力展》,現在從1/8~4/6在華山1914文創園區東2C、D棟展出。
Thumbnail
插畫和動畫之間有著密切的關係,但並不是說一定要先有插畫才有動畫。插畫通常是靜態的圖像,用來表達一個概念、故事或角色,而動畫則是將這些靜態圖像連續播放,創造出動態效果。 在很多情況下,動畫的製作確實會從插畫開始。插畫可以用來設計角色、場景和故事板,這些都是動畫製作的重要步驟。例如,漫畫或插畫書經
Thumbnail
本文介紹瞭如何使用 Photoshop 和 Cinema 4D 創建手繪風格動畫場景。從照片處理到模型建模、材質貼圖、額外元素建模、光線和打光、渲染與後期處理,逐步解說了創建過程。通過這些建議,你將能夠創建一個既細緻又富有動畫效果的手繪風格場景,為你的動畫作品增添獨特的魅力和視覺吸引力。
Thumbnail
Ae 小技巧:宣紙噪點+抽幀效果 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
Ae 小技巧:Adjustment Layer 調整圖層 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
Ae 小技巧:製作3D 方塊 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。