哈囉!又到了快樂的教學時光。
今天要來向大家介紹一個自動移動的表達式Math.sin,
這篇教學會利用Math.sin和index指令結合來製作類似波浪舞的效果!
1.Math.sin簡介
首先先用圖形工具建立一個圓形當作Math.sin的對象。
在圓形的Position中Alt + 左鍵點擊小碼錶Icon叫出表達式視窗。
先輸入
x = ;
y = ;
value+[x,y]
輸入完畢之後會出現一個驚嘆號的圖示表示無效指令,
那是因為我們還沒替第1、2排的x、y定義,
定義完畢後,圓型的座標會隨著x、y的定義來做增加。
由於我們不需要讓x增加任何數值(不改變x的數),因此我們將x定義為0,
將y定義為Math.sin(time*5)*100。
這就是Math.sin的效果了:
這邊的*5以及*100是可以變動的,
time*5代表頻率為5,
括號外面的*100代表波幅(上下距離),
這邊我們把y改為Math.sin(time*10)*50。
圓形的波動頻率就變為兩倍,而波幅變成一半了,
這就是Math.sin的基本使用方式了。
2.一般圖形Wave效果
回到x、y定義之前,
因為波浪舞需要多個圖層並且藉由圖層編號的變化來改變數值,
我們需要替Math.sin指令結合index。
將x定義為index*200 (每個圖層會相隔200),
y定義為Math.sin(time*5+index)*100,
這邊在括號中加入index是為了隨著越往下的圖層會有不同的波動變化,
完整表達式:
x = index*200;
y = Math.sin(time*5+index)*100;
value+[x,y]
小提醒:
如果某些單字輸入了卻還是跳出錯誤提示,
可以試著輸入前幾個字之後用AE的下拉選單選取,
會比較容易成功。
目前的動態長這樣:
待會複製圖層時圓形會往右邊延伸,
因此我們要先把圓形放在畫面左邊。
在x = index*200後面做簡單的加減就可以了!
圓形已經被移到左邊囉。
接下來就只要複製圖層就可以了。
隨著圖層的圖層編號不同會改變index代表的數值,
藉此達到波浪的效果:
當然你也可以在(time*5+index)中增加*2,
來改變物件和物件之間的變化劇烈程度。
同樣的方法可以適用於位置、縮放、旋轉及透明度等等哦。
3.文字Wave效果
接下來講解文字的波浪方式,
首先先用文字工具打上一串文字。
接著在文字圖層底下Text旁找到Animate的小箭頭,
新增一個Position。
點選之後你可以直接在底下找到剛才新增的Position位於Range Selector 1底下。
在Range Selector 1上方的Animate旁點選Add > Selector > Expression。
Position就會被移至Expression底下囉!
拉動Position的數值可以看到文字依據字的位置做件層變化。
接下來點開Expression的下拉選單,
找到Amount > Expression : Amount,
找到輸入表達式的地方。
將表達式改為:
Math.sin(time*5+textIndex)*100,
注意,這邊的index要改成textIndex。
並調整Position的數值,就會看到文字出現波浪了!
完成之後效果如下:
你也可以在這時新增Opacity或其他動態選項,
新增之後會直接加入到Expression底下。
更改Opacity的數值。
這樣就完成文字的Math.sin位移和透明度動態囉!
此教學專案檔下載(cc 2018以上):