ui交互設計案例教程 第四章

04用AfterEffects設計和實現(xiàn)UI交互動效簽到簽到方式教師通過“文旌課堂APP”生成簽到二維碼，并設置簽到時間，學生通過“文旌課堂APP”掃描“簽到二維碼”進行簽到。。掃碼下載文旌課堂APP掃碼簽到

靜態(tài)的線框原型很難完整地表達出設計師的設計思維，尤其是交互思維，而要表達交互思維，就需要制作交互動效。??本章介紹制作UI交互動效的相關軟件及其操作方法，一方面可以使學習者更好地理解和掌握軟件，另一方面可以培養(yǎng)同學們腳踏實地、精益求精的良好品質(zhì)。單元導讀★了解AfterEffects軟件的基礎知識知識目標★加強練習，在實踐中培養(yǎng)自己的專業(yè)技能和職業(yè)素養(yǎng)★完善作品設計，培養(yǎng)精益求精的良好品質(zhì)

思政目標★掌握AfterEffects的基本操作★掌握使用AfterEffects制作UI交互動效的方法與技巧★掌握使用AfterEffects預覽、渲染和導出交互動效的方法

技能目標學習目標4.1

初識AfterEffects

AdobeAfterEffects是Adobe公司推出的一款動態(tài)圖形制作和視覺效果設計軟件，由于其自身強大、豐富的動效制作和高度靈活的2D、3D合成功能，以及數(shù)百種預設的效果與動畫，被廣泛應用于UI交互動效設計、視頻后期合成處理等領域。AfterEffects支持無限多個圖層，能夠直接導入Illustrator和Photoshop文件，并且保留文件中的圖層，實現(xiàn)了與Adobe公司其他相關軟件的無縫銜接。除此之外，AfterEffects還配有多種內(nèi)置插件，以滿足更復雜、更獨特的設計要求。

4.1

初識AfterEffects

在學習AfterEffects之前，要先了解該軟件的操作界面，如圖所示。

4.1初識AfterEffects下面簡單介紹界面中不同區(qū)域的功能。（1）標題欄：其中包括軟件名和正在制作的項目名稱，以及最小化、還原、關閉按鈕。（2）菜單欄：位于標題欄下方，AfterEffects的大部分功能都位于該區(qū)域，選擇菜單項可執(zhí)行相應功能，包括調(diào)整參數(shù)、切換面板和添加效果等。（3）工具欄：包括選取工具、縮放工具、形狀工具、文本工具、繪圖工具和Roto筆刷等制作交互動效的常用工具。要使用某個工具，單擊選擇即可。鼠標左鍵長按工具右下方的◢按鈕，可以在下拉列表中查看并選擇隱藏工具。（4）“項目”面板：用于管理項目中的所有素材和合成，上方為素材與合成的預覽區(qū)域，下方為文件列表區(qū)域，可以對素材和合成進行導入、新建、刪除、編輯等操作。（5）“合成”窗口：一般位于界面正中，是交互動效的預覽區(qū)，可以顯示當前合成和素材的效果。4.1初識AfterEffects

（6）“時間軸”面板：一般位于界面底部，是用于組織素材的重要區(qū)域，可以對圖層進行選擇、創(chuàng)建、排序和重命名等操作，還可以添加和設置關鍵幀。

除上述常用面板外，還有一些工作面板，在菜單欄的“窗口”菜單中選擇面板名稱即可打開相應面板，如圖所示。選擇“窗口/工作區(qū)”菜單項，可在其子菜單中選擇不同的界面布局；單擊工具欄中的按鈕，也可在下拉列表中選擇不同的界面布局，如圖所示。

“窗口”子菜單

改變界面布局4.2AfterEffects基本操作4.2.1項目文件基本操作

AfterEffects與其他軟件有一個明顯的不同之處，就是在該軟件中創(chuàng)建的項目不能直接操作，還需要在項目文件中創(chuàng)建合成。

1．創(chuàng)建和打開項目文件

在啟動軟件時，會出現(xiàn)“開始”界面，在該界面中單擊“新建項目”按鈕可以創(chuàng)建新項目；單擊“打開項目”按鈕，可以在彈出的“打開”對話框中選擇并打開本地項目文件，另外，該界面還會列出“最近使用項”，直接單擊項目名稱即可打開對應的項目文件，如圖所示。

“開始”界面4.2AfterEffects基本操作關閉“開始”界面后，可以通過選擇“文件/新建/新建項目”菜單項創(chuàng)建新項目；或者選擇“文件/打開項目...”菜單項，在彈出的“打開”對話框中選擇并打開本地項目文件，如圖所示。創(chuàng)建項目或打開本地項目文件

在AfterEffects中一次只能打開一個項目文件，如果在已有項目打開時創(chuàng)建或打開新項目，系統(tǒng)將提醒你保存已經(jīng)打開的項目并將其關閉，之后再創(chuàng)建或打開新項目。4.2AfterEffects基本操作

2．創(chuàng)建合成

合成是動效的框架，每個合成都有自己的時間軸，一個項目文件可以包含數(shù)百個合成，每個合成都單獨列于“項目”面板中，雙擊“項目”面板中的合成可以在“合成”窗口中顯示該合成的效果，并且合成中的圖層將顯示于“時間軸”面板中。

如果要創(chuàng)建新的空白合成，可以先選擇“合成/新建合成...”菜單項，在彈出的“合成設置”對話框中設置合成的相關選項；然后單擊“確定”按鈕。

如果要基于素材創(chuàng)建合成，可先雙擊“項目”面板文件列表區(qū)域的空白處，在彈出的“導入文件”對話框中選擇文件；然后單擊“導入”按鈕即可導入文件，并顯示于“項目”面板中。在“項目”面板中還會基于該文件自動創(chuàng)建一個與該文件名稱相同的合成。

另外，在創(chuàng)建項目文件之后，在“合成”窗口中也提供了兩個創(chuàng)建合成的按鈕，分別是“新建合成”和“從素材新建合成”，直接單擊并進行操作即可。

★提示：基于素材創(chuàng)建合成時，可以同時選中多個素材。4.2AfterEffects基本操作

3．保存和關閉項目文件“文件”菜單中有多個保存項目文件的菜單項，如圖所示。

文件菜單中的保存命令

選擇“文件/保存”菜單項，在彈出的“另存為”對話框中設置保存位置，輸入文件名，然后單擊“保存”按鈕即可保存項目文件；選擇“文件/另存為/另存為...”菜單項，可將保存過的文件作為新文件保存到其他位置。4.2AfterEffects基本操作知識鏈接：AfterEffects源文件的后綴為“.aep”，而它可以渲染輸出的后綴為“.avi”

“.mov”“.png”和“.jpg”文件等。

要將項目保存為項目副本，可以選擇“文件/增量保存”菜單項，將文件保存于原始文件所在的文件夾中，此時的文件名稱為在原始文件名基礎上添加一個數(shù)字，當原始文件名最后一位是數(shù)字時，該數(shù)字加1。

要使項目文件可以用舊版本軟件打開，可以選擇“文件/另存為/將副本另存為...（主要版本號）”菜單項，彈出“將副本另存為...（主要版本號）”對話框，在其中選擇保存位置，輸入文件名，然后單擊“保存”按鈕即可保存項目文件為早期版本。

