關於濾鏡

濾鏡概觀

濾鏡 (圖像特效) 可讓您將豐富的視覺特效加入至文字、按鈕和影片片段。Animate 有一個獨特的功能,可讓您使用移動補間動畫,將套用的濾鏡製成動畫。

Animate 混合模式可以讓您建立複合影像。複合是指對兩個或兩個以上的重疊物件,變化其透明度或顏色互動的過程。 混合模式也會將控制項的尺寸加入至物件與影像的不透明度。 您也可以使用 Animate 混合模式來建立亮部或陰影,以便展示下層影像的細節,或是讓影像的顏色看起來更飽和。

關於將濾鏡動畫化

您可以在「時間軸」中將濾鏡製成動畫。位於不同關鍵影格上而以補間動畫結合的物件,在中間影格上也有對應的補間動畫濾鏡參數可用。 如果濾鏡在補間動畫的另一端沒有相符的濾鏡 (相同類型的濾鏡),程式會自動增加一個相符濾鏡,以確保該特效會出現在連續動畫的結尾。

為了防止補間動畫因某端遺失濾鏡,或兩端以不同的順序套用濾鏡,而導致移動補間動畫不正確運作,Animate 會進行下列調整:

  • 如果您在已套用濾鏡的影片片段上套用移動補間動畫,當您在補間動畫的另一端插入關鍵影格時,影片片段便會於補間動畫的最後一個影格處,自動套用與補間動畫的起始處堆疊順序相同的同一組濾鏡。

  • 如果您將影片片段放置在兩個分別套用不同濾鏡的影格上,再將移動補間動畫套用至兩個影格之間,Animate 會優先處理擁有濾鏡數較多的影片片段。接著 Animate 便會將套用在第一個影片片段上的濾鏡,和第二個影片片段所使用的濾鏡進行比較。如果在第二個影片片段上沒有發現相符的濾鏡,Animate 便會產生一個不具現有濾鏡參數和顏色的虛擬濾鏡。

  • 如果兩個關鍵影格之間有移動補間動畫,而且您在某個關鍵影格中為物件增加濾鏡,當影片片段到達補間動畫另一端的關鍵影格時,Animate 會自動將虛擬濾鏡增加至影片片段。

  • 如果兩個關鍵影格之間有移動補間動畫,而且您從某個關鍵影格中的物件移除濾鏡,則當影片片段到達補間動畫的另一端關鍵影格時,Animate 會自動從影片片段中移除相符的濾鏡。

  • 如果移動補間動畫開始和結束的濾鏡參數設定不一致,Animate 會將開始影格的濾鏡設定套用至漸變影格。若補間動畫的開始與結束之間設定下列不同的參數時,便會出現不一致的設定:去底色、內陰影、內光暈,以及漸層光暈和漸層斜角的類型。

    例如,如果您利用投影濾鏡建立移動補間動畫,並在補間動畫第一個影格上套用去底色的投影,並在最後一個影格上套用內陰影,Animate 便會修正移動補間動畫中濾鏡不一致的使用方式。在這樣的情況下,Animate 會套用用於補間動畫第一個影格上的濾鏡設定,也就是去底色的投影效果。

關於濾鏡與 Flash Player 效能

套用至物件的濾鏡類型、數量和品質,會影響 SWF 檔播放時的效能。為了正確顯示您建立的視覺特效,在物件上套用了越多濾鏡,Adobe® Flash® Player 就必須處理更大的計算量。 因此,Adobe® 建議您不要在指定的物件上套用太多濾鏡。

每個濾鏡都包含控制項,可以讓您調整套用之濾鏡的強度和品質。 使用較低的設定,可以改善在較慢電腦上播放的效能。 如果您要建立的內容會在各式各樣的電腦上播放,或是您不確定觀眾電腦的運算能力等級,請設定「低」品質等級,以獲得最佳的播放效能。

關於 Pixel Bender 濾鏡

Adobe Pixel Bender™ 是由 Adobe 所開發的程式語言,讓使用者能夠建立自訂濾鏡、效果和混合模式以應用於 Animate 和 After Effects 中。Pixel Bender 與硬體無關,其設計原理可自動在各種 GPU 和 CPU 架構上有效率地執行。

