Character Turn Animation with Rive

This is a fun experiment. A character turn movement is common in animation, film, motion design, ads, etc., but not so much in websites or apps. I was thinking if I can bring my motion design knowledge to product design and with Rive, yes, it is very much possible.

You can test it live here: https://www.plainlysimple.studio/rive-turn-animation

You can also test this via the Rive website: https://rive.app/marketplace/19598-36877-character-turn-animation/

To achieve this smooth animation, I had to connect the path of the shapes to bones. Then, for better control, I connected the turn animation to a joystick.

The blink animation and facial expression are also connected to their joysticks. This allows the different parts to cascade, making the character feel more alive.

Let's make the characters in your app feel more alive! Let's work together!