保存項目文件之后選擇“文件/關閉項目”菜單項，可關閉當前打開的項目文件。4.2AfterEffects基本操作

4.2.2導入素材

1．導入普通圖像文件

使用AfterEffects制作交互動效，經(jīng)常需要從外部導入各種格式的素材文件，選擇“文件/導入”子菜單中的各項可以導入不同類型的文件，如圖所示。導入素材選項4.2AfterEffects基本操作

在“文件/導入”子菜單中選擇“文件...”菜單項可打開“導入文件”對話框，在此對話框中選擇文件，并單擊“導入”或“導入文件夾”按鈕即可將文件導入項目文件中；要導入序列圖像，需要在對話框中單擊序列圖像中的第一張圖像，并勾選“...序列”復選框，然后單擊“導入”按鈕，如圖所示?！皩胛募睂υ捒?/p>

★提示：視頻和音頻素材的導入方法與靜止圖像的導入相同。4.2AfterEffects基本操作

2．導入Photoshop和Illustrator文件

為了制作出效果精彩的交互動效，經(jīng)常需要把專業(yè)圖像設計軟件中制作的文件導AfterEffects中。在AfterEffects中可以直接導入Photoshop和Illustrator的分層文件，尤其是Photoshop文件，在AfterEffects中可以顯示其所有屬性。設置對話框

選擇“文件/導入/文件...”菜單項，在彈出的“導入文件”對話框中選擇PSD格式或AI格式文件，單擊“導入”按鈕，彈出設置對話框，在該對話框的“導入種類”下拉列表中選擇導入類型，然后單擊“確定”按鈕，即可將Photoshop或Illustrator文件導入AfterEffects中，如圖所示。

4.2AfterEffects基本操作

當導入文件時，在對話框中，選擇不同的導入種類和圖層選項會使文件導入后呈現(xiàn)不同的狀態(tài)。

（1）當選擇導入種類為“素材”時，可在圖層選項處：

①勾選“合并的圖層”單選鈕，將文件的所有圖層合并為一個圖層并導入為靜止圖像；

②勾選“選擇圖層”單選鈕，并在后面的下拉列表中選擇圖層，將選擇的圖層導入為靜止圖像。

（2）當選擇導入種類為“合成”時，會使導文件中的每個圖層保持為獨立圖層，并使導入文件中的每個圖層都匹配合成的大小。此時在圖層選項處：

①勾選“可編輯的圖層樣式”單選鈕，可使圖層的樣式屬性為可編輯狀態(tài)；

②勾選“合并圖層樣式到素材”單選鈕，可使導入文件為分層文件，圖層樣式不可編輯，可以加快渲染速度，但導入的圖像外觀與原文件相比會有所不同。

（3）當選擇導入種類為“合成-保持圖層大小”時可使導入文件中的每個圖層保持為獨立圖層，并且使導入文件中的圖層尺寸保持原尺寸不變，其圖層選項與選擇導入種類為“合成”時的圖層選項相同。4.2AfterEffects基本操作

在將專業(yè)圖像設計軟件的源文件導入AfterEffects中時，還需要注意以下四點。

（1）圖層尺寸最好為整數(shù)，因為在AfterEffects中會將小數(shù)自動四舍五入為整數(shù)，可能導致圖層兩邊出現(xiàn)黑線。

（2）當導入AfterEffects中的素材文件本身發(fā)生變化或在電腦中的位置發(fā)生改變時，會使軟件無法找到該文件的原始圖層或位置，此時，在“項目”面板中會將其列為“缺失”項。雙擊“缺失”項，可在彈出的“替換素材文件（...）”對話框中重新為該項選擇素材。

（3）導入AfterEffects中的文件的顏色模式最好為RGB模式。

（4）要想顯示透明區(qū)域，需要創(chuàng)建Alpha通道，或使用專業(yè)圖像設計軟件中的透明度工具。4.2AfterEffects基本操作案例練習4-1

導入PSD格式文件為合成步驟1在AfterE?ects中新建項目，選擇“文件/導入/文件...”菜單項，在彈出的“導入文件”對話框中選擇“素材與實例/第4章/案例4-1/中秋節(jié).psd”文件，如圖所示。單擊“導入”按鈕，彈出設置對話框。“導入文件”對話框

基于文件創(chuàng)建合成4.2AfterEffects基本操作案例練習4-1

導入PSD格式文件為合成步驟2在設置對話框中選擇導入種類為“合成-保持圖層大小”，在圖層選項處勾選“合并圖層樣式到素材”單選鈕，然后單擊“確定”按鈕導入文件，此時在“項目”面板中基于該文件就自動創(chuàng)建了一個合成，如圖所示。

★提示：將素材導入為合成時，軟件會在“項目”面板自動生成一個與PSD文件名稱相同的合成，位于素材文件夾上方，因此導入前可以不提前創(chuàng)建合成?！皩胛募睂υ捒?/p>

基于文件創(chuàng)建合成4.2AfterEffects基本操作步驟3雙擊“項目”面板中自動生成的合成，“合成”窗口中將顯示與PSD素材圖像相同的效果，并且在“時間軸”面板中列出與PSD文件中圖層相對應的圖層，如圖所示。

導入PSD格式文件為合成后的工作界面效果案例練習4-1

導入PSD格式文件為合成步驟4選擇“文件/保存”菜單項，彈出“另存為”對話框，在其中設置保存位置，輸入文件名稱，然后單擊“保存”按鈕保存當前項目。4.3.1“時間軸”面板

在AfterEffects中制作交互動效的大多數(shù)操作都是在“時間軸”面板中完成的，因此想要制作交互動效就要先認識“時間軸”面板。

1．認識“時間軸”面板

“時間軸”面板主要分為圖層控制區(qū)域和時間線區(qū)域兩大部分，另外還包括時間碼、搜索框與合成開關等，如圖所示?！皶r間軸”面板4.3

交互動效制作基礎

圖層控制區(qū)域由13列組成，右鍵單擊列標題欄，在快捷菜單的“列數(shù)”子菜單中單擊列名稱，即可在“時間軸”面板中顯示或隱藏列，如圖所示。時間線區(qū)域由時間線和時間指示器組成，如圖所示。每個圖層都有對應的時間線，時間指示器所在的位置稱為當前時間，并且會在時間碼中顯示。列數(shù)菜單時間線和時間指示器4.3

交互動效制作基礎

位于面板最左側，該區(qū)域的按鈕及其功能從左到右分別為：“視頻”按鈕，單擊它可以在“合成”窗口中顯示或隱藏對應圖層的內(nèi)容；“音頻”按鈕，當在圖層上添加了音頻素材，圖層上會自動添加音頻圖標，單擊對應圖層的“音頻”按鈕可以播放或隱藏該圖層上的音頻；“獨奏”按鈕，單擊某個圖層上的該按鈕，可以在“合成”窗口中只顯示該圖層的內(nèi)容，而隱藏其他圖層中的內(nèi)容；“鎖定”按鈕，單擊某個圖層上的該按鈕可以鎖定或取消鎖定圖層內(nèi)容，當圖層被鎖定時，圖層內(nèi)容不可編輯。接下來簡單介紹“時間軸”面板中的主要設置項。1）A/V設置項4.3

交互動效制作基礎

（1）“模式”選項，在該選項的下拉列表中可以選擇圖層混合模式，默認為“正?！蹦Ｊ?。

