Built with Rive
The team and I had fun working on this project. This is for a client project: a website builder app that uses AI to help anyone with a business build a website, all from the convenience of using your phone.
We helped design their mascot, which is their AI assistant in the app. We used Rive to bring fluid character animations to their app.
Their mascot is actually two characters: Figgy, the main mascot, and Fizzy, the blob. In the design phase, we showed them lots of options, and they liked these two best and wondered if they could choose both. Instead of just dismissing it, I thought to myself, "Yeah, that could work". So, how we combined both was that we still needed a main mascot, which is Figgy, and Fizzy could be like a side character that transforms into what Figgy needs at the moment, like a pen or a hammer.
The user account has two types: standard and premium. So we also had to design a powered-up Figgy and Fizzy to make the premium users feel extra special.
To achieve fluid animation, we first animated it frame by frame, used that as a guide, and then tried to replicate it as closely as possible in Rive.
The transformation animation is my fave shot of the whole project
Full animation set with state machine preview
0 likes · 44 views · Aug 10, 2026
We animated the characters frame by frame to achieve a fluid motion. Then we used it as a guide in Rive to convert the frame by frame to Rive vector animation.
Timeline
May 17, 2025 - Jul 13, 2025