Wave Wash Effect + Gradient Button

Here's another magic of @AdobeXD Auto-Animate and Hover State in a Wave Wash Effect + Gradients!🌊 What do you think? 🤗

🤔What is a Wave Wash? It originates from a starting point and propagates circular wave fronts, parallel to the X or Y axis.
đź–ŚEffects used: Wave Masking aka Pen Tool+Mask, Auto-Animate, Hover State
🏆Bonus Tip: For a more realistic effect, increase wave separation distance in perpendicular axis. More distance to cover = Delay in wash.

🎉Freebie: [ https://github.com/grlwholifts/cuddly-invention/blob/master/micro-animations/wave-wash-animation/Freebie%20-%20Wave%20and%20Gradient%20Wash%20Animation.xd… ]
🍰Video resources:
- Component States in Adobe XD – Hover & Micro-Interactions by @Pinsky and @AdobeXD [ https://youtube.com/watch?v=c8ov6IzFE0c… ]
- Hover Button Animations in Adobe Xd by @punitweb [ https://youtube.com/watch?v=XLD0DMlaMiQ… ]

Drop your suggestions in the comments! 🥰

More by Ruchika

View profile