（2）“T”（保留基礎透明度）選項，用于設置是否保留圖層的基礎透明度。當AE文件中存在多個蒙版圖層，需要同時作用于同個視頻或圖片畫面時，就需要用到該功能。

（3）“TrkMat”（軌道遮罩）選項，在其下拉列表中可以設置當前圖層與其上方圖層的軌道遮罩類型，默認為“無”。

2）“轉換控制”選項

單擊“時間軸”面板左下角的“展開或折疊‘轉換控制’窗格”按鈕，或右鍵單擊列的標題欄，在彈出的快捷菜單中選擇“列數(shù)/模式”，均可在“時間軸”面板中顯示出每個圖層的“轉換控制”選項。

4.3

交互動效制作基礎

3）父級和鏈接

父級和鏈接用于指定父級圖層，父級所做的修改將全部應用于子級圖層上（不透明度除外），而對子級圖層所做的修改不會影響父級圖層。

設置父子鏈接的方式有兩種：一種是在圖層“父級和鏈接”列的下拉列表中選擇一個圖層作為當前圖層的父級圖層；另一種是直接拖動圖層中的“父級關聯(lián)器”按鈕到目標圖層。

4.3

交互動效制作基礎

4）“時間控制”選項

單擊“時間軸”面板左下角的“展開或折疊‘入點’/‘出點’/‘持續(xù)時間’/‘伸縮’窗格”按鈕，可在“時間軸”面板中顯示出每個圖層的“時間控制”選項。（1）“入點”選項，用于顯示當前圖層時間線的入點時間，也就是圖層內(nèi)容出現(xiàn)在合成中的時間。單擊文字可打開對話框重新設置時間。（2）“出點”選項，用于顯示當前圖層時間線的出點時間，也就是圖層內(nèi)容在合成中隱藏的時間。（3）“持續(xù)時間”選項，用于顯示當前圖層時間線從入點到出點的時間范圍。（4）“伸縮”選項，用于控制動效的播放速度，調(diào)整其數(shù)值可以達到快放或慢放的效果。知識鏈接：按快捷鍵“[”或“]”可以在不改變當前所選時間線持續(xù)時間的情況下，使該時間線的入點或出點位于當前時間；按快捷鍵“Alt+[”或“Alt+]”，可以將當前所選時間線的入點或出點修剪到當前時間，同時改變該時間線的持續(xù)時間。4.3

交互動效制作基礎

2．圖層基本操作

1）基礎操作

（1）重命名。右鍵單擊圖層名稱，在彈出的快捷菜單中選擇“重命名”即可為圖層重命名。

（2）創(chuàng)建圖層。右鍵單擊圖層控制區(qū)域的空白處，在快捷菜單的“新建”子菜單中選擇不同類型的圖層，可新建相應圖層。其中，最常用到的圖層是純色圖層、形狀圖層和文本圖層。

2）選擇圖層

（1）選擇圖層。單擊圖層名稱或圖層所對應的時間線，或在數(shù)字鍵盤上輸入圖層編號（圖層名稱左側的數(shù)字），均可選擇圖層。按快捷鍵“Ctrl+↓”或“Ctrl+↑”可選擇當前所選圖層的下一個圖層或上一個圖層。

（2）多選圖層。在工具欄中選擇選取工具，在“時間軸”面板中按下鼠標左鍵并拖動可框選多個圖層；在選擇圖層時，按住快捷鍵“Shift”，可進行多選；按快捷鍵“Ctrl+Shift+↑/↓”可同時選中當前所選圖層和它的上一個或下一個圖層。4.3

交互動效制作基礎

（3）選擇被遮擋的圖層。要選擇在“合成”窗口中被遮擋的圖層，可以在“合成”窗口的該圖層內(nèi)容上方右鍵單擊，在快捷菜單的“選擇”子菜單中選擇圖層名稱。

（4）全選。先單擊“時間軸”面板或“合成”窗口任意區(qū)域，然后選擇“編輯/全選”菜單項或按快捷鍵“Ctrl+A”，可選中當前合成中的所有圖層。

（5）反向選擇。右鍵單擊選中圖層，在彈出的快捷菜單中選擇“反向選擇”，可選中除當前選中圖層外的所有圖層。

（6）選擇標簽組。單擊標簽色塊（圖層編號左側的色塊），在下拉列表中選擇“選擇標簽組”，或選擇“編輯/標簽/選擇標簽組”菜單項，可同時選中標簽顏色相同的圖層。

（7）選擇子圖層。選中父圖層并單擊右鍵，在彈出的快捷菜單中選擇“選擇子項”，可選中該父圖層的子圖層。4.3

交互動效制作基礎

3）改變圖層排序

在“時間軸”面板中，按下鼠標左鍵向上或向下拖動圖層，可以改變圖層的排序；選中圖層后，按快捷鍵“Ctrl+Alt+↑/↓”可將該圖層上移或下移；按快捷鍵“Ctrl+Alt+Shift+↑/↓”可將圖層置頂或置底；選擇菜單欄“圖層/排列”子菜單中的選項也可以改變圖層排序，如圖所示。4.3

交互動效制作基礎改變圖層排序展開或折疊屬性

3．圖層屬性

每個圖層都有一個基礎屬性組，即“變換”屬性組，其中包括“錨點”“位置”“縮放”“旋轉”和“不透明度”屬性。單擊圖層名稱或?qū)傩越M名稱左側的“>”按鈕可展開屬性組；單擊“﹀”按鈕可折疊屬性組，如圖所示。

可以通過單擊屬性名稱右側的藍色數(shù)字并輸入數(shù)值來設置屬性值，也可以通過在藍色數(shù)字上按下鼠標左鍵并左右拖動來設置屬性值。4.3

交互動效制作基礎

1）“錨點”屬性

“錨點”屬性主要用于設置素材的中心點位置。對素材做縮放、旋轉、移動等操作時，都是基于素材的中心點進行的。

選中圖層按快捷鍵“A”，可以顯示該圖層的“錨點”屬性。選擇圖層，按快捷鍵“Ctrl+Alt+Home”可以使該圖層中內(nèi)容的錨點位于圖層內(nèi)容的中心位置。在工具欄中選擇“向后平移（錨點）工具”，可以在“合成”窗口中按下鼠標左鍵拖動錨點，調(diào)整錨點位置，如圖所示。調(diào)整錨點位置

2）“位置”屬性

“位置”屬性主要用于控制素材在“合成”窗口中的位置。選擇圖層按快捷鍵“P”，可以顯示該圖層的“位置”屬性。除設置“位置”屬性值外，在工具欄中選擇選取工具，在“合成”窗口中按下鼠標左鍵拖動素材，也可改變素材位置。4.3

交互動效制作基礎

3）“縮放”屬性

“縮放”屬性主要用于設置素材在“合成”窗口中的大小，選擇圖層按快捷鍵“S”，可以顯示該圖層的“縮放”屬性。除設置“縮放”屬性值外，在工具欄中選擇選取工具，先在“合成”窗口中選擇素材，然后按下鼠標左鍵拖動素材周圍的控制點，也可改變素材大小，如圖所示。在按下鼠標左鍵對素材進行縮放操作時，按住快捷鍵“Shift”，可使素材等比例縮放。

拖動控制點縮放素材

