UI Design
Health
Gamified XP
Ninja Fit
A Gamified Fitness Journey to Beat Boredom and Stay Motivated
"If I had an hour to solve a problem, I'd spend 55 minutes thinking about the problem and 5 minutes thinking about solutions.” Albert Einstein
Problem Statement
Consistency in physical fitness routines is hindered by a lack of Motivation caused by Boredom of routines, Time constraints.
A significant portion (67%) struggles with tailoring personalized incremental goals on these challenging days, making it difficult to stay committed to their primary fitness objectives and stages.
How might we?
How might we make fitness activities more fun and rewarding to stay intrinsically motivated and consistent in their journey?
How might we improve relationship with fitness?
How might we make fitness less daunting and more fun?
How might we make the process of building endurance more fun?
How might we make exploring activities consistently for busy individuals?
How might we select activities that are important for user?
Intrinsic motivation
Extrinsic Motivation
Design
Framework
In addressing the core issue of motivation and boredom—crucial factors affecting user consistency and adaptability in workout routines— strategically selected frameworks that align with these needs.
The Octalysis Framework, known for its gamification prowess, taps into Epic Meaning & Calling and Development & Accomplishment to keep users excited and consistent.
Paired with Self-Determination Theory, this strategy is not only research-backed but perfectly adaptable to fit users’ busy lives and changing fitness goals.
Design system
Ninja Fit Design System was introduced to bring consistency, efficiency, and scalability to our product development process. As our platform grew, maintaining a cohesive user experience across different features, devices, and teams became increasingly complex. The design system solves this by providing a single source of truth—standardizing visual language, components, and interaction patterns. It empowers designers and developers to build faster with fewer inconsistencies, reduces design debt, and ensures that every user touchpoint reflects our brand’s identity of precision, agility, and focus.
User feedback
Onboarding experience
A seamless onboarding experience ensuring a smooth entry into the world of Ninja Fit. These onboarding screens guide users step by step—starting with exercise setup, syncing their fitness tracker, and diving into an epic gamified journey. With a clean and engaging interface, this introduction sets the stage for a fitness adventure that transforms activity into progress, making workouts both fun and rewarding.
Story
Boarding
The Ninja Fit experience is driven by a deeply immersive narrative that transforms physical activity into an epic journey. Rooted in gameful design principles, this story builds on intrinsic motivation—autonomy, mastery, purpose, and relatedness—by casting the user as a hero in a once-thriving ninja world, now corrupted by toxins due to inactivity. Just as a neglected body accumulates toxins, the world mirrors this decay. The user’s mission? Restore balance by converting toxins into energy through movement. This carefully crafted parallel between the game world and real-life fitness enhances engagement, making every step, jump, and calorie burned feel impactful. As users embark on their quest, intuitive UI and fluid interactions guide them seamlessly through onboarding, reinforcing the connection between their efforts and the world they are saving.
Rules
To solidify engagement, the game employs clear, measurable mechanics: every 10 calories burned translates to toxin purification, reinforcing real-world progress with immediate in-game rewards. This direct feedback loop not only taps into extrinsic motivation—visual progress, unlocked characters—but also strengthens intrinsic motivation, as users witness tangible improvements in both their virtual world and physical well-being.
First-Time User
When users first land on the toxin-filled screen, they are immediately prompted with the "Start Activity" animation, guiding them to wear their smartwatch and begin tracking their movements. This interactive cue ensures a seamless transition into gameplay while reinforcing the habit of accurate health data monitoring. From usability studies, we observed that users like Alex benefit from an engaging onboarding experience that effortlessly integrates fitness tracking into their routine. By tapping the activity button, they not only improve tracking precision but also create a sense of accountability and motivation. This ensures that their fitness journey remains enjoyable, rewarding, and free of unnecessary friction. The app is designed to adapt to users’ preferred fitness activities, prioritizing ease of engagement while maintaining a structured yet flexible approach to holistic wellness. As users progress, additional features are introduced to enhance their experience, ensuring they remain motivated without feeling overwhelmed.
Returning
User
Returning users are greeted with a notification and a smooth animation highlighting their level progression. This keeps engagement high while reinforcing motivation.
As they enter, the energy collection sequence visually aligns with their fitness goals, making progress feel rewarding and purposeful. The seamless flow ensures a frictionless experience, encouraging consistent participation.
Figma Prototype
Link
View prototype
what's next?
🎨 "Design, ideas & coffee—let’s chat!"