Summary

To keep people active and socially engaged during the pandemic, an end-to-end app was designed to facilitate pairing anyone with their ideal exercise buddy.

Disclaimer

This is an exploratory project for Hurley as a prospective product line, all concept development and prototype production were self-led to identify market fit.

Client

Hurley

Team

Product Manager, Developers

Role

Research, UXUI Design

Timeline

4 Weeks (Jan, 2022)

The Challenge

Exercising has been crucial to maintaining mental and physical health throughout the pandemic. However, federal data shows that less than only 25% of American adults get the government-recommended doses of exercise each week. People and communities worldwide have been experiencing higher levels of stress, anxiety, and depression. They also feel more emotionally isolated, insecure, and confused. A lot of these are exacerbated by a sharp decrease in physical activities, particularly for city dwellers, and restarting the habit of maintaining physical fitness can be very challenging and unpleasant.

How might we inspire people to stay motivated and keep up with a active lifestyle during the pandemic?

High-level Goals

Understand people’s fitness habits and behaviors

Identify people’s current dilemma when it comes to workout routines

Promote fitness and mental wellness by incentivizing people to stay active

Research

Initial Research Goals

  • Identify people’s fitness habits and behavior before and since the pandemic
  • Uncover people’s needs, wants, and frustration regarding their fitness routines
  • Discover how do people currently solve those problems

Comparative Analysis

I began my research by looking into fitness apps that focus on different core competencies in the market. The findings are summarized in the SWOT analysis and key screen comparisons below.

User Interviews

In order to understand the what/why/how/where relating to people’s fitness habits and routines, or any approach they are taking to improve their situations, I conducted 1-on-1 interviews with 6 users, all of whom are active or aspired to be active before or during the pandemic. The findings are clusterized into groups to help identify my target pain point and opportunity, and also formulate a single persona later on.

Define

User Persona

All insights from the research phase were synthesized into a user persona in order to empathize better with a possible user.

Feature Prioritization Matrix

Taking users’ needs and frustrations into consideration, I moved on to laying out key features to prioritize within several development phases. The goal for the first MVP should not only address the basic needs of its function (a social platform for users to connect through fitness) but also promote and inspire the community aspect through credible and inviting content.

Information Architecture

A sitemap was also created simultaneously to obtain a clear information organization and architecture, the depth of the project, as well as the potential roadmaps for a user to complete their desired tasks.

User Flow

Through the use of sitemaps, I was able to design a flow that goes from launching the app for the first time to completing its core offerings, which are finding a workout partner and completing a workout on a schedule together.

Design

Wireframes

I began iterating ideas and then transferred my sketches to mid-fidelity wireframes in order to visualize and plan out the stages of the flow. The goal is to focus on promoting the social aspects of the product, which is to discover and interact with workout companions. The touchpoints for each task given should be effortless to complete, the interface should be clean and not overwhelming, more importantly, the navigation and visibility status should be clear and intuitive. Working within the framework of grids, I started to implement an icon set, layouts, design patterns, and primary copy onto my wireframes.

Brand Identity

After laying out wireframes for the application, I began the UI process by looking at inspirations before solidifying the color palette and heuristics of Boost’s branding. The direction should encapsulate the following:

Playful / Friendly / Modern / Energetic / Gender neutral

I started ideating around these concepts, eventually narrowed them down to four options to choose from-each exemplifies a different form of movement and connection to positivity. After discussion with a focused group, the second option appeared to be the most favored based on its memorability, flexibility, and overall appeal.

UI Kit

With a modern aesthetic in mind, the UI kit began taking shape with the final logo, color palette, typography, visual treatment, icons, and navigation controls. The illustrations were taken from various artists online, manipulated, and re-constructed in Illustrator. These elements tie the entire theme together and offer a fun and lighthearted mood for the users.

Applying UI To Wireframes

After establishing the UI kit, the product was ready to be brought to life with all the visual elements. Below are some of the key screens from the first version of Boost mobile app. Users start with onboarding the app, then search for workout partners, and finally schedule workouts together. 

Usability Testing

Testing Goals

  • Overall ease of use and UI experience while navigating through the app
  • How users make assumptions and respond to the IA of the product
  • Complete user flows (Onboard -Search for a partner – Interact & workout with a partner)
  • Any pain point or confusion throughout the process

Does it actually work?

In addition to presenting my first iteration of the high-fidelity prototype to a weekly group critique, I performed usability tests with a number of users in order to understand how the app functions. All participants are proficient in using smartphones and have been looking for ways to improve their fitness regimens. Testings were conducted remotely via communication platforms while navigating through the mobile app.

The prototype was a great success and all users commented that they were able to comprehend and accomplish the app’s objectives with no difficulty. They also expressed they especially loved the concept and visuals and how they attracted them to stay curious and engaged on the app.

Affinity Map

Subsequently, I created an affinity map to synthesize all feedback from my group critique, user testings, and mentor in order to determine priority revisions based on all information gathered. Green cards represent success, red cards represent pain points, and blue cards represent design opportunities or suggestions. All the pain points were modified and 80% of the design suggestions were taken into consideration for round one revisions.

Priority Revisions

Changes to round two prototype iteration include the following:

Onboarding
A new question has been added to inquire about a user’s goal from his or her workout partner 
– Improved button and slider gradient style
– Re-structured signup page

Search for a buddy
– Revamped homepage
– Updated map view
– Updated profile page

Interact with a buddy
– Redesigned congratulations pop-up and workout overview
– Redesigned the flow of sending schedule invite
– Updated Activity page

Final Thoughts

Overall, it was challenging but incredibly rewarding to build a complete mobile application in such a short period of time. By creating a fun, engaging, and uplifting app experience for users, I hope to not only motivate them to maintain a healthy and active lifestyle but also to strengthen or expand their social networks during this unprecedented epidemic.

If there were more time to dedicate to this project in the future, I would consider working on the following:

  • Expand the scope in specifics to users who are interested in pairing with workout partners virtually
  • Connect network to the user’s existing social circles
  • Facilitate more interactions amongst workout partners and the possibility of strengthening rapport and building long-term relationships
  • Conduct more usability testings and implement revisions