★提示：“錨點”屬性、“位置”屬性和“縮放”屬性右側有兩個數(shù)值，第一個數(shù)值是屬性的x值，代表素材在水平方向上所做的改變；第二個數(shù)值是屬性的

y

值，代表素材在垂直方向上所做的改變。4.3

交互動效制作基礎

4）“旋轉”屬性

“旋轉”屬性主要用于設置素材的旋轉角度，選擇圖層按快捷鍵“R”，可以顯示圖層的“旋轉”屬性。除設置“旋轉”屬性值外，在工具欄中選擇旋轉工具，在“合成”窗口中選擇素材并按下鼠標左鍵進行拖動，也可改變素材的旋轉角度。

★提示：“旋轉”屬性右側有兩個數(shù)值，第一個數(shù)值用于設置素材的旋轉圈數(shù)，數(shù)值為正數(shù)代表順時針旋轉，數(shù)值為負數(shù)則代表逆時針旋轉；第二個數(shù)值用于設置素材的旋轉角度。4.3

交互動效制作基礎

5）“不透明度”屬性

“不透明度”屬性用于設置圖層的不透明度，選擇圖層按快捷鍵“T”，可以顯示圖層的“不透明度”屬性。

★提示：當圖層已顯示有圖層屬性時，按住快捷鍵“Shift”的同時按顯示屬性的快捷鍵，可在保留當前顯示屬性的同時顯示與快捷鍵相對應的屬性。4.3

交互動效制作基礎

要顯示或隱藏屬性，還可以使用以下方法：

按住快捷鍵“Ctrl”的同時按“>”按鈕，或選中圖層后按快捷鍵“Ctrl+`”，可展開圖層的所有屬性組；按住快捷鍵“Ctrl”的同時按“﹀”按鈕，或再次按快捷鍵“Ctrl+`”，可折疊圖層的所有屬性組；按住快捷鍵“Alt+Shift”的同時單擊屬性名稱，可折疊該屬性。

例如，要添加“逐漸顯示”動效，可以在開始位置添加關鍵幀，設置“不透明度”屬性值為0%，在過1秒的位置再次添加關鍵幀，設置“不透明度”屬性值為100%，在這1秒之中，計算機會自動進行計算使圖層不透明度從0%變化到100%，從而實現(xiàn)動畫。

例如，使圖層的“不透明度”屬性在1秒內(nèi)從0%變化到100%，達到使圖層“逐漸顯示”的效果。關鍵幀就是在改變圖層屬性時為其指定的時間點，在制作動效時，至少要設置兩個關鍵幀，一個對應變化開始的狀態(tài)，另一個對應變化結束的狀態(tài)，中間的動態(tài)部分則由計算機通過計算得出。

4.3.2關鍵幀

1．什么是關鍵幀

AfterE?ects是通過使圖層屬性隨時間變化而實現(xiàn)動效的。4.3

交互動效制作基礎

2．添加關鍵幀

在“時間軸

”面板中，選擇要添加關鍵幀的圖層屬性，并單擊屬性名稱左側的“秒表”按鈕，即可激活秒表并在當前“時間指示器”的位置添加關鍵幀，如圖所示。也可以在選中圖層屬性后，選擇“動畫/添加...關鍵幀”菜單項，在當前位置添加關鍵幀。

★提示：需要注意的是，在“秒表”按鈕激活狀態(tài)下，再次單擊該按鈕，將取消該屬性“秒表”的激活狀態(tài)，同時刪除該屬性的所有關鍵幀。4.3

交互動效制作基礎

添加關鍵幀后，該屬性的最左側會出現(xiàn)三個按鈕，分別是“轉到上一個關鍵幀”“在當前時間添加或移除關鍵幀”和“轉到下一個關鍵幀”，如圖所示。如果當前“時間指示器”位置有關鍵幀，單擊“在當前時間添加或移除關鍵幀”按鈕，會刪除此關鍵幀，如果當前位置沒有關鍵幀，單擊該按鈕會添加新關鍵幀。4.3

交互動效制作基礎

★提示：當“時間軸”面板中的“鍵”列處于顯示狀態(tài)時，上述三個按鈕將位于該列的對應區(qū)域。4.3

交互動效制作基礎

選擇關鍵幀的方法有以下四種。

（1）在“時間軸”面板中單擊關鍵幀，可選擇關鍵幀。

（2）按快捷鍵“Shift”的同時單擊關鍵幀，或者在面板中的空白位置按下鼠標左鍵并拖動，可同時選擇多個關鍵幀。如果是已經(jīng)選中的關鍵幀，按快捷鍵“Shift”的同時單擊它，可取消選擇。

3．編輯關鍵幀

1）選擇關鍵幀

當關鍵幀被選中時會顯示為藍色，當未被選中時會顯示為灰色，如圖所示。

（3）單擊屬性名稱，或者在圖表編輯器模式中按住快捷鍵“Alt”的同時單擊兩個關鍵幀之間的線段，可選擇該屬性中的所有關鍵幀。

（4）右鍵單擊選中的關鍵幀，在彈出的快捷菜單中選擇“選擇相同關鍵幀”“選擇前面的關鍵幀”或“選擇跟隨關鍵幀”，可選擇相應關鍵幀。

2）刪除關鍵幀

選中關鍵幀后按快捷鍵“Delete”，或選擇“編輯/清除”菜單項，可刪除選中的關鍵幀。

3）復制關鍵幀

復制關鍵幀時，一次只能復制一個圖層的關鍵幀，將所選關鍵幀粘貼到其他圖層時，關鍵幀將添加在當前圖層的相應屬性中，最早的關鍵幀會位于當前“時間指示器”的位置，其余關鍵幀依次排列。想要將某個屬性的關鍵幀復制到不同屬性時，一次只能復制一個屬性的關鍵幀。4.3

交互動效制作基礎

復制粘貼關鍵幀的具體步驟如下：

選擇需要復制的關鍵幀，選擇“編輯/復制”菜單項，或按快捷鍵“Ctrl+C”；選擇目標圖層或目標圖層屬性，將“時間指示器”移到所需位置；選擇“編輯/粘貼”菜單項，或按快捷鍵“Ctrl+V”即可。

4）移動關鍵幀

移動關鍵幀可以針對單個關鍵幀，也可以針對多個關鍵幀，移動多個關鍵幀時會保持關鍵幀之間的相對位置。當選擇關鍵幀后，按下鼠標左鍵左右拖動可移動關鍵幀，按快捷鍵“Alt+←/→”也可以移動關鍵幀。選擇三個及以上的關鍵幀，按住快捷鍵“Alt”的同時左右拖動第一個或最后一個關鍵幀，可以擴展或收縮關鍵幀之間的距離。4.3

交互動效制作基礎

★提示：在更改關鍵幀值時，要確保當前“時間指示器”位于關鍵幀上，否則將會添加新的關鍵幀。也可以通過雙擊關鍵幀或右鍵單擊關鍵幀在彈出的快捷菜單中選擇“編輯幀”來更改關鍵幀的值。4.3

交互動效制作基礎案例練習4-2

制作界面動效

本案例制作界面動效，效果如圖所示。4.3

交互動效制作基礎步驟1

在AfterE?ects中新建項目，選擇“文件/導入/文件...”菜單項，在彈出的“導入文件”對話框中選擇“素材與實例/第4章/案例4-2/界面動效素材.psd”，單擊“導入”按鈕，彈出設置對話框，在其中設置相關選項，如圖所示。設置對話框4.3