Pixel Bender 開發人員只需撰寫 Pixel Bender 程式碼,並將程式碼儲存於副檔名為 pbj 的文字檔,即可建立濾鏡。撰寫完成後,Pixel Bender 濾鏡便能供任何 Animate 文件使用。利用 ActionScript® 3.0 則可載入濾鏡與使用濾鏡控制項。

如需有關在 ActionScript 中使用 Pixel Bender 的詳細資訊,請參閱 ActionScript 3.0 開發人員指南

Lee Brimelow 已在部落格 http://theflashblog.com/?cat=44 上張貼數個實用的 Pixel Bender 範例。

以下視訊教學課程將示範如何在 Animate 中使用 Pixel Bender 濾鏡:

使用濾鏡

Animate CC 中的增強功能

每次您在物件上增加新的濾鏡時,就會將該濾鏡增加至「屬性」檢測器中該物件的套用濾鏡清單上。 您可以在物件上套用多個濾鏡,也可以移除先前已套用的濾鏡。 您只能將濾鏡套用至文字、按鈕、影片片段、組件和編譯的片段物件。

您可以建立濾鏡設定元件庫,以便輕鬆地在物件上套用相同的濾鏡或濾鏡組。 Animate 會將您在「屬性」檢測器的「濾鏡」區段所建立的濾鏡預設效果儲存於「濾鏡 > 預設效果」選單中。

在 Flash Professional CS6 及更早版本中,套用濾鏡僅限於影片片段和按鈕元件。有了 Animate CC,您現在還可以將濾鏡套用至編譯的片段和影片片段組件。如此,您只要按一下按鈕 (或按兩下),就可以直接將各種效果加到組件,使您的應用程式外觀更為出色。在 Flash CS6 中,若要將濾鏡或其他效果加到組件,必須將它包覆在影片片段元件內。方法如下:

  1. 在舞台上建立或新增組件。
  2. 以滑鼠右鍵按一下組件,然後選取「轉換成元件」。
在 CS6 (及更早版本) 中,您可以在將組件包覆在元件內後,增加濾鏡或各種其他效果。不過,這只是暫時解決方法,並非建議的最佳作法。
 
在 Animate CC 中,您可以直接使用「屬性」面板上提供的「濾鏡」、「顏色特效」和「顯示設定」選項,將各種濾鏡加到組件。若要進一步了解這個重要增強功能,請參考下列範例:
 
將斜角濾鏡加入至按鈕組件
 
  1. 從「組件」面板在舞台上建立或新增按鈕,接著選取「按鈕」。
  2. 在「屬性」面板上,從「濾鏡」區段的下拉式清單中按一下 按鈕,並且選取「斜角」濾鏡。「斜角」濾鏡的屬性和值隨即顯示。
  3. 針對任何所要的屬性修改或設定適當值。例如,「X 軸模糊」、「Y 軸模糊」、「強度」、「陰影」等。您將會發現效果同時反映在選取的按鈕上。
「屬性」檢測器中的「增加濾鏡」選單

套用或移除濾鏡

  1. 選取要套用濾鏡或從中移除濾鏡的文字、按鈕或影片片段物件。
  2. 在「屬性」面板的「濾鏡」區域中,執行下列其中一項:

    • 若要新增濾鏡,請按一下 按鈕,然後選取濾鏡。您可以嘗試使用各種設定,直到找到想要的外觀為止。

    • 若要移除濾鏡,請在已套用的濾鏡清單中選取要移除的濾鏡,然後按一下「移除濾鏡」按鈕 。您可以刪除或重新命名任何預設效果。

複製並貼上濾鏡

  1. 選取要從中複製濾鏡的物件,然後選取「濾鏡」面板。
  2. 選取要複製的濾鏡,並按一下 按鈕。在下拉式清單中,按一下「複製選取的濾鏡」。若要複製所有濾鏡,請選擇「複製所有濾鏡」。

  3. 選取要套用濾鏡的物件,並按一下按鈕。在下拉式清單中,按一下「貼上篩選」。

將預設濾鏡套用至物件

  1. 選取要套用濾鏡預設效果的物件,然後選取「濾鏡」標籤。
  2. 按一下 按鈕,以開啟下拉式清單。

  3. 從下拉式清單底部的可用預設效果清單中,選取要套用的濾鏡預設效果。

