Role

  • Solo designer

Tools

  • Figma

  • Marker & paper- sketching

  • ChatGPT

  • Jitter

This was a 90-hour solo UX/UI challenge to design a fitness app focused on engagement and retention.

I used common psychology principles such as motivation through gamefication and social interaction to solve this porblem.

Project overview

A gamified, social fitness app to keep people moving.

As an avid exerciser, I’ve had plenty of days where I had to drum up some serious motivation to get a work out in. When I was challenged to conceptualize a fitness app that prioritized sustained engagement, I knew exactly where to start.

I designed FitCircle to make fitness feel more connected and motivated through the concept of Circles; where groups of any size can team up, tackle challenges, earn badges, and see their progress come to life. I weaved in messaging and social accountability to help turn the chore of working out from a solo grind into something people actually want to show up for.

TL;DR

So how might I build a fitness app that keeps users motivated over time?

Research methods

Working lean under a tight 90 hour cap pushed me to quickly prioritize features.

Week 1: Research & Synthesis

  • Desk research, moderated interviews, market analysis

  • User journeys, personas, red-route flows

Week 2: Visuals & Testing

  • Hi-fi wireframes, in-person moderated usability testing, iteration

  • Brand visuals, design system

Week 3: Final Testing & Deliverable

  • Hi-fi prototype, 2nd round moderated user testing

  • Iteration, hand-off

Desk research & user interviews

Fitness app reviews

Findings

Behavioral psychology

Market analysis

Moderated interviews

Social support and recognition are extremely powerful motivators.

One user told me, “Knowing my friends can see what I’ve done makes me push a little harder. It’s like having a cheer squad in my pocket.” This confirmed just how important social encouragement is when building lasting fitness habits.

Motivation studies

These insights gave me the idea to gamify FitCircle. Using friendly competition and social components solved the challenge of how to keep users consistenly engaged.

Exercisers look for flexibility and variety in their workouts, with quick access to health data trends.

A consistent theme I heard over and over again was, “I like to switch workouts up. Run one day, lift the next. And I need to easily see my PR's and stats.” This reinforced the need for customizable routines and fast access to health metrics.

Gamification taps into our psychological reward systems and can help continue exercise.

Several interviewees admitted to making their own competitive exercise group chats. “I’m way more likely to show up if there’s a challenge on the line. I can’t let [my friends] win.” That feedback helped shape how I layered rewards and progress tracking into the app experience.

Competitor market analysis

Three major players in the world of mobile fitness apps were analyzed to get a sense of what was and was not working:

Peloton: strong gamification and community, but limited social engagement and no messaging.

Strava: solid community and challenge features, but lacks fitness variety beyond running/cycling.

Apple Health: excellent health metric tracking and easy smart watch integration, but very little social connection.

Information architecture

I wanted the structure of FitCircle to follow similar patterns to popular fitness apps to lessen the mental load of learning something new.

Easy onboarding, simple access to social features, and consistent visuals were a huge priority.

Familiar flow and structure

Wireframes & user testing

Hi-fidelity wireframes to test structure and flow early.

I really worked on aligning the flows with the mental model users use when thinking about both fitness and social apps.First round of usability testing was ran on these wireframes to help validate goals of the main flows.

To keep things motivational, I designed a dynamic home screen with daily fitness stats and Circle updates.

Group messaging was essential, so I made it accessible via the bottom nav and within each active Circle.

Visuals

Vibrant, playful design that looks familiar.

Dynamic moving elements, like progress rings and bars, bring a sense of energy and excitement. Dynamic moving elements, like progress rings and bars, bring a that exciting game-like feel.

Approachability increases engagement


Bright, bold accent colors balanced with a dark interface helps FitCircle to feel approachable yet exciting. Highly contrasting colors help to make the interface feel fun and worth going back to.

High energy helps motivate action

Round two usability testing

After applying my visual system to the high-fidelity prototype, I ran a second round of in-person usability testing to see how they moved freely through the app.

Almost all users told me they felt lost either during or right after onboarding.

Clarfied ring colors

Reworked copy and visuals to better explain the role of ring colors.

Added onboard tutorial

Created a lightweight tutorial that appears after onboarding to familiarize users with Circles, challenges, and metrics tracking.

Final design & core features

Home screen

Challenge solved: clarity and motivation are needed to stay consistently engaged with the FitCircle.

✅ Active Circles are pinned to the top to highlight recent social activity and to nudge the user to check in with their groups.

✅ The home screen displays simple, clear progress visuals through dynamic daily stat widgets.

Circles

Challenge solved: app usage often drop off when users feel alone in their fitness journey.

✅ Circles visualize both individual performances alongside group progress to keep up competitive motivation.

✅ Users can start a private Circle with friends and family.

✅ Or join a public Circle with similar fitness goals and interests.

Messaging & notifications

Challenge solved: rewarding social features are a must to keep up user participation and loyalty.

✅ Users can toggle between a Circle’s overview and chat to stay on top challenge goals and maintain connection.

✅ Message reactions let users share and celebrate progress directly in the group chat.

✅ ‘Messages’ button on the nav bar organizes all Circle conversations in one place.

Challenges & leaderboards

Challenge solved: ongoing challenges help users stay active and committed to FitCircle.

✅ A wide range of challenge options keeps up consistent app usage by encouraging groups to show up and accept new goals when completed.

✅ Friendly competition through Circle leaderboards gives users a reason to stay focused and engaged.

Learnings

How valuable user testing really is.

Building a gamified system was totally new to me, and designing points, rewards, and progress mechanics was honestly one of the hardest parts. With so many moving pieces, I had to figure out how to make FitCircle feel fun and intuitive, but most importantly solve the sprint challenge. Every round of feedback helped me simplify and make sure FitCircle still felt motivating and accessible for all kinds of users.

Design everything with intention.

Each decision from choice of color palette, layout, and even microcopy was a chance to reinforce both FitCircle’s business purpose and personality.

Thanks for reading!

Check out the full case study

Previous
Previous

View case study