交互動效制作基礎步驟2

單擊“確定”按鈕，導入PSD素材并自動生成合成。在“項目”面板中右鍵單擊生成的合成，在彈出的快捷菜單中選擇“合成設置...”，彈出“合成設置”對話框，在其中設置合成名稱為“界面動效”，幀速率為25，持續(xù)時間為4秒，并單擊“確定”按鈕完成設置，如圖所示。在“合成設置”對話框中修改“持續(xù)時間”4.3

交互動效制作基礎步驟3

雙擊“項目”面板中的合成，在“合成”窗口顯示合成效果，并在“時間軸”面板中顯示合成中的圖層。給燈籠的“位置”屬性添加關鍵幀步驟

4

調(diào)整燈籠在不同關鍵幀的位置，制作其從底部向上飄的效果。選擇“燈籠”圖層，按快捷鍵“P”顯示其“位置”屬性，將“時間指示器”移到0秒位置，單擊屬性名稱左側的“秒表”按鈕為該屬性添加關鍵幀；將“時間指示器”移到2秒位置，單擊“在當前時間添加或移除關鍵幀”按鈕為該屬性添加關鍵幀；采用同樣方法在3秒處添加關鍵幀，如圖所示。4.3

交互動效制作基礎步驟5

單擊0秒處的關鍵幀，使該關鍵幀處于選中狀態(tài)，并確保“時間指示器”位于該位置，設置“位置”屬性值為“2300，7800”，效果如圖所示。使用同樣方法將2秒處的“位置”屬性值設置為“3500，5000”。燈籠在0秒時的位置信息與效果4.3

交互動效制作基礎步驟6

制作小船從左側移出的效果。選擇“小船”圖層，按快捷鍵“P”顯示其“位置”屬性，在0秒、1秒10幀和2秒20幀處為“位置”屬性添加關鍵幀，設置0秒處的屬性值為“-40，7300”，1秒10幀處的屬性值為“1000，7600”。按快捷鍵“Shift+S”顯示其“縮放”屬性，在0秒、1秒10幀和2秒20幀處為“縮放”屬性添加關鍵幀，設置0秒處的屬性值為50%，1秒10幀處的屬性值為80%，如圖所示。“小船”圖層的關鍵幀設置4.3

交互動效制作基礎步驟7

修改散光、光效、燈籠亮光的不透明度，使亮光呈現(xiàn)一閃一閃的效果。選擇“散光”圖層，將“時間指示器”移到2秒05幀位置，按下快捷鍵“Alt+[”，將該圖層時間線的入點修剪到當前時間，如圖所示。使用同樣方法將“光效”圖層和“燈籠亮光”圖層時間線的入點分別修剪到2秒15幀和2秒10幀處。修剪“散光”圖層的時間線入點4.3

交互動效制作基礎步驟8

分別選中步驟7中的三個圖層，并按快捷鍵“T”顯示它們的“不透明度”屬性。在2秒05幀、2秒10幀、2秒17幀和3秒05幀處為“散光”圖層的“不透明度”屬性添加關鍵幀，從左到右設置其屬性值為0%、50%和0%；在2秒15幀、2秒20幀、3秒和3秒10幀處為“光效”圖層的“不透明度”屬性添加關鍵幀，設置屬性值同上；在2秒10幀和3秒處為“燈籠亮光”圖層的“不透明度”屬性添加關鍵幀，并設置2秒10幀處的屬性值為0%，如圖所示。3個圖層的關鍵幀設置4.3

交互動效制作基礎步驟9

制作標題和文本從底部移出，并進行跳動和縮放的效果。同時，選中“標題”圖層和“文本”圖層，將“時間指示器”移到2秒05幀處，按下快捷鍵“Alt+[”，將所選圖層時間線的入點修剪到當前時間，并在當前位置為它們的“位置”屬性添加關鍵幀，按住快捷鍵“Shift”的同時在“合成”窗口中按下鼠標左鍵垂直向下拖動兩段文本，將它們移至界面底部，如圖所示。2秒05幀處“標題”和“文本”圖層的效果

★提示：在“時間軸”面板和“合成”窗口中，雙擊導入的素材會單獨打開該素材并進入“圖層”窗口中，此時，單擊窗口上方的“合成…”選項卡，可回到“合成”窗口。4.3

交互動效制作基礎步驟

10

選擇“標題”圖層的“位置”屬性，在2秒15幀處添加關鍵幀，并設置其y值為5856。步驟

11

選擇“標題”圖層的“縮放”屬性，在2秒15幀、3秒和3秒10幀處添加關鍵幀，并設置3秒處的屬性值為120%。步驟

12

選擇“文本”圖層的“位置”屬性，在3秒、3秒06幀、3秒10幀、3秒14幀和3秒16幀處添加關鍵幀，從左到右設置屬性的y值為6150、6500、6250、6400和6363。步驟

13

此時，大致的界面動效就做好了，選擇“合成/預覽/播放當前預覽”菜單項或按“空格鍵”可預覽動效，再次按“空格鍵”可停止預覽動效。4.3

交互動效制作基礎步驟

14“文本”圖層中的文字可以在圖表編輯器模式下進行調(diào)整，使效果看起來更加和諧。選擇“文本”圖層的“位置”屬性，單擊“圖表編輯器”按鈕，進入圖表編輯器模式，單擊時間線區(qū)域下方的“選擇圖表類型和選項”按鈕，在下拉列表中選擇“編輯速度圖表”顯示速度圖表曲線。

選擇“文本”圖層的“位置”屬性以選中該屬性上的所有關鍵幀，單擊“緩動”按鈕，添加“緩動”效果，如圖所示。4.3

交互動效制作基礎知識鏈接：在現(xiàn)實生活中，并不是所有運動都是勻速的，大多數(shù)運動都是有快慢變化的，為了使交互動效和動畫看起來更加真實，往往要根據(jù)運動速率的特點對運動對象的運動速度進行調(diào)整，此時就用到了“圖表編輯器”。

單擊“時間軸”面板中的“圖表編輯器”按鈕或按快捷鍵“Shift+F3”，可將面板右側的圖層時間線模式轉換為圖表編輯器模式。

在圖表編輯器中，每一個添加關鍵幀的屬性都由曲線表示，曲線中的“點”就是關鍵幀。圖表編輯器一共提供了兩種圖表類型，分別是值圖表（顯示屬性值）和速度圖表（顯示屬性值變化的速率），對于不同屬性默認顯示不同類型的圖表，可以單擊“選擇圖表類型和選項”按鈕，在下拉列表中選擇要編輯的圖表類型。步驟

15最后將文件保存。4.4蒙版和遮罩4.4.1認識蒙版

蒙版的原理，就是透過蒙版中的圖形或輪廓顯示出蒙版下方的內(nèi)容。蒙版依附于圖層，與“變換”屬性組一樣，作為圖層的特殊屬性存在，不是單獨的圖層，且一個圖層可以包含多個蒙版。當為某個圖層創(chuàng)建蒙版后，圖層中位于蒙版范圍內(nèi)的區(qū)域會顯示出來，位于蒙版范圍以外的區(qū)域?qū)⒉槐伙@示，如圖所示。

因此，蒙版的輪廓形狀和范圍決定了被看到的圖像的形狀和范圍，而從蒙版中看到的內(nèi)容取決于圖層中的內(nèi)容。

4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

1．形狀工具

在AfterEffects中，形狀工具包括矩形、圓角矩形、橢圓、多邊形和星形工具。按快捷鍵“Q”可以選擇和循環(huán)切換形狀工具，選擇形狀工具后在“合成”窗口中按下鼠標左鍵并拖動可繪制相應圖形。

當選中圖層為形狀圖層時，選擇形狀工具后，會在工具欄中出現(xiàn)“工具創(chuàng)建形狀”按鈕

和“工具創(chuàng)建蒙版”按鈕

（如圖所示），單擊相應按鈕并在“合成”窗口中繪制圖形可創(chuàng)建形狀或蒙版；當所選圖層不是形狀圖層時，使用形狀工具繪制的圖形會自動轉化為當前選中圖層的蒙版。

4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

1．形狀工具

使用形狀工具按下鼠標左鍵并拖動繪制圖形時，按不同的快捷鍵有不同的功能。（1）當拖動時按“空格鍵”，可在繪制過程中重新放置圖形。（2）當拖動時按住快捷鍵“Ctrl”，可使形狀圍繞其中心進行縮放，注意在釋放鼠標按鍵前不要松開快捷鍵。（3）當拖動時按住快捷鍵“Shift”，可使形狀等比例放大或縮小，以繪制正方形或正圓等圖形。（4）當繪制多邊形或星形時，按快捷鍵“↑/↓”或使用“滾輪”，可增加或減小邊、角數(shù)量。（5）當繪制時按快捷鍵“Esc”可取消繪制。

★提示：在默認情況下，每個形狀工具都會保留最近一次使用時的設置，要重置工具設置，可在工具欄中雙擊形狀工具。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

2．鋼筆工具

在AfterEffects中，鋼筆工具組中包括鋼筆工具，添加、刪除、轉換“頂點”工具和蒙版羽化工具，其中鋼筆工具和蒙版羽化工具可以按快捷鍵“G”選中與切換。

在AfterEffects中，鋼筆工具的使用方法與AxureRP中鋼筆工具的使用方法相同，且使用鋼筆工具創(chuàng)建蒙版的方法與上述使用形狀工具創(chuàng)建蒙版的方法相同。此外，在繪制時按住快捷鍵“Shift”可以使當前頂點的控制手柄按45°的倍數(shù)改變方向。

選擇鋼筆工具，在繪制之前勾選工具欄中的“RotoBezier”復選框（如圖所示），可創(chuàng)建不包含控制手柄的形狀，此時形狀頂點的手柄方向和路徑的彎度是通過自動計算得出的。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

2．鋼筆工具

知識鏈接：除使用上述兩種工具創(chuàng)建蒙版外，也可以用文字創(chuàng)建蒙版。在“合成”窗口中雙擊文字進入其編輯狀態(tài)，選擇文字，右鍵單擊所選文字，在彈出的快捷菜單中選擇“從文字創(chuàng)建蒙版”；或者選中文本圖層，在“合成”窗口右鍵單擊選中的文本，在彈出的快捷菜單中選擇“創(chuàng)建/從文字創(chuàng)建蒙版”或選擇“圖層/創(chuàng)建/從文字創(chuàng)建蒙版”菜單項，均可基于文字輪廓創(chuàng)建蒙版，并將蒙版放置在新的圖層中。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

當創(chuàng)建蒙版后，在“時間軸”面板中單擊蒙版名稱左側的“>”按鈕，可展開蒙版屬性，此時“>”按鈕變?yōu)椤唉濉卑粹o，如圖所示。通過設置蒙版屬性可以對圖層蒙版效果進行設置，并且可以為蒙版屬性添加關鍵幀制作出形式多樣的蒙版動效。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

