The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
Project: Fitness Tracking App — Full Mobile UI
The brief: Design a fitness app that keeps users motivated and consistent not just on day one, but through week six.
The thinking: Most fitness apps lose users in the first two weeks. Not because the workouts are bad because the app stops feeling rewarding. I designed around three moments that matter most in a user's day.
Morning (Home screen): The user opens the app before a workout. They're looking for motivation. The home screen leads with achievement details, including calories burned and steps taken, before showing what's left to do. Win first, gap second.
Planning (Workout Library): Too many choices create paralysis. The library screen has one prominent primary action "Create Workout Plan" before opening up into the full catalogue. One clear next step always visible.
Accountability (Challenge screen): Individual motivation fades. Community motivation compounds. The challenge screen shows personal progress (58% complete) alongside 15,000 other participants and a structured weekly schedule. It makes the commitment feel shared, not lonely.
Design decisions:
→ Orange accent throughout energetic, warm, action-oriented without being aggressive
→ Progress rings over bars feels personal, like a wearable device
→ Real photography in workout cards makes the next session feel tangible
→ Community section on the home screen social proof built into daily use
Tools: Figma
Deliverable: Full app UI across home, library, challenge, and community screens
Open for mobile app UI and product design projects. Send me a message to talk about yours.
Good work
Thank you @Rasel Alam Jubayed
The "win first, gap second" philosophy for the home screen is smart framing. Leading with what the user has already done before showing what's left changes the emotional tone of opening the app. Progress rings over bars is also the right call for something this personal.
Really appreciate this @MD Rafee Alam "emotional tone of opening the app" is the exact thought I had during the design process, just never framed it that cleanly.
And the ring vs bar distinction is intentional. A bar measures. A ring feels personal. When the data is this close to someone's...
I really loved how you explained about your project in the post. In this post, you just did not describe about your project but also gave a overview of how do you work.
The design is really clean and on point. I would like to mention some point which can make this design more...
Thanks so much for the feedback! I really appreciate you taking the time to look through the project and share your thoughts. It’s great to hear that you liked the overall workflow and the clean aesthetic.
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Challenges
View all
Related posts
A look at the identity we designed for Vetti, a dog health monitoring brand.
There’s a lot of data behind a product like this but the person using it just wants to know their dog is okay.
That’s the balance in the design with a connected dot system that feels precise and warm colors and photography that keep it close to what people care about.
Also, an excellent excuse to spend far too long choosing dog photos.
Engaging website for a New York–based architecture and construction studio, balancing bold typography, immersive imagery and a minimal editorial layout.
