Rive Animations for Dirt Locker's Gardening App
Praneeth Kawya Thathsara
For Dirt Locker’s hillside gardening app, I designed and developed a series of Rive animations to enhance the onboarding experience and in-app tutorials. These animations help users understand and complete the critical slope measurement process, ensuring they can quickly and confidently set up their hillside gardening projects.
Objectives
Create smooth, functional, and intuitive animations that guide first-time users step-by-step.
Balance clarity and aesthetics so that instructions are both visually engaging and easy to follow.
Support the app’s estimator tool by simplifying the process of collecting slope data (angle, width, vertical distance/height).
Animation Highlights
Slope Measurement Tutorial
Guided animation showing how to measure slope angle, width, and length.
Used a phone placed on a 2x4 piece of wood to demonstrate angle measurement for hillside accuracy.
Estimator Setup Walkthrough
Animations leading users through selecting hillside type, choosing measurement units, and entering slope dimensions.
Clear call-to-action cues directing users to calculate and save their project.
Interaction Design
Smooth transitions and visual pacing ensured users never felt overwhelmed.
Each animation was crafted to emphasize step completion before moving forward.
Challenges & Solutions
Challenge: Conveying technical measurements (slope angle, width, height) to non-technical users.
Solution: Designed animations with real-world metaphors (phone on wood beam, clearly labeled measurements).
Challenge: Ensuring usability across different device sizes.
Solution: Optimized Rive animations to maintain readability and flow on both small and large screens.
Like this project
Posted Sep 25, 2025
Improved onboarding with clear Rive animations, reducing friction and helping first-time users measure slopes and set up projects with ease.
Likes
0
Views
0
Timeline
Aug 1, 2025 - Aug 25, 2025
Clients
Dirt Locker
