< Back to Projects


Fitness App Case Study

The Mission:

This was a personal project to further enhance my UI and UX skills. The goal was to learn how to incorporate the needs of a few people, then narrow down the ones that could be beneficial to a whole group of individuals that would use the application. I also chose to do a mobile-centered interface because we rarely had the chance to do so in our classes. We were more focused on web design, not software/app design. And since UI tackles not just web design, this gives me a window of opportunity to learn and design an interface on a technology that the majority of the population uses. 

Empathy Map

User Personas

Challenges Faced:

  • I’m not too knowledgeable with app interfaces which made it difficult to think of what elements go on which pages.
  • Brainstorming notes on empathy maps was a challenge since I had no real data to pull from. I had to rely on what some people have told me in previous years and research.
  • I didn’t know which phone size to use; not sure if that mattered as much.
  •  “Which fonts and colours will look the best and will send out the tone of voice I’m trying to convey?” (Tone of voice: Strong, Encouraging, Friendly)
  •  “Which elements would be better to have on this landing page?/Which elements would be more beneficial for the user?”
  • “Where should these elements go? Top or bottom corner?”

Low-Fidelity Wireframes

Medium Fidelity Wireframes


After drafting multiple wireframes and debating with various choices, I was able to create and put together a finalized design. I’ve went with a minimalistic design as the attention should be on the functionality of the app. I have included elements that may be helpful when it comes to someone’s fitness journey and overall physical health. I also included a social aspect: sharing their progress on their social media and the top exercises done that week. This may entice the person to be more motivated if others were involved in their journey. There are also trophies to be earned, which may be beneficial to those who are competitive and gets motivated through achievements. 

Though it may not be perfect or the best, I am still proud of my progress. 

High-Fidelity Wireframes & Prototype

> To access the prototype, please click here.


This is a solo project. Responsibilities included: 

  • UI Design
  • UX Research/Design
  • Graphic Design


  • Adobe XD
  • Adobe Illustrator

Date accomplished:

Started: February 1, 2022

Ended: February 28, 2022