1．蒙版路徑

蒙版路徑用于控制蒙版的圖形形狀和范圍。為方便識別，在“合成”窗口中繪制的蒙版路徑是有顏色的，并且在“時間軸”面板中該蒙版名稱左側會顯示與蒙版路徑相同的顏色。

單擊“蒙版路徑”屬性右側的“形狀...”文字，彈出“蒙版形狀”對話框，在其中可以改變蒙版路徑的形狀與大小，如圖所示；在工具欄中選擇選取工具，單擊選擇圖層控制區(qū)域的圖層名稱，可以在“合成”窗口中按下鼠標左鍵并拖動蒙版路徑的“頂點”改變蒙版路徑的形狀；單擊選擇蒙版名稱，可以在“合成”窗口中按下鼠標左鍵并拖動蒙版路徑，改變蒙版路徑的位置；雙擊蒙版形狀的邊框顯示其變換框，按下鼠標左鍵拖動變換框可以改變蒙版路徑的形狀和大小。

4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

2．蒙版羽化

使用蒙版羽化可以實現(xiàn)更為自然的融合效果，在默認情況下，羽化寬度跨蒙版邊緣，一半在內(nèi)一半在外。

選擇添加蒙版的圖層后按快捷鍵“F”，可顯示已添加蒙版圖層的“蒙版羽化”屬性；修改“蒙版羽化”右側的藍色數(shù)字可以按比例設置羽化值；單擊“約束比例”按鈕，可以鎖定或解除水平和垂直方向的約束比例，分別設置水平和垂直方向的羽化值。

未設置羽化效果和設置了羽化效果的對比如圖所示。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

3．蒙版不透明度

蒙版不透明度用于設置蒙版的不透明度，設置不透明度為50%的蒙版效果如圖所示。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

4．蒙版擴展

“蒙版擴展”屬性用于擴展或收縮受蒙版影響的區(qū)域，實際指的就是蒙版區(qū)域與蒙版路徑的距離，是一個偏移量，當數(shù)值為“正”時，蒙版區(qū)域擴展；數(shù)值為“負”時，蒙版區(qū)域收縮，如圖所示。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

5．反轉

選擇“反轉”復選框后，可以反轉當前蒙版的形狀和路徑區(qū)域，效果如圖所示。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

6．蒙版模式

蒙版模式用于控制圖層中的蒙版與其上方蒙版之間的交互方式，僅作用于同一圖層上的不同蒙版之間。在默認情況下，所有蒙版均設置為“相加”，此外，還包括“無”“相減”“交集”“變亮”“變暗”“差值”，可以從“時間軸”面板中的蒙版名稱右側的下拉列表中選擇蒙版模式，效果如圖所示。4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

6．蒙版模式

下面簡述各個蒙版模式的功能和應用效果。

（1）無：蒙版對圖層沒有直接影響，如圖所示。對蒙版添加“填充”“描邊”等效果時可以選擇該模式。

（2）相加：與上方蒙版疊加后的效果，如圖所示。無

相加4.4蒙版和遮罩4.4.2創(chuàng)建蒙版常用工具

6．蒙版模式

下面簡述各個蒙版模式的功能和應用效果。

（3）相減：從上方蒙版的效果中減去該蒙版的效果，如圖所示。

（4）交集：僅在與上方蒙版的相交區(qū)域中產(chǎn)生蒙版效果，如圖所示。相減

交集（5）變亮、變暗和差值模式只對蒙版的不透明度產(chǎn)生影響，此處不做過多介紹，有興趣的同學們可自行嘗試。案例練習4-3制作蒙版位移動效

