Fitness App - Compound

Project Overview

Compound is a fitness app that allows athletes to easily access workout programmes while at the gym. This project aims to redesign the app considering heuristics and design principles, so as to improve usability while maintaining brand alignment and functionality.

My Contributions

I am responsible for designing assets, screens, and navigation. Volunteers will be asked to participate in usability testing, which will inform final design decisions for this project. 

This case study is currently still in progress. 

  • 1
  • 2
  • 3
  • 4
  • Consider how the product is currently solving users' needs.
  • Analyse user flow and element funcionality to identify areas of improvement.
  • Design a high-fidelity prototype to test new features.
  • Present an improved product that Compound users can benefit from.

Product Analysis

Observations

Is the current product offering following usability best practice?

As a first step I explored the functionality of the app, keeping in mind design heuristics and best practice. This allowed me to pinpoint elements that were hindering the user experience, always keeping in mind the context and behaviours of users, such as logging data on the app while in between exercise sets at the gym.

This was a great way for me to take note of changes that would be required for the existing product. By making detailed observations of elements that were working, and elements that weren’t, I now had a list of improvements to focus on.

Design Stage

Sketches

Brainstorming possible design solutions.

Quick sketches are always a good way to get those brain juices flowing!

Sketching allows me to make various versions and keep iterating on my ideas in a way that is quick and highly flexible. 

I like to always try to find more than one possible solution for each screen state, which you can see reflected in the drawings shown below. 

Adding notes on interactions and functionality also allows me to go back to the sketches, even if that’s a few days later, and instantly know what my thought process was when drawing these, to then be able to translate that into my high-fidelity designs. It’s also great practice, as adding notes and comments is a must when working with a team, and you need to be able to communicate the intention behind your designs.

High-Fidelity Designs

Turning those rough sketches into functional designs.

Considering this is an existing product, I wanted to respect the brand style. It was important to maintain the Compound brand colours and feel, and focus on improving the existing functionality so as to create a more intuitive user experience. 

In the following designs, special attention was given to the following elements and interactions: 

Quick and clear overview of workout sessions
Clear call to action buttons 
Intuitive navigation both in bottom tab bar and FAB
Easy access to app tools during exercise
Progress indicator during workout sessions
Numeric keyboard for number input fields
Update status on finished exercise sets - check marks
Feedback messages where relevant, such as saved workouts
Easy error recovery if user mistakenly completes a workout

Next Steps...

Testing the designs

While I believe the proposed designs are an improvement on the app aesthetic and functionality, it’s important to put it to the test. 

For the next stage of the project, I will use the designs to create an interactive prototype. This will allow me to test the navigation and interactions, and obtain valuable feedback from users before finalising the app redesign.

Keep an eye out for the next stages of the project: A high-fidelity prototype and usability testing.