第 14 章 濾鏡特效─ 迅速移動的飛碟.

Presentation on theme: "第 14 章 濾鏡特效─ 迅速移動的飛碟."— Presentation transcript:

1 第 14 章 濾鏡特效─ 迅速移動的飛碟

2 本章提要 14-1 Flash 濾鏡大蒐秘 14-2 設定文件屬性與圖層安排 14-3 製作由遠到近的移動效果 14-4 左右迅速移動
14-5 延伸學習－忽明忽暗的光線

3 14-1 Flash 濾鏡大蒐秘 Flash 8 Professional 版讓人趨之若騖的一大主因, 就是新增了濾鏡 (Filters) 功能, 此功能可以透過現成的運算方式, 將特效套用在我們繪製好的元件 (或文字) 上, 只要改變設定值就可以呈現截然不同的效果。 若是配合移動補間動畫, 此濾鏡即可變身為動畫；更進階的應用, 則是透過 ActionScript 來控制或產生套用濾鏡的範圍, 亦或將濾鏡應用在視訊影片中。

4 Flash 濾鏡大蒐秘 本章我們會先瀏覽全部的濾鏡效果, 再藉由範例帶您實際練習濾鏡的操作, 至於進階的應用, 有興趣的讀者請自行參考其它的書籍。

5 濾鏡的使用限制 濾鏡功能除了只出現在 Flash 8 的 Professional 版本中, 套用的對象也有所限制, 只有以下 3 種物件可套用濾鏡功能： 影片片段元件。 按鈕元件。 文字物件 (包含靜態文字、動態文字及輸入文字) 。

6 濾鏡的使用限制 此外, 套用了濾鏡的動畫, 發佈時必須指定 Flash Player 8 (或以上)的版本, 用來播放的 Flash Player 也必須是 8 (或以上)的版本, 濾鏡特效才會有作用。有關發佈設定的說明, 請參考第 18 章。

7 濾鏡的使用限制

8 濾鏡綜覽 Flash 8 提供了 7 種不同的濾鏡特效, 分別是投影 (Drop Shadow)、模糊 (Blur)、光暈 (Glow)、斜角 (Bevel)、漸層光暈 (Gradient Glow)、漸層斜角 (Gradient Bevel)、調整顏色 (Adjust Color)。 請開啟練習檔 14.fla, 檔案中我們準備了一個影片片段元件, 請跟著以下的步驟進行練習, 看看每個濾鏡的效果如何。

9 濾鏡綜覽 請先切換至濾鏡面板 (或執行『視窗/屬性/濾鏡』命令, 開啟濾鏡面板), 再按下編輯區中要套用濾鏡的元件, 此例我們選擇橘色圓球。

10 濾鏡綜覽 按下濾鏡面板的 鈕, 由彈出的選單設定想要套用的效果, 例如選擇斜角, 設定完數值後, 即會套用在選取的元件上。

11 濾鏡綜覽

12 濾鏡綜覽 再來我們分別以文字呈現各種濾鏡的效果, 提供您參考：

13 濾鏡綜覽

14 套用、移除濾鏡的相關操作 套用及調整多個濾鏡：套用濾鏡之後, 若再選擇其它濾鏡, 效果將會累加在選取的元件上。若有套用多個濾鏡, 還可以直接拉曳濾鏡名稱來調整順序。

15 套用、移除濾鏡的相關操作 停用濾鏡：如果因為套用了濾鏡, 導致看不清楚元件的狀態, 你可以按下濾鏡名稱前的 圖示, 顯示成 圖示時, 表示停用該濾鏡 (並沒有移除哦！), 再按一下 會顯示成 即可重新啟用濾鏡效果。

16 套用、移除濾鏡的相關操作 移除濾鏡：選擇已套用的濾鏡名稱再按下 鈕,可移除套用的濾鏡。如果想要移除全部的濾鏡再重新設定, 可按下 鈕選擇『全部移除』命令：