本案例制作蒙版位移動效，效果如圖所示。該動效是通過為文字添加蒙版并為“蒙版路徑”屬性和圖層的“位置”屬性添加關鍵幀實現(xiàn)的。4.4蒙版和遮罩步驟1

在AfterEffects中新建項目，單擊“合成”窗口中的“從素材新建合成”按鈕，彈出“導入文件”對話框，先在其中選擇“素材與實例/第4章/案例4-3/啟動頁.jpg”；然后單擊“導入”按鈕，導入素材并自動創(chuàng)建合成，如圖所示。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟2

在工具欄中選擇直排文字工具，在“合成”窗口中單擊，輸入“恭賀新春”，此時在“時間軸”面板中會新建文本圖層，如圖所示。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟3

選中文字，在“字符”面板中設置字體為“文鼎CS大宋”，字體大小為190像素，顏色為黃色“#FFDD88”，字符間距為112，水平縮放為90%，如圖所示。

選擇文本圖層，先按快捷鍵“Ctrl+Alt+Home”使文本的錨點位于其中心位置，然后設置文本圖層“變換”屬性組中的“位置”屬性值為“272，548”。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟4

在工具欄中選擇矩形工具，確保文本圖層為選中狀態(tài)，在“合成”窗口的文本框左上角按下鼠標左鍵并向右下方拖動繪制矩形蒙版，使矩形蒙版完全遮蓋文本，如圖所示。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟5

先在“時間軸”面板中單擊文本圖層左側的“﹀”按鈕折疊圖層屬性，然后依次按快捷鍵“M”和“Shift+P”，同時顯示圖層的“蒙版路徑”屬性和“位置”屬性，將“時間指示器”移到1秒15幀位置，依次單擊這兩個屬性名稱左側的“秒表”按鈕添加關鍵幀。步驟6

將“時間指示器”移到15幀位置，為“蒙版路徑”屬性和“位置”屬性添加關鍵幀，設置“位置”屬性的x值為92，在工具欄中選擇選取工具，在“合成”窗口中雙擊蒙版路徑，然后在文本框左側邊框中心按下鼠標左鍵向右拖動蒙版路徑，直至文字完全消失，如圖所示。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟7

同時選中1秒15幀處的兩個關鍵幀，單擊“圖表編輯器”按鈕

，進入圖表編輯器模式，單擊時間線區(qū)域下方的“緩動”按鈕

，為其添加“緩動”效果，如圖所示。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩步驟8

最后將文件保存。案例練習4-3制作蒙版位移動效4.4蒙版和遮罩

春節(jié)與清明節(jié)、端午節(jié)、中秋節(jié)并稱為中國四大傳統(tǒng)節(jié)日。春節(jié)即中國農(nóng)歷新年，俗稱“新春、新歲、歲旦”等，口頭上又稱“過年、過大年”。春節(jié)歷史悠久，由上古時代歲首祈歲祭祀演變而來，蘊含著深邃的文化內(nèi)涵。

春節(jié)期間，全國各地均有各種慶賀新春的活動，以除舊布新、驅(qū)邪攘災、拜神祭祖、納福祈年為主要內(nèi)容，形式豐富多彩，凝聚著中華傳統(tǒng)文化精華。

隨著中國綜合國力的顯著提升，中國文化的輻射領域也在不斷擴大。春節(jié)作為中華民族最隆重的傳統(tǒng)節(jié)日，正在擴展成為一個世界性的節(jié)日。源遠流長4.4蒙版和遮罩4.4.4軌道遮罩

軌道遮罩可以使一個圖層的內(nèi)容透過另一個圖層定義的形狀顯現(xiàn)出來，是一個單獨的圖層，且只能應用于下方圖層，如果想應用于多個圖層，需要將多個圖層進行預合成。知識鏈接：

如果要對合成中已有的圖層進行分組，可以對這些圖層進行預合成。進行預合成的圖層會被放置在新的合成中，并且該預合成將替換原始合成中的圖層列于“時間軸”面板中?？梢詫㈩A合成作為單個圖層在其他合成中使用，并對其進行各種操作。

在“時間軸”面板中選擇所需圖層，選擇“圖層/預合成...”菜單項或者按快捷鍵“Ctrl+Shift+C”，在彈出的“預合成”對話框中輸入合成名稱，并進行相關設置，然后單擊“確定”按鈕即可將所選圖層合并為預合成，如圖所示。4.4蒙版和遮罩4.4.4軌道遮罩

制作軌道遮罩需要執(zhí)行以下操作。

（1）首先確保在“時間軸”面板中的“模式”列可見。如不可見，可在“時間軸”面板中右鍵單擊列的標題欄，并在彈出的快捷菜單中選擇“列數(shù)/模式”顯示該列。

（2）在“時間軸”面板中拖動圖層，確保作為軌道遮罩的圖層位于要顯示內(nèi)容的圖層上方。

（3）在下方圖層的“TrkMat”下拉列表中選擇任一選項，定義遮罩類型，如圖所示。4.4蒙版和遮罩4.4.4軌道遮罩

其中，Alpha遮罩，是利用素材的Alpha通道創(chuàng)建軌道遮罩；Alpha反轉遮罩，是反轉素材的Alpha通道創(chuàng)建軌道遮罩；亮度遮罩，是利用素材的亮度創(chuàng)建軌道遮罩；亮度反轉遮罩，是反轉素材的亮度通道創(chuàng)建軌道遮罩。

（4）此時，軟件會將上方的圖層自動轉換為軌道遮罩，并在軌道遮罩圖層名稱左邊顯示

圖標。

★提示：

Alpha通道是AfterEffects色彩信息中，除紅（R）、綠（G）、藍（B）三個通道之外的第四個通道，主要包含了透明度信息。

在對軌道遮罩圖層設置動畫后，此圖層就稱為移動遮罩。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效

本案例制作文字遮罩動效，效果如圖所示。該動效是通過設置圖層的“TrkMat”模式來制作軌道遮罩而實現(xiàn)的。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

1

在AfterEffects中新建項目，單擊“合成”窗口中的“從素材新建合成”按鈕，彈出“導入文件”對話框，在其中先選擇“素材與實例/第4章/案例4-4/4-4-1.jpg”，制作文字遮罩動效然后單擊“導入”按鈕，導入素材并自動創(chuàng)建合成，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

2

在工具欄中選擇橫排文字工具，在“合成”窗口中的頭像下方單擊，輸入“中國航天夢”，此時在“時間軸”面板中會新建文本圖層，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

3

選中文字，在“字符”面板中設置字體為“Adobe黑體Std”，字體大小為550像素，顏色為白色，并將其放置于合適位置，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

4

在不選擇任何圖層的情況下，在工具欄中選擇矩形工具，先按住快捷鍵“Alt”的同時重復單擊填充色塊，使填充類型變?yōu)榫€性漸變，之后再次單擊填充色塊，在彈出的“漸變編輯器”對話框中的漸變條上方和下方的中間分別單擊，添加一個不透明度色標和一個色標；然后設置3個色標的顏色均為藍色“#6181BC”，中間不透明度色標的不透明度為100%，兩側不透明度色標的不透明度為0%；最后單擊“確定”按鈕，如圖所示。使用同樣方法設置描邊顏色為無。設置漸變色4.4蒙版和遮罩案例練習4-4制作文字遮罩動效知識鏈接：在選擇形狀工具后，按住快捷鍵“Alt”的同時重復單擊填充色塊，可以使填充類型在無填充、純色、線性漸變和徑向漸變之間循環(huán)切換。此外，單擊藍色的“填充”文字，可以在彈出的“填充選項”對話框中選擇填充類型和顏色混合模式。描邊顏色的設置與填充顏色的設置相同。

