Run Logic Mobile App UX/UI Design
Yusra Shoaib
Verified
Run Logic – Mobile App UX/UI Design
Designing a smarter companion for runners through data, motivation, and consistency
Run Logic is a fitness and running companion designed to help users build better training habits through intelligent progress tracking, personalized workout plans, and actionable performance insights. The goal was to create an experience that motivates runners of all skill levels while making complex training data feel simple, approachable, and engaging.
I was responsible for designing the complete mobile experience, including user research, user flows, wireframes, high-fidelity UI, design system, component library, prototyping, and responsive interaction patterns.
The challenge was to create a fitness application that balances powerful analytics with an interface that feels effortless to use.
The Challenge
Many running applications overwhelm users with excessive data, complicated navigation, and inconsistent experiences.
Run Logic needed to feel different.
The experience had to:
Make performance metrics easy to understand
Keep runners motivated through visible progress
Encourage long-term habit building
Reduce friction during everyday use
Create a premium, modern interface suitable for both casual runners and experienced athletes
Most importantly, the product needed to help users focus less on numbers and more on becoming consistent runners.
Strategic Direction
The product was built around one central idea:
Progress should feel motivating, not overwhelming.
Rather than presenting users with dozens of metrics at once, the experience prioritizes only the information that's most relevant at each stage of their running journey.
Every design decision followed three guiding principles.
Simplicity
Surface only the information users need in the current moment.
Motivation
Celebrate achievements, streaks, and milestones to encourage consistency.
Clarity
Transform performance data into intuitive visualizations that users can understand at a glance.
The Solution
1. Guided Onboarding
The onboarding experience introduces users to the platform with a clean, welcoming interface before guiding them through account creation, fitness goals, and personalized training preferences.
The flow minimizes friction while collecting enough information to generate relevant workout recommendations.
2. Personalized Dashboard
The dashboard serves as the central hub for daily activity.
It surfaces the information runners care about most:
Distance
Average Pace
Calories Burned
Weekly Progress
Current Streak
Active Training Plan
The layout establishes a clear visual hierarchy, making key metrics immediately accessible without overwhelming the user.
3. Intelligent Run Tracking
Run Logic simplifies run tracking through a focused experience that highlights only the most important live statistics.
Interactive maps, route visualization, workout summaries, and split analysis provide users with valuable insights while maintaining a clean and distraction-free interface.
4. Progress & Insights
Instead of displaying raw numbers alone, the application transforms performance into meaningful visual feedback.
Features include:
Weekly performance trends
Average pace analysis
Personal records
Milestone achievements
Workout consistency
Long-term progress tracking
These insights help runners understand improvement over time rather than obsessing over individual workouts.
5. Training Plans
Users can browse structured training plans tailored to different fitness levels and goals.
Each plan clearly communicates:
Weekly schedule
Workout frequency
Recovery sessions
Progress milestones
Expected outcomes
The interface makes long-term planning feel approachable instead of intimidating.
Design Process
Research & Discovery
The project began with research into modern fitness ecosystems and runner behavior.
The objective was to understand how experienced athletes and beginners consume performance data differently.
Competitive analysis included platforms such as:
Nike Run Club
Strava
Garmin Connect
Adidas Running
Apple Fitness
The research revealed a common pattern:
Many platforms prioritize data collection over user motivation.
Run Logic was designed to reverse that approach by making encouragement just as important as analytics.
Information Architecture
The app's navigation was structured around the user's natural workflow.
Primary sections include:
Home
Training Plans
Activity
Community
Profile
This architecture reduces cognitive load while keeping frequently used features easily accessible.
Visual Design
The interface embraces a minimal design language built around generous spacing, rounded components, and a restrained color palette.
A vibrant lime-green accent color provides visual energy while reinforcing actions, achievements, and progress throughout the experience.
Dark metric cards create contrast against the clean white interface, helping key performance data stand out without cluttering the layout.
Design System
A scalable design system was developed to maintain consistency across the application.
It includes:
Reusable components
Button variants
Form controls
Card layouts
Navigation patterns
Iconography
Typography hierarchy
Color tokens
Spacing system
This foundation allows future features to be added while preserving a cohesive user experience.
Key Features
Secure Authentication
Personalized Dashboard
Goal Setting
Live Run Tracking
Interactive Maps
Workout Plans
Progress Reports
Weekly Analytics
Achievement Badges
Performance Insights
Activity History
User Profile
Habit Streaks
Community Access
Deliverables
UX Research
User Flow Mapping
Information Architecture
Wireframes
High-Fidelity Mobile UI
Design System
Component Library
Interactive Prototype
Dashboard Design
Activity Tracking Experience
Analytics & Insights Screens
Training Plan Experience
Profile & Settings
Developer-Ready Figma File
The Outcome
Run Logic delivers a focused, intuitive experience that helps runners stay motivated through clear progress tracking and thoughtful interaction design.
Rather than overwhelming users with data, the interface highlights meaningful insights, celebrates consistency, and encourages long-term habit building.
The result is a modern fitness application that balances performance analytics with simplicity, creating an experience that feels both powerful and approachable.
Final Reflection
The best fitness products don't just record workouts—they help people build lasting habits.
With Run Logic, the objective wasn't simply to design another running app. It was to create an experience that keeps users engaged, motivated, and confident every time they lace up their shoes.
The final product combines clean visual design, intuitive navigation, and meaningful performance insights into a cohesive mobile experience built for everyday runners.
Like this project
What the client had to say
Yusra was great to work with. She quickly understood my vision, communicated clearly, met deadlines, and was open to feedback throughout the project. Her designs were clean, intuitive, and thoughtfully executed.
Diana Gonzalez
Jun 12, 2026, Client
Posted Jul 16, 2026
Designed a mobile app for Run Logic, enhancing user motivation with smart tracking and an intuitive interface.
Likes
0
Views
1
Timeline
Apr 27, 2026 - Jun 12, 2026
