MVP: Motivation. Vision. Purpose.

MVP is a mobile fitness app that focuses on setting goals and connecting users for 'virtual' workout sessions. Following the Design Thinking process, I explored COVID-19's impact on Canadian millennials' physical activity. With a user-centric approach, I conducted research, interviews and usability testing to design this digital solution.

Role
Solo UX/UI Designer
Scope
Case Study
Deliverables
Mobile App
Duration
Two months
Tools
Figma
Empathize

Background

COVID-19 became a global health pandemic in 2020, putting a toll on everyone's physical, emotional and mental well-being, including myself. The social restrictions and gym closures caused me to exercise less, and lose motivation. I decided to research if other Canadian millennials experienced this same issue, and whether a mobile app could be the solution.

49%

of Canadian millennials' physical activity were affected by the restrictions caused by COVID-19.

38%

of Canadian millennials performed 2.5 hours of weekly moderate-to-vigorous physical activity before COVID-19.

29%

of Canadian millennials performed 2.5 hours of weekly moderate-to-vigorous physical activity during COVID-19.

Insights into Opportunity

Performing 2.5 hours of weekly exercise provides health benefits, but those who met this threshold declined during the pandemic. Therefore, I wondered:

"How might we help Canadian millennials return to their exercise routines, so that they meet the recommended weekly guidelines?"

Validating the Research

Did this data accurately represent the experiences that Canadian millennials faced? To answer this and understand who my potential users were, I interviewed five people. Out of three common themes, a key theme* was selected to begin guiding my design decisions.

Exercise Challenges
  • A lack of time
  • Exercising alone
  • Feeling tired
  • No fitness direction
Value of Exercise
  • Getting health benefits
  • Staying fit
  • Ridding stress
  • Feeling healthier
Exercise Motivations*
  • Exercising with others
  • Having fitness goals
  • Being held accountable
  • Following a routine
Define

Illustrating a Persona & the Experience

My insights focused on social interaction and having fitness goals as main motivations for exercising. However, to encapsulate who my target users, their goals and pain points were, a persona was created. An experience map was also designed to depict my persona's current journey when searching for exercise motivation.

Persona
experience map
Ideate

Creating User Stories

At the point of discouragement is where I believed a digital solution could intervene. However, I had to author user stories first to describe how app features could deliver value for the persona. Categorized into groups or 'epics', I selected a primary epic* for the app's main task flow, as it closely aligned with the key theme. Some of these stories are below.

Tracking Fitness Habits
  • As a fitness enthusiast, I want to track my fitness progress, so that I know which areas to improve.
  • As a fitness enthusiast, I want to track my calorie intake, so that I'm not over-consuming.
Setting Up For Success
  • As a fitness enthusiast, I want to access new exercises often, so that I don't become bored.
  • As a fitness enthusiast, I want to set goals, so that I have a proper plan of action.
Staying Socially Connected*
  • As a fitness enthusiast, I want to add friends onto the app, so that we connect through fitness.
  • As a fitness enthusiast, I want to workout with a friend, so that I'm motivated to exercise.

Developing a Task Flow

Since social connection emerged as the main exercise motivation during the interviews, the app's main task flow was designed around this. Having fitness goals for accountability was also a common theme, so integrating this as well would be valuable. This flow considers my persona's goals & pain points by enabling them to connect with friends, workout together and also set fitness goals when creating their profile.

Task flow diagram
Prototype

Designing Wireframes

Based on the flow, I sketched app screens and designed mid-fidelity wireframes, with elements inspired from apps such as Nike, Duolingo, and Discord.

mid-fidelity wireframes
Test

Gathering Design Feedback

I then conducted user testing on ten people over two rounds, which helped me learn more about my users, recognize any usability issues and discover areas for design improvements. After each round, design iterations were made that focused on the user's feedback, likes, and pain points.

ADD FRIEND OVERLAY
Home screen
select routine screen
Virtual workout screen
sessions result screen

Applying Style Guidelines

As iterations concluded, I focused on styling the app. I curated a mood board of images that included the keywords "connected" & "fitness", and extracted brand, neutral and accent colours. Using a modern font, Bai Jamjuree, I created the wordmark MVP, an acronym for motivation, vision & purpose. These decisions were made to capture the interest of my target users.

Hi-Fidelity Wireframes

With branding applied, the final version of MVP was complete. This fitness app intends to convey feelings of 'motivation', 'vision' and 'purpose' for millennials whose exercise routines were impacted by the pandemic. Users can add friends to stay connected, set fitness goals to be kept accountable, and complete virtual workouts with others to stay motivated.

Feature 1: Profile Setup (incl. Adding Friends & Setting Fitness Goals)
1) User creates their profile, with a unique username, and inputs their height & weight.
2) User uploads a profile picture of themselves to customize their experience.
3) User adds friends to the app to be connected through workouts & messaging.
4) User sets fitness goals to be kept accountable every time they open MVP.
Feature 2: Detailed Home Screen
1) User has access to their daily goals they set when creating their profile.
2) Daily fitness goals are highlighted once the threshold has been met.
Feature 3: Virtual Workout Setup
1) User selects a virtual workout mode to begin the setup process.
2) User selects a friend to invite for the workout (if the 'with a partner' option is selected).
3) User selects a workout routine to participate in with the partner.
4) User confirms all prior selections and can edit each one if required.
Feature 4: Virtual Workout
1) Users can 'virtually' workout with a friend. A demo and time limit are displayed before the exercise changes.
2) A sessions result is provided after users are finished. Routines can be rated for other app users to see.
View Interactive Prototype

Project Takeaways

Through extensive research, designs and wireframing, I took a user-centred problem and created a user-centred solution. I also ensured that I kept the user needs in mind by regularly going back and forth between the stages of the Design Thinking process while making design iterations.

Specifically, I learned to:
Next project

TD Canada Trust