17 套用、移除濾鏡的相關操作 自訂濾鏡：當你設定出滿意的濾鏡效果, 還想套用在其它元件上時, 可按下 鈕執行『預設效果/另存新檔』命令, 將濾鏡效果儲存起來, 再迅速套用在其它元件上：

18 套用、移除濾鏡的相關操作

19 套用、移除濾鏡的相關操作

20 套用、移除濾鏡的相關操作 儲存之後濾鏡效果會顯示在選單中, 可立即套用在其它物件。

21 14-2 設定文件屬性與圖層安排 學會了濾鏡的基本操作之後, 本節我們要正式進入實際的練習, 請雙按範例檔 swf 看看本章要完成的成果。

22 設定文件屬性與圖層安排 畫面上的飛碟迅速移動, 且行徑變化莫測, 就像我們所知的不明飛行物體一樣。本範例最主要是利用移動補間動畫, 並套用模糊濾鏡來模擬飛碟的快速飛行。

23 元件介紹 請開啟練習檔 14-learn.fla, 此動畫運用到的元件只有一個飛碟影片片段元件。圖層配置上, 只有一個飛碟圖層和做為背景的天空圖層：

24 元件介紹

25 動畫製作流程 我們瀏覽一下整個動畫的製作流程：

26 重點說明 開新檔案時, 動畫預設的影格速率為 12 fps, 但在此範例中 12 fps 的速度感覺太慢, 所以我們要加快動畫的播放速度至 30 fps。 動畫中我們將改變元件的大小來製造飛碟向前、向後飛行的效果。 當飛碟移動位置時, 將應用模糊濾鏡來模擬快速移動的感覺, 為了使飛碟的移動感覺順暢, 在套用濾鏡的關鍵影格中, 亦會加上移動補間動畫。

27 重點說明 我們以下圖來說明飛碟的飛行路徑, 讓您先有個概念：

28 設定文件屬性 本範例共使用了 65 格影格, 整個動畫的播放時間為 2.1 秒。
請在練習檔 14-learn.fla中執行『修改/文件』命令開啟文件屬性交談窗, 檢視本範例的動畫設定：

29 設定文件屬性

30 14-3 製作由遠到近的移動效果 現在請您跟我們一起進行以下的步驟, 完成這個動畫。
選取飛碟圖層的影格 1, 再將元件庫中的飛碟元件拉曳到舞台中央, 並開啟變形面板, 我們要將飛碟縮小至 20% 的大小。

31 製作由遠到近的移動效果

32 製作由遠到近的移動效果 接著切換至濾鏡面板, 然後點選舞台中的飛碟, 再按下 鈕選擇模糊濾鏡, 並如下圖設定各選項：

33 製作由遠到近的移動效果

34 濾鏡品質的差異 每個濾鏡都可以設定品質選項, 選項共有高、中、低可選擇, 請依自己對動畫的品質要求來進行設定。以模糊為例, 若仔細觀察邊緣漸層, 品質高的顏色會比品質低的平滑, 但若不是播放速度很慢或非常精緻的動畫, 其實播放中並不容易看出差異。 無論選擇何種品質, 請把握一個原則, 如果濾鏡套用在補間動畫上, 兩個關鍵影格最好設定相同的品質, 否則播放時容易產生不流暢的現象。

35 製作由遠到近的移動效果 在飛碟圖層的影格 3 新增一個關鍵影格, 再切換至濾鏡面板, 並選取舞台上的飛碟, 同樣設定模糊濾鏡, 再如下圖設定各選項：

36 製作由遠到近的移動效果

37 製作由遠到近的移動效果 在飛碟圖層的影格 1 上按右鈕, 執行『建立移動補間動畫』命令, 使濾鏡效果由影格 1 的幾乎完全隱形, 到影格 3 的模糊程度。 請在飛碟圖層的影格 7 建立關鍵影格, 由變形面板將飛碟調至 150%, 設定完成後在影格 3 上按右鈕, 執行『建立移動畫間動畫』命令, 即可營造出飛碟由遠方飛近的感覺。

38 製作由遠到近的移動效果

