祝福小語 - 文字與補間動畫

14
祝祝祝祝 - 祝祝祝祝祝祝祝

description

祝福小語 - 文字與補間動畫. 6-1  動畫搶先看. 本章作品應用傳統補間動畫和形狀補間動畫,讓背景與文字能依循設定交叉呈現。一開始會播放四個不同的煙火,接著祝福的英文字母分別由左側飛入,飛入後並依序轉換字型,最後縮小放大的跳動,豐富的呈現文字動態效果。. 動態效果. 元件角色. 此範例元件庫內的元件主要是協助作品:煙火綻放設計、傳統補間與形狀補間動畫製作、文字動畫特效 ... 等動作,分為以下二大類: ( 以下元件會在各節中陸續產生 ). 舞台佈置元件. 文字相關元件. 製作流程. 6-2  匯入背景圖與套用傳統補間動畫. - PowerPoint PPT Presentation

Transcript of 祝福小語 - 文字與補間動畫

Page 1: 祝福小語  - 文字與補間動畫

祝福小語 - 文字與補間動畫

Page 2: 祝福小語  - 文字與補間動畫

6-1  動畫搶先看本章作品應用傳統補間動畫和形狀補間動畫,讓背景與文字能依循設定交叉呈現。一開始會播放四個不同的煙火,接著祝福的英文字母分別由左側飛入,飛入後並依序轉換字型,最後縮小放大的跳動,豐富的呈現文字動態效果。

Page 3: 祝福小語  - 文字與補間動畫

動態效果

Page 4: 祝福小語  - 文字與補間動畫

元件角色

此範例元件庫內的元件主要是協助作品:煙火綻放設計、傳統補間與形狀補間動畫製作、文字動畫特效 ... 等動作,分為以下二大類: ( 以下元件會在各節中陸續產生 )

舞台佈置元件

Page 5: 祝福小語  - 文字與補間動畫

文字相關元件

Page 6: 祝福小語  - 文字與補間動畫

製作流程

Page 7: 祝福小語  - 文字與補間動畫

6-2  匯入背景圖與套用傳統補間動畫

Flash 可匯入各種檔案格式的向量圖和點陣圖,例如: psd 、 png 、 gif... 等,此作品將匯入 .psd 素材並套用 傳統補間動畫 利用關鍵影格中對實體物件屬性改變形成動畫效果。

Page 8: 祝福小語  - 文字與補間動畫

STEP 1  匯入 Photoshop PSD 背景圖STEP 2  延伸背景圖層的影格STEP 3  背景煙火動畫效果 - 套用傳統補間動畫STEP 4  控制煙火播放時間STEP 5  測試作品完成結果

Page 9: 祝福小語  - 文字與補間動畫

6-3  建立文字與調整樣式只有單純的背景動畫似乎單調了些,若是再搭配文字,會讓動畫有著不一樣的呈現。接下來要設計此作品的文字「 HAPPY NEW YEAR !」,從文字輸入到調整屬性、顏色,一次完整介紹。

STEP 1  建立靜態文字STEP 2  設定文字相關屬性

Page 10: 祝福小語  - 文字與補間動畫

6-4  飛行文字特效 –多層式傳統補間動畫

本節主要運用多層的傳統補間動畫及關鍵影格對實體物件屬性的改變形成動畫,達到英文字母從左方慢慢飛行進來,由深到淺的飛行效果。

Page 11: 祝福小語  - 文字與補間動畫

STEP 1  將文字分散至各個圖層STEP 2  將文字轉換成圖像元件STEP 3  建立傳統補間動畫STEP 4  測試飛行文字效果

Page 12: 祝福小語  - 文字與補間動畫

6-5  變形文字特效 -打散與形狀補間動畫

形狀補間動畫 是建立外型漸變的效果,讓形狀隨著時間軸變換成另一個形狀。作品中,將原本的字型變換成另一個字型,讓動畫呈現不再只是一種變化。STEP 1  建立關鍵影格STEP 2  變更英文字母字型STEP 3  建立形狀補間動畫

Page 13: 祝福小語  - 文字與補間動畫

6-6  跳動文字特效 - 變形與濾鏡

最後要運用 變形 和 屬性 面板設定英文字母縮小放大做為結束,跳動的呈現文字效果,讓作品變得十分動感有趣。

STEP 1  變更元件實體大小和位置STEP 2  套用漸層光暈濾鏡STEP 3  測試作品完成結果

Page 14: 祝福小語  - 文字與補間動畫

習作 - 熱呼呼咖啡(形狀提示點)

運用本章學習到的技巧與特效一起來試試另一個動畫作品,讓學習更加有趣!請依照如下提示,完成 <ex06.fla> 。