

X
BRAINSTATION
WHOOP x BRAINSTATION
My Role
UX Research| UX Designer
Timeline
24 hours
Project Type
Hackathon
Platform
iOS App
For the hackathon, I was paired with one UX Designer and 3 Web developers. We had 24 hours to design a feature that aligned with WHOOPs' goals, branding, and existing features to solve their current problem.
Design Challenge
WHOOP and its users have seen the tremendous benefits of its wearable technology product. How can we help even more people to unlock the benefits of understanding what their bodies are trying to tell them?
They are looking to:
-
Empower users to take control of their health and wellness
-
Educate existing and prospective users on the health benefits of recovery, sleep, and activity tracking
-
Integrate with other existing health, wellness, and fitness applications
-
Explore new opportunities for users to integrate WHOOP into their everyday lives
Design Question
How might we inspire individuals at any stage of their health and wellness journey to reach their goals via WHOOP’s personalized tracking and coaching feedback?
Design Process
Due to the 24-hour time constraint, my team decided to modify the design process to deliver the best design solution for the proposed challenge.
01.
Empathize
-
Design Challenge
-
Problem Space
-
Secondary Research
02.
Define
-
Hypothesis
-
Interviews
03.
Ideate
-
Brainstorm
-
Task Flow
03.
Prototype
-
UI Library
-
Sketches
-
Wireframes
-
Protoype
Secondary Research
To be able to create a design solution that followed brand standards and was aligned with their mission statement we had to do some research on WHOOP.
We researched their mission statement, existing features, reviews, opinions, goals, and beliefs. We found that WHOOP collects in-depth data on sleep, training, recovery, and health to provide the best-personalized feedback. Since their goal is to expand their market we went on to explore ways for non-athletes to benefit from the data collected.
Our goal was to better understand what users of wearable technology look for when selecting a fitness tracker. We found that the most relevant features were:

Good battery life

Measurable data

Workout plans
When comparing our research with WHOOPs' technology we found that they already offer a great battery life and measurable statistics of all the data collected. Therefore, we decided to focus on creating workout plans for their users.
Hypothesis
We hypothesized that users want custom workout plans that link directly to their fitness tracker based on the data collected.
Interviews
To validate our hypothesis we conducted 5 interviews to learn more about the users' pain points, motivations, and behaviors regarding their workout routine. The main insights and frustrations collected were divided into the following main themes:
01.
Tracker
People love being able to track their routines for future access
02.
Routines
Most people need help structuring their routine to get optimal results
03.
Challenges
People love the motivation to stay active given by challenges
Task Flow
Considering the design question, existing features, and interview findings we decided to focus on creating challenges for users to help increase retention rate. Our main goal was to implement our idea to the existing "Teams" feature of the app to facilitate the adaptation of current users and increase the productivity of this feature.
We designed a task flow to show the steps users would take to complete the final task: select a challenge and track their statistics.
.png)
Sketching
Our sketches exhibited the main screens the user would interact with to complete the task on hand. We focused on the individual challenges screen, the specific challenge screen, the progress screen, and the report screen. Our main idea was to create designs where users can easily join or start a new challenge with friends or by themselves.








Wireframing
After selecting the best designs for our users, we translated them into mid-fidelity prototypes. We made some small adjustments with content distribution to provide the best user experience. At the beginning of this stage, we started working closely with developers to ensure the final product would be delivered on time. We provided them with margins, padding, font, colors, and copy detail, and they had access to the figma file.
UI Library
We prioritized adhering to the brands' existing UI to facilitate the adaptability of their current users. We searched for their brand and accent colors along with their typography and logo.



High-Fidelity Prototype
The goal was to create a 'Challenges' section embedded into their 'Teams' feature to broaden their target users and increase retention rate.
We continued with color injection to create hierarchy, guide the user through the app and adhere to the existing UI.

Key Learnings
Getting to work closely with developers under a stressful situation, due to time constraints, forced us to prioritize communication. We implemented the following strategy to achieve our end goal.
01
Established time limits for each step of the design process and defined clear outcomes during each stage for developers to start their process.
02
Constantly follow up with the team to make sure everyone is aligned with the goal of the corresponding stage.
03
Set short and productive meetings between both teams to comment on the process and define the next steps.
04
Set a team leader responsible to keep the team on track.