39 14-4 左右迅速移動 剛才完成了飛碟由遠飛到近的效果, 現在要使飛碟往左後方移動, 請接續上例進行如下的設定。
請在飛碟圖層的影格 15 新增關鍵影格, 其內容會延續影格 7 的內容, 此處我們不做任何的變化, 這是因為整個動畫的節奏很快, 如果全都設定移動效果, 反而容易讓人眼花撩亂。

40 左右迅速移動

41 左右迅速移動 在影格 17 新增關鍵影格, 並將飛碟移至 x：143、y：132 位置, 接著由變形面板設定影格 17 的飛碟大小為 115%。

42 左右迅速移動

43 左右迅速移動 切換至濾鏡面板, 再選取舞台上的飛碟, 如下設定：

44 左右迅速移動 接下來在影格 19 新增關鍵影格, 此影格的飛碟位置在 x：54、y：92, 大小則設定為 60%, 但不套用任何濾鏡。

45 左右迅速移動

46 左右迅速移動 請分別在影格 15 及 17 上按右鈕, 執行『建立移動補間動畫』命令, 就可以看出飛碟由舞台中央迅速移動至左後方的效果了。

47 左右迅速移動 進行到此我們完成了飛碟從遠到近, 及由左至右的移動效果, 接下來您可以自己安排飛碟的行徑路線。
範例中我們使飛碟從遠飛到近, 再由左後方移至右後方, 最後飛到舞台中央, 並向後飛行直到消失為止, 你也可以發揮你的創意, 讓飛碟有更不同的移動方式, 或是開啟我們已設定完成的 fla, 參考我們安排的關鍵影格及濾鏡效果。

48 左右迅速移動 我們將範例中關鍵影格的設定值列於下表, 供您設定參考：

49 左右迅速移動

50 左右迅速移動 再提醒您一個小技巧, 由於在播放動畫時, 預設會不停的重複播放, 為了讓飛碟在畫面上消失一會兒, 我們在影格 55 的位置加入一個空白關鍵影格, 並持續到影格 65, 如此一來在重複播放時, 才會感覺飛碟忽隱忽現：

51 14-5 延伸學習－忽明忽暗的光線 接下來請你試試光暈的濾鏡效果。套用光暈濾鏡可以讓元件呈現發光的特效, 最簡單的應用就是將文字套用光暈濾鏡, 讓文字邊緣呈現發光的樣子。 範例中我們以桌燈為例, 請雙按範例檔 14-a01.swf, 看看效果如何：

52 延伸學習－忽明忽暗的光線 你可以開啟練習檔 14-q01.fla 來試著做做看。此範例設定的影格速率為預設的 12 fps, 背景為綠色 (#CCFF33), 大小則是 550 × 400。 範例中我們在元件庫儲存了一個與燈泡相同大小的黃色光暈元件。在圖層的安排上, 則是將檯燈圖層放在光暈圖層的下方, 而濾鏡將套用在光暈上。

53 延伸學習－忽明忽暗的光線

54 延伸學習－忽明忽暗的光線 此範例的製作重點在於, 將光暈元件安排至圖層 1 的影格 1 , 再分別於影格 12 及影格 22 建立關鍵影格。
接著選取影格 12, 並切換至濾鏡面板, 在元件上套用光暈濾鏡：

55 延伸學習－忽明忽暗的光線

56 延伸學習－忽明忽暗的光線 再將影格 1 及影格 22 的光暈設定成透明。以影格 1 為例, 請選取影格 1 並點選舞台上的元件, 切換至屬性面板, 將顏色設定為 Alpha, 數值設為 0 即可：

57 延伸學習－忽明忽暗的光線

58 延伸學習－忽明忽暗的光線

59 延伸學習－忽明忽暗的光線

60 延伸學習－忽明忽暗的光線 最後分別在影格 1 及 12 上按右鈕, 執行『建立移動補間動畫』命令, 整個動畫就完成了, 你可以開啟 14-a01.fla 來參考我們設定的內容。