Eat to Perform Fitness App

Eat to Perform Fitness App

Project type

Project type

UX Redesign

UX Redesign

Company

Company

Eat to Perform

Eat to Perform

Location

Location

USA

USA

Industry

Industry

Health and Fitness

Health and Fitness

Role

Role

Lead Designer

Lead Designer

Timeline

Timeline

3-6 months

3-6 months

Brief

A fitness and wellness mobile app with a passionate monthly user base of 5,000+ that wants:

  1. Reduce support calls

  2. Increase self-service

  3. Decrease attrition

  4. And double daily active users

So what's broken?

1. Helpful data can be hard to find and interpret.
2. Poor self service and UX lead to a high amount of support calls.
3. Frequently repeated tasks are often cumbersome and confusing leading to attrition and low engagement.



Where do we start?

Current State Crit

Competitive Analysis

Bill's User Flow

Define Personas

Current State Crit

To better understand the current state and where gaps and inconsistencies existed I performed an design analysis of each screen.

Competitive Analysis

Before starting any redesign activities I also wanted to conduct some competitive analysis to see what we could learn from other large players in the space.

Bill's User Flow

I interviewed several customers on how they interacted with their Nike Fuelbands or similar devices to create a user flow for Bill. This helped us understand when and how Bill preferred to engage with his wearable and the accompanying app and helped us when it came to designing the app's workflow and prioritizing features.

Define Personas

I worked with product to define two personas we could reference throughout the project.

Current State Crit

To better understand the current state and where gaps and inconsistencies existed I performed an design analysis of each screen.

Competitive Analysis

Before starting any redesign activities I also wanted to conduct some competitive analysis to see what we could learn from other large players in the space.

Bill's User Flow

I interviewed several customers on how they interacted with their Nike Fuelbands or similar devices to create a user flow for Bill. This helped us understand when and how Bill preferred to engage with his wearable and the accompanying app and helped us when it came to designing the app's workflow and prioritizing features.

Define Personas

I worked with product to define two personas we could reference throughout the project.

Current State Crit

To better understand the current state and where gaps and inconsistencies existed I performed an design analysis of each screen.

Competitive Analysis

Before starting any redesign activities I also wanted to conduct some competitive analysis to see what we could learn from other large players in the space.

Bill's User Flow

I interviewed several customers on how they interacted with their Nike Fuelbands or similar devices to create a user flow for Bill. This helped us understand when and how Bill preferred to engage with his wearable and the accompanying app and helped us when it came to designing the app's workflow and prioritizing features.

Define Personas

I worked with product to define two personas we could reference throughout the project.

What did we learn?

Improve the UX

Improving the UI and UX were table stakes as these were very poor and were causing many of our issues before scaling out the app out further.

Meet users where they are

We needed to meet users where they were by allowing easy updates of macros on the nutrition screen and easily move between the different areas of the application for any further updates.

Target our primary persona

Our ideal user was more the fitness enthusiast than the casual user so we focused on those use cases as this user tended to be "stickier" and use the app more each day as well as longer over the lifetime.

Let's start designing!

Early Paper Sketches

Top of mind things during this phase:

Accessing their coach is one of the most frequent tasks. How do make this easily discoverable on any screen?

Accessing their coach is one of the most frequent tasks. How do make this easily discoverable on any screen?

Accessing their coach is one of the most frequent tasks. How do make this easily discoverable on any screen?

Right now the nav is pretty much unusable and completely hidden in a menu icon. Let's give users a bottom nav to match commonly used mental models.

Right now the nav is pretty much unusable and completely hidden in a menu icon. Let's give users a bottom nav to match commonly used mental models.

Right now the nav is pretty much unusable and completely hidden in a menu icon. Let's give users a bottom nav to match commonly used mental models.

Really focus on KPIs so users can see the data they want and need on every screen and take appropriate action.

Really focus on KPIs so users can see the data they want and need on every screen and take appropriate action.

Really focus on KPIs so users can see the data they want and need on every screen and take appropriate action.

Design System

Design System

I created a small design system to make sure the app was consistent and accessible. I worked with the product and engineering teams to implement and adopt the new components to help reduce time and cost for future redesign projects as well.

I created a small design system to make sure the app was consistent and accessible. I worked with the product and engineering teams to implement and adopt the new components to help reduce time and cost for future redesign projects as well.

Prioritization Issues

Prioritization Issues

Designs were well received throughout the process but the app was the CEO's "baby" and he had a hard time prioritizing the work to get done.

I worked with the director of engineering to show that there would be minimal downtime and user impact.

I also presented the designs and results from our internal research that showed:

substantial lift in ease of use

substantial lift in ease of use

substantial lift in ease of use

reduction of time on task

reduction of time on task

reduction of time on task

consistency in the experience reducing cognitive load

consistency in the experience reducing cognitive load

consistency in the experience reducing cognitive load

perceived value in matching best-in-class looking competitors

perceived value in matching best-in-class looking competitors

perceived value in matching best-in-class looking competitors

Final Screens

Some highlights are: improved affordances throughout, a cleaner and simpler bottom nav, better charting and data visualizations, top KPIs more clearly called out, and the ability to chat with your coach from any screen.

Nutrition Dashboard

Nutrition Dashboard

Weight Dashboard

Weight Dashboard

Activity Dashboard

Activity Dashboard

Week Plan

Week Plan

Journal History

Journal History

Add Nutrition Data

Add Nutrition Data

Measuring and Validating Designs

Measuring and Validating Designs

Research Feedback

We conducted moderated research with internal services and support staff who well understood end user pain points and frustrations.

Discoverability was greatly increased on how to use the app and find the right data.

Direct customer quote "I'm so happy that I can add macros from the main screen now!"

Users were excited about the UI updates but also had a positive response to UX issues we solved for and the reduction of friction on the most common workflows.

Users felt that the visuals and data were much clearer and more useful.

Results and Reflection

I'm proud of the work that we did on this application. We took a very dated app with a disjointed and inefficient experience and measurably improved it. With clearer data and simpler and easier workflows we've enabled our users to reach their health goals more easily.

Retention Rate: Increased by 51%

Churn rate: Reduced by 68%

Daily Active Users: From 1,241 to 2,543

Check out another case study

Staples' The HUB

The HUB is Staples' internal HR and intranet site serving 10,000+ associates across the company

The HUB is Staples' internal HR and intranet site serving 10,000+ associates across the company

Cheetah Digital Marketing Suite (Coming Soon)

A 0-1 vision project to rethink how marketers use Cheetah Digital's suite of tools.

A 0-1 vision project to rethink how marketers use Cheetah Digital's suite of tools.

Salesforce Email Creation Flow (Coming Soon)

Redesigned from the ground up Marketing Cloud's email creation workflow used by 10,000+ users every day.

Redesigned from the ground up Marketing Cloud's email creation workflow used by 10,000+ users every day.

Phil Schroeder // Copyright © 2024

Phil Schroeder // Copyright © 2024