Desktop HD Copy.png

Athletice

Desktop HD.png
 
 

Brief

Fitness INSTITUTE

The Fitness Institute is an organization founded in 1978, known for its sport centers. The company has been very successful, but their program has been slow to catch up with developments in technology. They are seeing a substantial drop in memberships and want to find a way to add value to their members.

Problem

Athletes prefer wellness apps than go to fitness centers

The health and wellness industry has been experiencing immense disruption due to advancements in technology. Today’s consumers are embracing wearable technologies and other activity-tracking products more than ever before. The omnipresence of the smartphone has spawned a mass market for mobile health and wellness apps.

Challenge

Translate the concept of FITNESS of its centers into a digital product and increase membership subscriptions

The Fitness Institute was very excited to explore how they can leverage technology to help people live a healthier lifestyle. The FI wanted a designer to reimagine how people can adopt and maintain a routine that enhances their wellbeing.

I had to investigate to understand people’s relationship with mental, physical, and emotional wellbeing in order to develop a tool that would drive them to action.

 
 
iPhone-X-in-hand-7.jpg
 
 

Research

Decrease risk of injury whith personalized training plans

I started this project conducting user research to understand people’s relationship with mental, physical, and emotional wellbeing in order to develop a tool that would drive them to action.

The research of the design patterns and technologies in the market was the first step to understanding the landscape of similar and complementary tools. I wanted to know how to position the new product in this landscape and it resulted that there didn’t exist anything like this in the market at the time.

The results of the benchmark were followed by a Lean Survey Canvas, 5 interviews and 30 surveys that confirmed there was a concern about obtaining injuries while practicing a sport and a desire to avoid them with specific training plans.

 
Athletice.png
Athletice.png
User-Personas.jpg
 
 

Personas

Identifying the people who would use the product, what they would use it for, and under what conditions they would use it was the second part of this research. I defined these personas, identifying the users’ motivations, goals and needs for using the product. In order to guarantee the product usefulness and effectiveness from the user’s point of view I used User Personas and Empathy Maps.

 
 
Protojourney.png
 
 

User Journey

The results of the Personas guided me to the next phase, where my main goal was to discover the ideal user experience, describing the main steps performed by the users and validation of the different user scenarios. I went through the User Journey Map, or a Proto-Journey in this case, to provide me with a vision of the global user experience, ensuring its consistency and fluidity.

Functionality Matrix

Before jumping into design, I prioritized features by taking into account the user goals and the product goals. It gave me an indispensable basics for the project development plan, ensuring that a viable product could be developed.

 
 
Wireframes2.jpg
Wireframes.jpg
 
 

Sketches

Low-FI

I started doing a Task Analysis with a Low Fidelity prototype of the app on-boarding to check the navigation flow and information architecture. I had to reorganize it because there wasn’t a screen where you could select your plans or try other workouts.

 
 
Userflow-Athletice.png
 
 

User Flows

I started doing a Task Analysis with a Low Fidelity prototype of the app on-boarding to check the navigation flow and information architecture. I had to reorganize it because there wasn’t a screen where you could select your plans or try other workouts.

 
 
Mid-Fi Screens.png
 
 

Wireframes

MID-FI

Iterating to improve the lo-fi wireframe I executed mid-looking screens by applying the styleguide to the wireframes. I was accessible online to be available to potential users through to continue testing and facilitating the feedback.

The results showed that it had to be more visual than illustrated and I had to reorganize the menu to have less buttons and less distractions at the on-boarding stage.

 
 
Mid-fi.png
 
HI-FI.jpg
 
 

Prototype

Hi-Fi

For the High Fidelity prototype I modified the wireframe using design patterns for a better UX, adding images, interactions, color and typography. I needed to solve the on-boarding problems and how the user was going to move through the app to achieve their goals.

Onnboarding.gif
 
 
Dashboard.gif
 
Rewards-cover.jpg
 
 

Conclusions

The design of the Athletice app has been defined by each stage of the process. I haven’t showed all the tools used, but each of them has a crucial importance to guiding this project. I have wanted to share the major milestones, providing a general understanding of the project’s structure, phases, intersections and interdependencies. If you have any question about it don’t hesitate to drop me a line and we can take it from here.