註解:

當您將濾鏡預設效果套用至物件後,Animate 會將目前套用在選定物件上的任何濾鏡,取代為預設效果中所使用的濾鏡。

啟用或停用套用至物件的濾鏡

  1. 所有濾鏡預設為啟用。按一下濾鏡名稱旁邊的 圖示可停用濾鏡清單中的濾鏡。按一下濾鏡名稱旁邊的 X 按鈕可啟用濾鏡。

    註解:

    若要切換清單中其他濾鏡的啟用狀態,請按住 Alt 再按一下 (Windows) 或按住 Option 再按一下 (Macintosh)「濾鏡」清單中的「啟用」圖示。 如果您按住 Alt 再按一下 圖示,便會啟用選取的濾鏡,同時停用清單中的所有其他濾鏡。

啟用或停用套用至物件的所有濾鏡

  1. 按一下 按鈕,並從下拉式清單中選取「全部啟用」或「全部停用」。

    註解:

    若要啟用或停用清單中的所有濾鏡,請按住 Control 再按一下「濾鏡」清單中的「啟用」或「停用」圖示。

建立預設效果濾鏡元件庫

您可以將濾鏡設定儲存為預設效果元件庫,以便輕鬆地套用至影片片段和文字物件。 您也能夠與其他使用者共用這些濾鏡預設效果,只需要為他們提供濾鏡組態設定檔即可。 濾鏡組態設定檔就是儲存在 Animate Configuration 資料夾之下列位置中的 XML 檔案:

 

  • Windows 7 和 8:C:\Users\使用者名稱\AppData\Local\Adobe\Flash CC\語言\Configuration
  • (僅適用於 Flash Professional CS6 或更早版本) Windows XP:C:\Documents and Settings\使用者名稱\Local Settings\Application Data\Adobe\Flash CS6\語言\Configuration\Filters\filtername.xml
  • (僅適用於 Flash Professional CS6 或更早版本) Windows Vista:C:\Users\使用者名稱\Local Settings\Application Data\Adobe\Flash CS6\語言\Configuration\Filters\filtername.xml
  • Macintosh:Macintosh HD/Users/使用者名稱/Library/Application Support/Adobe/Flash CC/語言/Configuration/Filters/filtername.xml

建立具有預設設定的濾鏡元件庫

  1. 將一個或多個濾鏡套用至任何選取的物件。

  2. 按一下 按鈕以新增濾鏡。

  3. 選取濾鏡,再按一下 按鈕,並選擇「另存成預設效果」。

  4. 在「另存預設效果為」對話方塊中,輸入濾鏡設定的名稱,然後按一下「確定」。

重新命名濾鏡預設效果

  1. 按一下 按鈕並新增濾鏡。

  2. 選取濾鏡並按一下 按鈕。按一下「編輯預設效果」。

  3. 按兩下您要修改的預設效果名稱。

  4. 輸入新預設效果名稱,然後按一下「確定」。

刪除濾鏡預設效果

  1. 按一下 按鈕並新增濾鏡。

  2. 選取濾鏡並按一下 按鈕。

  3. 按一下「編輯預設效果」。

  4. 在「編輯預設效果」對話方塊中,選取要移除的預設效果,然後按一下「刪除」。

套用濾鏡

套用投影

「投影」濾鏡會模擬將陰影投射至表面之物件的外觀。

套用「投影」濾鏡的文字

如需具有傳統補間動畫的投影範例,請參閱「Animate 範例」網頁,網址為 www.adobe.com/go/learn_fl_samples_tw。下載並解壓縮 Samples 這個壓縮檔,然後瀏覽至 Graphics\AnimatedDropShadow 目錄。

  1. 選取要套用投影的物件。
  2. 在「屬性」檢測器的「濾鏡」區段中,按一下 按鈕,並選取「投影」。

  3. 編輯濾鏡設定:
    • 若要設定投影的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。
    • 若要設定陰影的暗度,請設定「強度」值。數值越高,陰影就越暗。
    • 選取投影的品質等級。 「高」與「高斯」模糊的品質等級很接近。 「低」會讓播放效能最佳化。
    • 若要設定陰影的角度,請輸入值。
    • 若要設定陰影和物件之間的距離,請設定「距離」的值。
    • 選取「去底色」去除 (或是視覺上隱藏) 來源物件的底色,並僅在去底色的影像上顯示投影。
    • 若要在物件的邊界內套用陰影,請選取「內陰影」。
    • 若要隱藏物件並僅顯示其陰影,請選取「隱藏物件」。 「隱藏物件」能讓您更輕易地建立真實的陰影。
    • 如果要開啟「顏色挑選器」並設定陰影顏色,請按一下「顏色」控制項。

