如何用Auxre制作網易雲音樂聽歌識曲交互動效呢？一起來文中看看~

效果展示：

分析交互動效

打開網易雲音樂，截圖，然後我們可以看到，這個就像水波的動效是這樣組成的：

1. 由中間的小圓圈逐漸擴大
2. 不透明度由100%逐漸變0%
3. 一共有兩個圓循環，當第一個放到最大時，第二個放大到二分之一

制作交互動效

1. 制作第一個圓動效

①畫背景：純黑色、375*667

②圓圈：紅色、250*250、命名“紅圈1”

③動态面闆：創建一個動态面闆，設置兩個狀态，命名“控制”（由于需要循環動效，所以用動态面闆，這個主要用來控制紅圈1的大小和透明度）

設置交互：設置紅圈1尺寸變大至878*878錨點居中，動畫線性1000ms→不透明為0%，動畫線性1000ms→等待1000ms→設置尺寸和透明度為原來大小，具體參數如下：

④添加熱區：250*250，設置交互：單擊時，設置“控制”動态面闆下一項，循環間隔1500mm

⑤瞅瞅效果

2. 增加另一個紅圈2

①這裡紅圈2不需要直接畫，直接複制紅圈1和控制動态面闆（注意：要同時選中這連個元件複制，這樣能把交互關系也一起複制過來，命名控制2和紅圈2），然後熱區設置到頂層。

②修改控制紅圈2的交互

隻需要在最前面增加等待500ms即可，這個的意思就是紅圈1執行交互放大後，過500ms，紅圈2執行交互。

③設置熱區添加控制2動态面闆交互

④瞅瞅效果咋地

3. 添加其他元素

①複制一個紅圈，放在在中間覆蓋紅圈1和紅圈2上，添加錄音圖标，組合紅圈和錄音圖标，命名紅圈3。感興趣的朋友可以自行做出點擊文字修改提示和紅圈3點擊動效，這裡不再做教學。

最最最終效果

好了，今日教學就到這裡，大家有哪個步驟不懂可以留言或下載源文件研究。下期要來個比較難的交互動效，再會！

鍊接：https:///s/1gR-C_q98-9IrIPGDB9OZOw

提取碼：k88s

本文由 @索大佩羅娜 原創發布于人人都是産品經理。未經許可，禁止轉載

題圖來自Unsplash，基于CC0協議

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部