Juice Agency reached out to me for four Rive animations. They were developing a new Case Studies page for theready.com, and their client had requested motion design to bring key sections of the page to life. The goal was to use animation to enhance the storytelling and make the experience feel more engaging, modern, and premium.

create scroll-based animation

simulate bounce physics animation

keep animations smooths & low-weight

The animation is designed to be controlled by a website scroll trigger. I used a number input connected to a blend state to control changes such as circles overlap, follow path strength, and dots size. You can explore the animation here.

Frame by frame, I manually animated 46 seconds to simulate the bounce effect. The bumping circles showcase the active teamwork among three groups of co-workers. You can check out the animation here.

For mobile devices, I turned scroll-based circles into two separate animations to avoid overloading the user experience.

As a result, I created four smooth Rive animations in just two days. Each one is extremely lightweight — only 5KB in size. The animations gave more premium and elegant look for the Case Studies page.