建立傾斜投影

傾斜「投影」濾鏡,以建立看起來更真實的陰影

  1. 選取具有您要傾斜之陰影的物件。
  2. 重製 (選取「編輯 > 重製」) 來源物件。
  3. 選取重製的物件,然後使用「自由變形」工具 (「修改 > 變形 > 旋轉和傾斜」) 將其傾斜。
  4. 將「投影」濾鏡套用到重製的影片片段或文字物件。 (如果您重製的物件已經有投影,表示已經套用此濾鏡)。
  5. 在「濾鏡」面板中,選取「隱藏物件」來隱藏重製的物件,並同時可以看到它的陰影。
  6. 選取「修改 > 排列 > 往後移」,將重製的物件及其陰影放到您重製的原始物件後面。
  7. 請調整「投影」濾鏡的設定和傾斜投影的角度,直到達到所需的外觀為止。

套用模糊

「模糊」濾鏡會柔化物件的邊緣和細節。 在物件上套用模糊,可以使物件看起來像是位於其他物件後面,或使物件看起來像在移動中。

套用「模糊」濾鏡的文字

  1. 選取要套用模糊的物件,然後選取「濾鏡」。
  2. 按一下 按鈕並選取「模糊」。

  3. 編輯「濾鏡」標籤上的濾鏡設定:
    • 若要設定模糊的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。
    • 選取模糊的品質等級。 「高」與「高斯」模糊的品質等級很接近。 「低」會讓播放效能最佳化。

套用光暈

「光暈」濾鏡可讓您將顏色套用至物件邊緣的周圍。

套用「光暈」濾鏡的文字

  1. 選取要套用光暈的物件,然後選取「濾鏡」。
  2. 按一下 按鈕並選取「光暈」。

  3. 編輯「濾鏡」標籤上的濾鏡設定:
    • 若要設定光暈的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。
    • 如果要開啟「顏色挑選器」並設定光暈顏色,請按一下「顏色」控制項。
    • 若要設定光暈的清晰度,請設定「強度」的值。
    • 若要去除 (或是視覺上隱藏) 來源物件的底色,並僅在去底色的影像上顯示光暈,請選取「去底色」。
    使用帶有「去底色」選項的「光暈」濾鏡

    • 若要在物件的邊界內套用光暈,請選取「內光暈」。
    • 選取光暈的品質等級。 「高」與「高斯」模糊的品質等級很接近。 「低」會讓播放效能最佳化。

套用斜角

套用斜角就是將亮部增加至物件,使物件看起來像曲起在背景表面上。

套用斜角的文字

  1. 選取要套用斜角的物件,然後選取「濾鏡」。
  2. 按一下 按鈕並選取「斜角」。

  3. 編輯「濾鏡」標籤上的濾鏡設定:
    • 若要設定斜角的類型,請從「類型」選單中選取斜角。
    • 若要設定斜角的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。
    • 從彈出式面板中選取斜角的陰影和亮部顏色。
    • 若要設定斜角的不透明度,而不影響斜角的寬度,請設定「強度」的值。
    • 若要變更斜角化邊緣投射的陰影角度,請設定「角度」的值。
    • 若要定義斜角的寬度,請針對「距離」輸入值。
    • 若要去除 (或是視覺上隱藏) 來源物件的底色,並僅在去底色的影像上顯示斜角,請選取「去底色」。

套用漸層光暈

套用漸層光暈會產生帶有漸層顏色跨越光暈表面的光暈外觀。 漸層光暈需要在漸層開頭使用 Alpha 值為 0 的顏色。 這個顏色的位置不能移動,但可以變更顏色。

