This is a small animation I made to test the new features of Rive. Mesh deformation and Listeners. You can play with the animation by moving the mouse and clicking to zoom.


The first thing I did was create a design that would allow me to use mesh deformation. To do this, I thought of the possibility of creating a landscape in which,  moving the mouse over the entire environment creates a 3D effect.


After importing the different assets into Rive, I created a rig to control the scene and added some meshes.


Then I create some animation details like the waterfall, the reflection of the water, the butterfly, and the flies.
The butterfly and the flies are on different artboards. With the Nested Artboard option, I can add them to the main artboard and make them work as a loop. In the case of the butterfly, I used the same animation to create the reflection in the water.


Finally, I configured the state machine and added the Listeners function, which allows you to interact directly with the editor. For cursor tracking, I use a Listener with the option Pointer Move. For the zoom, create two animations, ZoomIn and ZoomOut, and then set them in the State Machine so that clicking them would activate them.


Landscape
Published:

Project Made For

Landscape

Published: