頁面載入動效怎麼做

來源:酷知科普網 2.67W

在使用手機跳轉頁面的過程中,如果應用的UI做得比較細緻的話,肯定會有相應的載入動效,載入一般就是運動等待的情況,雖然做起來不難,但是使用者體驗比較好,下面來學習一下怎麼做一個簡單的頁面載入動效。

操作方法

開啟電腦中的AE軟體,ctrl+n新建一個合成,合成的幀速率一般都是30f,寬高自定。

頁面載入動效怎麼做

建立合成之後,在畫布上我們先繪製一個橢圓,然後用“錨點工具”將圓的中心店移動到圓心。

頁面載入動效怎麼做 第2張

接著將這個圓ctrl+c/v複製3個出來,要保證每個圓都是在不同的圖層,一共有4個形狀圖層。

頁面載入動效怎麼做 第3張

選擇4個圓形,將位置距離進行適當調整,直接使用分佈圖層中的“水平居中分佈”也可以進行對齊排列。

頁面載入動效怎麼做 第4張

接著我們就來加關鍵幀,順序是從左到右運動,先給左側的圖形在開始的位置加一個關鍵幀。

頁面載入動效怎麼做 第5張

我們舉例往上跳動,算好幀數,然後向上移動,再次新增關鍵幀。

頁面載入動效怎麼做 第6張

跳上去之後肯定要落下去,再往後的幀數中向下移動,新增一個關鍵幀,幀數最好保證一致。

頁面載入動效怎麼做 第7張

框選所有關鍵幀,右鍵關鍵幀後點擊“關鍵幀輔助”,在裡邊給關鍵幀新增“緩動”輔助。

頁面載入動效怎麼做 第8張

最後複製左側圓的關鍵幀,算好相應的運動位置之後ctrl+v貼上在別個圖層中,這樣就做好了一個簡單的載入動效。

頁面載入動效怎麼做 第9張
熱門標籤