套用漸層光暈的文字

  1. 選取要套用漸層光暈的物件。
  2. 在「屬性」檢測器的「濾鏡」區段中,按一下 按鈕,並選取「漸層光暈」。

  3. 編輯「濾鏡」標籤上的濾鏡設定:
    • 從「類型」彈出式選單中選取要套用至物件的光暈類型。
    • 若要設定光暈的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。
    • 若要設定光暈的不透明度,而不影響光暈的寬度,請設定「強度」的值。
    • 若要變更光暈投射的陰影角度,請設定「角度」的值。
    • 若要設定陰影和物件之間的距離,請設定「距離」的值。
    • 若要去除 (或是視覺上隱藏) 來源物件的底色,並僅在去底色的影像上顯示漸層光暈,請選取「去底色」。
    • 指定光暈的漸層顏色。 漸層包含了兩種以上的顏色,這些顏色會互相淡出或混合。 您為漸層開頭選取的顏色,便稱為 alpha 顏色。
    • 若要變更漸層中的顏色,請選取漸層定義列下方的任一個顏色指標,然後按一下色域 (顯示在漸層列正下方) 顯示「顏色挑選器」。 滑動這些指標會調整漸層中顏色的層級與位置。
    • 若要在漸層中加入指標,請按一下漸層定義列或其下方。若要建立最多含有 15 種顏色轉換的漸層,最多可加入 15 種顏色指標。 若要改變指標在漸層中的位置,請沿著漸層定義列拖曳指標。若要移除指標,請將指標向下拖曳出漸層定義列。
    • 選取漸層光暈的品質等級。 「高」與「高斯」模糊的品質等級很接近。 「低」會讓播放效能最佳化。

套用漸層斜角

套用漸層斜角時,系統會使用跨越斜角表面的漸層顏色,產生使物件看起來像在背景上凸起的外觀。 漸層斜角需要在漸層中間使用 Alpha 值為 0 的顏色。

  1. 選取要套用漸層斜角的物件。

  2. 在「屬性」檢測器的「濾鏡」區段中,按一下 按鈕,並選取「漸層斜角」。

  3. 編輯「濾鏡」標籤上的濾鏡設定:

    • 從「類型」彈出式選單中選取要套用至物件的斜角類型。

    • 若要設定斜角的寬度和高度,請設定「X 軸模糊」與「Y 軸模糊」的值。

    • 若要影響斜角的平滑度,但不影響其寬度,請輸入「強度」的值。

    • 若要設定光源的角度,請輸入「角度」的值。

    • 若要去除 (或是視覺上隱藏) 來源物件的底色,並僅在去底色的影像上顯示漸層斜角,請選取「去底色」。

    • 指定斜角的漸層顏色。 漸層包含了兩種以上的顏色,這些顏色會互相淡出或混合。 中間的指標會控制漸層的 Alpha 顏色。 您可以變更 Alpha 指標的顏色,但是無法在漸層中重新定位此顏色。

      若要變更漸層中的顏色,請選取漸層定義列下方的任一個顏色指標,然後按一下色域 (顯示在漸層列正下方) 顯示「顏色挑選器」。 若要調整漸層中顏色的層級與位置,請滑動這些指標。

      若要在漸層中加入指標,請按一下漸層定義列或其下方。若要建立最多含有 15 種顏色轉換的漸層,最多可加入 15 種顏色指標。 若要改變指標在漸層中的位置,請沿著漸層定義列拖曳指標。若要移除指標,請將指標向下拖曳出漸層定義列。

套用調整顏色濾鏡

「調整顏色」濾鏡可以讓您細部控制所選物件的顏色特質,包括對比、亮度、飽和度和色相。

  1. 選取要調整顏色的物件。
  2. 在「屬性」檢測器的「濾鏡」區段中,按一下 按鈕,並選取「調整顏色」。

  3. 輸入顏色特質的值。如下列所示的特質及其對應值:

    對比

    可調整影像的亮部、陰影與中間色調。

    亮度

    可調整影像的亮度。

    飽和度

    可調整顏色的飽滿度。

    色相

    可調整顏色的陰影。

  4. 若要將所有顏色調整重設為 0 並讓物件返回原始的狀態,請按一下「重設濾鏡」。

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策