在“漸變編輯器”對話框中的漸變條上方單擊可添加不透明度色標，在漸變條下方單擊可添加色標；選擇色標或不透明度色標后單擊“刪除”按鈕，可刪除所選色標。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

5

在文本左上角按下鼠標左鍵并向右拖動繪制矩形，使矩形完全遮蓋文本，如圖所示。

按快捷鍵“V”選擇選取工具，此時剛繪制的矩形中間會顯示漸變的起點和終點，分別選中起點和終點，按下鼠標左鍵并分別向左上方和右下方拖動改變漸變的起止點，如圖所示。

★提示：單擊圖層下“內(nèi)容/矩形1”屬性組中的“漸變填充1”屬性，同樣可顯示漸變的起點和終點。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

6

選中形狀圖層，按快捷鍵“P”顯示其“位置”屬性，在0秒的位置為該屬性添加關鍵幀，在“合成”窗口中按快捷鍵“Shift”的同時按下鼠標左鍵水平向左拖動矩形到左側畫面外，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

7

將“時間指示器”移動到2秒位置，為“位置”屬性添加關鍵幀，并在“合成”窗口中按住快捷鍵“Shift”的同時按下鼠標左鍵向右拖動矩形到右側畫面外，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

8

在“時間軸”面板中，按下鼠標左鍵向下拖動形狀圖層到文本圖層下方，設置形狀圖層的“TrkMat”模式為“Alpha遮罩‘…’”，使文本圖層中的文字輪廓成為形狀圖層的遮罩。

選中文本圖層，先按快捷鍵“Ctrl+D”復制一個圖層副本；然后拖動復制的圖層到形狀圖層下方，并單擊圖層左側的“視頻”按鈕顯示圖層中的文本內(nèi)容，如圖所示。“時間軸”面板4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

9

在“項目”面板中選擇“4-4-1”合成，將“時間指示器”移到2秒位置，按快捷鍵“N”使工作區(qū)的結束時間移至當前時間，選擇“合成/將合成裁剪到工作區(qū)”菜單項，將所選合成的持續(xù)時間裁剪成2秒01幀。

★提示：使用快捷鍵設置出點時間時，會自動向后推1幀，此時，該合成的出點時間為2秒，持續(xù)時間為2秒01幀。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效知識鏈接：工作區(qū)主要用于設置預覽和最終渲染輸出的合成的持續(xù)時間，在“時間軸”面板中以淺灰色陰影表示，如圖所示。按快捷鍵“B”可以將工作區(qū)的開始時間移至當前時間，按快捷鍵“N”可以將工作區(qū)的結束時間移至當前時間。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

10

單擊“時間軸”面板中的“圖表編輯器”按鈕，進入圖表編輯器模式，選擇形狀圖層“變換”屬性組中的“位置”屬性以選中該屬性中的所有關鍵幀，單擊“緩動”按鈕添加“緩動”效果，如圖所示。4.4蒙版和遮罩案例練習4-4制作文字遮罩動效步驟

11

最后將文件保存。

2021年10月16日，神舟十三號載人飛船發(fā)射成功，此次載人飛船的?？繒r間將由3個月延長至6個月，這是中國迄今為止時間最長的一次載人飛行。

神舟十三號的成功發(fā)射和長時間?？浚瑯酥局袊暮教焓聵I(yè)邁上了一個新臺階?？萍贾?.5交互動效的預覽、渲染和導出4.5.1預覽動效

使用預覽功能可以隨時查看動效。單擊“預覽”面板中的?按鈕（如圖所示），按“空格鍵”，或選擇“合成/預覽/播放當前預覽”菜單項，均可預覽動效。單擊“預覽”面板中的■按鈕，再次按“空格鍵”，或按快捷鍵“Esc”均可退出預覽模式。知識鏈接：選擇“窗口/預覽”菜單項，或按快捷鍵“Ctrl+3”可打開“預覽”面板。要想在預覽時全屏播放動效，可以在面板中勾選“全屏”復選框。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效

1．使用“渲染隊列”面板渲染和導出動效

在AfterEffects中，主要通過“渲染隊列”面板渲染和導出動效。使用“渲染隊列”面板可以成批渲染多個項目。

先選擇“窗口/渲染隊列”菜單項可打開“渲染隊列”面板，在“項目”面板中選擇合成，選擇“合成/添加到渲染隊列”菜單項將合成添加到“渲染隊列”面板，或者按下鼠標左鍵拖動合成到“渲染隊列”面板中；然后展開合成，并單擊“輸出模塊”行“輸出到”右側的藍色文字，在彈出的“將影片輸出到：”對話框中設置目標位置，并單擊“保存”按鈕；最后單擊“渲染隊列”面板右上角的“渲染”按鈕，即開始渲染動效，如圖所示。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效

上面介紹了采用默認設置輸出動效的方法，如果想要設置渲染動效的幀速率、分辨率等，可在“渲染隊列”面板中進行設置。（1）渲染設置：在該模塊中，可以設置渲染項的品質(zhì)、幀速率、持續(xù)時間和分辨率。單擊“渲染設置”右側的“﹀”按鈕，可以在下拉列表中選擇系統(tǒng)自帶的“渲染設置”模板，也可以單擊右側的藍色文字，在彈出的“渲染設置”對話框中設置相關選項。（2）輸出模塊：在該模塊中可以設置渲染項輸出的格式。單擊“輸出模塊”右側的“﹀”按鈕，可以在下拉列表中選擇不同的“輸出模塊”模板，也可以單擊右側的藍色文字，在彈出的“輸出模塊設置”對話框中設置相關項。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效（2）輸出模塊“輸出模塊設置”對話框

★提示：使用AfterEffects渲染輸出動效時，常用的格式有AVI和QuickTime。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效（3）輸出到：用于設置渲染輸出時文件保存位置和文件名稱，單擊“輸出到”右側的“﹀”按鈕，可以在下拉列表中選擇預設的輸出位置和文件名稱，也可以單擊右側的藍色文字，在彈出的“將影片輸出到：”對話框中設置文件保存位置和文件名稱。（4）渲染項狀態(tài)：渲染項的狀態(tài)顯示于“渲染隊列”面板中的“狀態(tài)”列中，不同的狀態(tài)有不同的含義。①未加入隊列：表示渲染項已添加到“渲染隊列”面板中，但不能渲染。②已加入隊列：表示渲染項可以渲染。勾選相應渲染項“渲染”列的復選框，可使渲染項的狀態(tài)由未加入隊列變?yōu)橐鸭尤腙犃?，如圖所示。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效②已加入隊列：表示渲染項可以渲染。勾選相應渲染項“渲染”列的復選框，可使渲染項的狀態(tài)由未加入隊列變?yōu)橐鸭尤腙犃?，如圖所示。③完成：指渲染項已完成渲染。

★提示：需要注意的是，已完成渲染的渲染項不可再次渲染。4.5交互動效的預覽、渲染和導出4.5.2渲染和導出動效2．使用Ph