線型動畫
簡單來說先將線條畫好，再利用Trim Paths，並對Start及End分別作動，具體設定如下
流暢感
為了營造動畫的流暢感，不能只是用內建的easy ease。不過拉曲線沒有個幾年功夫打底也是很難短時間拉得漂亮，在這裡提供一個簡單又好看的拉法，就是將黃色拉桿直接橫橫的拉到下一個關鍵影格位置，另外下一個關鍵影格也要往前拉回原本的關鍵影格，如下圖：
圓形旋轉動畫
先用shape layer畫好所需圓形，每條shape去掉fill，並將stroke width調到所需的寬度。最後，再加上Trim Paths，設定和上面的動畫一模一樣就可以完成了。多做幾層疊再一起就蠻好看的。
圓圈爆炸動畫
先用shape layer畫好所需圓形，並去掉fill。跟上面不一樣的是，這次我們要對stroke width及Scale作動，詳細設定如下
延伸應用：爆炸線條
在原本的動畫上再蓋一層光芒型的shape當遮罩，這個shape用shape工具裡的Polygon Tool產生，type選star，詳細設定如下圖：
2014年5月17日 星期六
2014年5月4日 星期日
扁平風陰影
效果：
這個陰影可以任意改變濃淡、角度、長度，甚至可以連同文字層做動畫，而且不太吃資源
一開始，我建立一個composition，命名為”long shadow”，並在裡面放上了文字及背景(單色solid)
接著在文字layer上按右鍵->Pre-compose，文字層會變成一個compition(以下簡稱comp)，為了講解方便，這裡我命名為”陰影comp”
按ctrl+D複製剛才製造出來的comp，上面那層"陰影comp"用作顯示文字，至於陰影效果會做再下面那層comp，因此我們需要右鍵點擊下面的"陰影Comp”->Pre-compose
建議這一次製作的comp最好另外命名以做為區別，建立完成後立刻在點擊兩下進入這個Comp的編輯
為了製作陰影需要，我們先將這個comp作業區域放大，以利日後做動畫時不會遇到陰影不夠長的狀況。按ctrl+K，將width及Height都調到4000，記得右邊的勾勾要先去掉
將目前編輯的comp拉開到上面，並如圖分別叫出這兩層的rotation(快捷鍵R)，並按著alt不要放典籍前面的時間圖案，右方數字會變紅色，並在下方跳出四個圖示。這時放開alt，並用滑鼠點擊螺旋符號不要放拉到下方的rotation，這個動作的意思是上方的rotation會跟隨下方rotation值變動而動作，你可以試試看改變下方rotation的值看看會有什麼效果
完成後，右方會出現類似程式碼的東西，在這段程式碼的後面加上*-1
以本圖為例，原本是
comp("long shadow").layer("shadow").transform.rotation
變成
comp("long shadow").layer("shadow").transform.rotation*-1
我們剛剛讓兩個layer的rotation做連動，但是加了*-1之後呢，效果就變成不論下面那層的rotation如何改變，上面都不會有任何變化，看到這邊可能有人覺得我最脫褲子放屁，不過別急，這樣的用處後面會用到。
回到上面那層comp，幫他加上右鍵點選"陰影 Comp”->Effect-> Color Correction-> Tint，並將Map Black To改成純白色
關閉上面那層comp，現在焦點放在下面那層comp上，右鍵點選"shadow"->Effect->Blur& Sharpen –> Box Blur
接著按快捷鍵a叫出Anchor Point，按住alt不放點選前面的碼表圖示，一樣下面跑出四個小圖示。按著螺旋符號不要放，往上拉到Box Blur裡的Blur Radius的值上
一樣，我們也要更動右方的程式碼，將[temp,temp]改為[2000-temp,2000]
(可以猜到這個2000是源自於先前我們設定4000的一半)
在此例，完整的程式碼如下
temp = effect("Box Blur")("Blur Radius");
[2000-temp, 2000]
這時我們可以試著調整Box Blur裡Blur Radius的值，可以發現值越大，文字會向右偏移中心並越模糊
接著我們將Box Blur裡Blur Dimensions的值改為Horizontal
之後，再新增兩個effect，分別是channel->Set Matte及channel->Invert
Set Matte中的Take Matte From Layer調為None，並讓Invert Matte選項打勾以及取消Composite Matte with Original
接著我們再來試看看調整Box Blur裡Blur Radius的值，可以慢慢看出有點陰影的樣子了，但這還不是我們想要的結果。
將shadow層的Mode調整為Multply，我們可以發現背景顏色回來了。這時候你可以調整shadow這一層的Opacity(透明度)讓陰影淺一點，另外還可以調整rotation來調整陰影角度，Box Blur裡Blur Radius則是調整陰影長度，你可以在這三個值作動，完成圖如下：
另外這樣的製作方式有個特色，當你有在文字層做動畫(也就是一開始創造的”陰影comp”內)，比如說你可以讓文字一筆一畫出現，陰影也會隨著一筆一畫出現，這裡可以有無限揮灑的創意
如有不了解可以參考以下教學
https://www.youtube.com/watch?v=1acCQNZycps
這個陰影可以任意改變濃淡、角度、長度，甚至可以連同文字層做動畫，而且不太吃資源
一開始，我建立一個composition，命名為”long shadow”，並在裡面放上了文字及背景(單色solid)
接著在文字layer上按右鍵->Pre-compose，文字層會變成一個compition(以下簡稱comp)，為了講解方便，這裡我命名為”陰影comp”
按ctrl+D複製剛才製造出來的comp，上面那層"陰影comp"用作顯示文字，至於陰影效果會做再下面那層comp，因此我們需要右鍵點擊下面的"陰影Comp”->Pre-compose
建議這一次製作的comp最好另外命名以做為區別，建立完成後立刻在點擊兩下進入這個Comp的編輯
為了製作陰影需要，我們先將這個comp作業區域放大，以利日後做動畫時不會遇到陰影不夠長的狀況。按ctrl+K，將width及Height都調到4000，記得右邊的勾勾要先去掉
將目前編輯的comp拉開到上面，並如圖分別叫出這兩層的rotation(快捷鍵R)，並按著alt不要放典籍前面的時間圖案，右方數字會變紅色，並在下方跳出四個圖示。這時放開alt，並用滑鼠點擊螺旋符號不要放拉到下方的rotation，這個動作的意思是上方的rotation會跟隨下方rotation值變動而動作，你可以試試看改變下方rotation的值看看會有什麼效果
完成後，右方會出現類似程式碼的東西，在這段程式碼的後面加上*-1
以本圖為例，原本是
comp("long shadow").layer("shadow").transform.rotation
變成
comp("long shadow").layer("shadow").transform.rotation*-1
我們剛剛讓兩個layer的rotation做連動，但是加了*-1之後呢，效果就變成不論下面那層的rotation如何改變，上面都不會有任何變化，看到這邊可能有人覺得我最脫褲子放屁，不過別急，這樣的用處後面會用到。
回到上面那層comp，幫他加上右鍵點選"陰影 Comp”->Effect-> Color Correction-> Tint，並將Map Black To改成純白色
關閉上面那層comp，現在焦點放在下面那層comp上，右鍵點選"shadow"->Effect->Blur& Sharpen –> Box Blur
接著按快捷鍵a叫出Anchor Point，按住alt不放點選前面的碼表圖示，一樣下面跑出四個小圖示。按著螺旋符號不要放，往上拉到Box Blur裡的Blur Radius的值上
一樣，我們也要更動右方的程式碼，將[temp,temp]改為[2000-temp,2000]
(可以猜到這個2000是源自於先前我們設定4000的一半)
在此例，完整的程式碼如下
temp = effect("Box Blur")("Blur Radius");
[2000-temp, 2000]
這時我們可以試著調整Box Blur裡Blur Radius的值，可以發現值越大，文字會向右偏移中心並越模糊
接著我們將Box Blur裡Blur Dimensions的值改為Horizontal
之後，再新增兩個effect，分別是channel->Set Matte及channel->Invert
Set Matte中的Take Matte From Layer調為None，並讓Invert Matte選項打勾以及取消Composite Matte with Original
接著我們再來試看看調整Box Blur裡Blur Radius的值，可以慢慢看出有點陰影的樣子了，但這還不是我們想要的結果。
將shadow層的Mode調整為Multply，我們可以發現背景顏色回來了。這時候你可以調整shadow這一層的Opacity(透明度)讓陰影淺一點，另外還可以調整rotation來調整陰影角度，Box Blur裡Blur Radius則是調整陰影長度，你可以在這三個值作動，完成圖如下：
另外這樣的製作方式有個特色，當你有在文字層做動畫(也就是一開始創造的”陰影comp”內)，比如說你可以讓文字一筆一畫出現，陰影也會隨著一筆一畫出現，這裡可以有無限揮灑的創意
如有不了解可以參考以下教學
https://www.youtube.com/watch?v=1acCQNZycps
訂閱：
文章 (Atom)