Lovu Plant App · React Native Build with Rive State Machines by Adetomiwa AdewunmiLovu Plant App · React Native Build with Rive State Machines by Adetomiwa Adewunmi
Built with Rive

Lovu Plant App · React Native Build with Rive State Machines

Adetomiwa Adewunmi

Adetomiwa Adewunmi

Lovu is a plant care app I designed and built from scratch in about 4 to 5 days. Every screen started in Figma, from the splash and logo through to plant detail. All of it was implemented in React Native with production-quality code. Three Rive files wire motion directly into the runtime: one for the splash sequence, one for the Growing/Grown tab switcher, and one for the Timeline/Info switcher inside plant detail.
The design goal was simple. A plant app that felt considered, not flat. Rive is what closes that gap between static screens and something that actually responds.

The Brief

No client. I had a picture in my head of what a good plant app could feel like, and I ran straight at it. Design first, code second, then Rive came in when the built screens felt flat. Once the tab icons became state-driven animations instead of static SVGs, the whole app shifted from working to alive.

Process

Every screen was designed in Figma before a line of code was written. Home (Growing and Grown tabs), plant detail (Timeline and Info tabs), splash, logo. All spacing, color, and typography came directly from those Figma frames into React Native StyleSheet. No guessing, no approximation.
One Rive files handle all the motion:
Splash: The state machine receives a commence trigger on mount. A dismiss timer anchors to the same animation frame so the handoff to the home screen always syncs to where the animation actually is, regardless of how busy the JS thread was at launch.
Growing/Grown switcher: AutoBind connects the data binding layer. On each tab press, the component fires growing or grown as both a state machine input and a view model trigger. Whichever the file defines picks it up. The icon responds with a state-driven transition, not a swap.
Timeline/Info switcher : Same pattern inside plant detail. AutoBind, triggers on tab change, state machine listening for timeline or info.

Outcome

Lovu is a portfolio piece showing the full range: Figma design, React Native production code, and Rive state machines wired into the native runtime. The Rive files are published on the Rive marketplace.

Got a project that needs motion that actually responds? Let's build something.
Like this project

Posted Jun 1, 2026

A self-initiated plant care app designed in Figma and built in React Native, with Rive state machines powering the splash screen and every tab transition.