A New Shape for MFIT

A New Shape for MFIT

Heuristics evaluation and redesign concept for a fitness app

Heuristics evaluation and redesign concept for a fitness app

Client

Ironhack (Bootcamp project)

Date

Nov, 23

Timeframe

1 week

Team

Lucas Pimentel

Overview

In this article, I’m diving into a redesign exercise for the MFIT fitness app, a project that was part of my UX/UI boot camp coursework at Ironhack Berlin.

The task was to scrutinize the app’s current design with a fresh pair of eyes, identifying opportunities to smooth out the user experience for students.

The goal here was to conduct an heuristics evaluation, but there is also a first exploration of a solution to fix the issues in my prototype.

You can check out the prototype by clicking on the image or here.

In this article, I’m diving into a redesign exercise for the MFIT fitness app, a project that was part of my UX/UI boot camp coursework at Ironhack Berlin.

The task was to scrutinize the app’s current design with a fresh pair of eyes, identifying opportunities to smooth out the user experience for students.

The goal here was to conduct an heuristics evaluation, but there is also a first exploration of a solution to fix the issues in my prototype.

You can check out the prototype by clicking on the image or here.

About the app

MFIT, a popular app among Brazilian personal trainers, plays a pivotal role in their relationship with students, facilitating workout tracking and administrative tasks like document management and payment processing. With separate interfaces tailored to each group’s needs, it’s primarily personal trainers who drive the app’s revenue model, with students accessing the services at no extra cost.

Personal trainers use their version of the service to manage their students and their workouts, while the practitioners use their version to follow their assigned workouts. As I am a user of the second, this case study focus on a few redesign ideas specifically for it.

Although the app has achieved impressive user ratings, with 4.7 out of 17k reviews on Google Play and 4.9 out of 90k on the App Store, insights suggest that the student side of the interface could use a facelift to enhance ease of use. My upcoming suggestions aim to simplify the student interaction, making for a more straightforward and enjoyable experience.

MFIT, a popular app among Brazilian personal trainers, plays a pivotal role in their relationship with students, facilitating workout tracking and administrative tasks like document management and payment processing. With separate interfaces tailored to each group’s needs, it’s primarily personal trainers who drive the app’s revenue model, with students accessing the services at no extra cost.

Personal trainers use their version of the service to manage their students and their workouts, while the practitioners use their version to follow their assigned workouts. As I am a user of the second, this case study focus on a few redesign ideas specifically for it.

Although the app has achieved impressive user ratings, with 4.7 out of 17k reviews on Google Play and 4.9 out of 90k on the App Store, insights suggest that the student side of the interface could use a facelift to enhance ease of use. My upcoming suggestions aim to simplify the student interaction, making for a more straightforward and enjoyable experience.

Research

To start my investigation into potential redesigns for the MFIT app, I first did some research beginning with the app’s reviews. I carefully analyzed both the positive and negative user feedback found on the Apple and Google stores — very insightful due to the high amount of reviews.

Additionally, I also talked with actual app users and a personal trainer, gathering their firsthand experiences and perspectives.

I also benchmarked with a variety of similar apps, identifying best practices that could inspire me in the process.

To start my investigation into potential redesigns for the MFIT app, I first did some research beginning with the app’s reviews. I carefully analyzed both the positive and negative user feedback found on the Apple and Google stores — very insightful due to the high amount of reviews.

Additionally, I also talked with actual app users and a personal trainer, gathering their firsthand experiences and perspectives.

I also benchmarked with a variety of similar apps, identifying best practices that could inspire me in the process.

A Notion page where I kept notes on comments from friends and the Stores, as well as apps to benchmark

Some screenshots in Figma used as inspiration for the new design

Heuristics Evaluation

In order to decide what changes to recommend, a heuristic evaluation — which is a review of the interface against established usability guidelines — was conducted. The conclusions drawn from this evaluation are as follows:

In order to decide what changes to recommend, a heuristic evaluation — which is a review of the interface against established usability guidelines — was conducted. The conclusions drawn from this evaluation are as follows:

User Control and Freedom

User Control and Freedom

User Control and Freedom

The app currently restricts users to logging only one weight lifted per exercise, with no option to record varying repetitions or sets.

This limitation is significant for those whose workouts fluctuate in intensity or for those who wish to track progress more granularly. In real life, we sometimes either cannot lift the same weight throughout the sets, or just want to test a higher one.

Additionally, the absence of a feature to comment on specific exercises until the workout is saved is a missed opportunity for users to note their experiences or adjustments as they go, which could be valuable data for personal trainers.

The app currently restricts users to logging only one weight lifted per exercise, with no option to record varying repetitions or sets.

This limitation is significant for those whose workouts fluctuate in intensity or for those who wish to track progress more granularly. In real life, we sometimes either cannot lift the same weight throughout the sets, or just want to test a higher one.

Additionally, the absence of a feature to comment on specific exercises until the workout is saved is a missed opportunity for users to note their experiences or adjustments as they go, which could be valuable data for personal trainers.

The app currently restricts users to logging only one weight lifted per exercise, with no option to record varying repetitions or sets.

This limitation is significant for those whose workouts fluctuate in intensity or for those who wish to track progress more granularly. In real life, we sometimes either cannot lift the same weight throughout the sets, or just want to test a higher one.

Additionally, the absence of a feature to comment on specific exercises until the workout is saved is a missed opportunity for users to note their experiences or adjustments as they go, which could be valuable data for personal trainers.

On the image: the user sets the weight used for that exercise - they can only log one item per set.

Aesthetic and Minimalist Design

Aesthetic and Minimalist Design

Aesthetic and Minimalist Design

The app's home screen includes redundant links to a coach’s WhatsApp and Instagram — contacts users likely already have — and a menu cluttered with options that are redundant to those on the home screen.

Similarly, the home screen presents an array of buttons, many of which are seldom used.

There's also a missed opportunity to make use of the home screen to show the user more relevant information about their workouts and progress.

Streamlining these elements could enhance the app’s design, steering it towards a more minimalist and user-focused interface.

The app's home screen includes redundant links to a coach’s WhatsApp and Instagram — contacts users likely already have — and a menu cluttered with options that are redundant to those on the home screen.

Similarly, the home screen presents an array of buttons, many of which are seldom used.

There's also a missed opportunity to make use of the home screen to show the user more relevant information about their workouts and progress.

Streamlining these elements could enhance the app’s design, steering it towards a more minimalist and user-focused interface.

The app's home screen includes redundant links to a coach’s WhatsApp and Instagram — contacts users likely already have — and a menu cluttered with options that are redundant to those on the home screen.

Similarly, the home screen presents an array of buttons, many of which are seldom used.

There's also a missed opportunity to make use of the home screen to show the user more relevant information about their workouts and progress.

Streamlining these elements could enhance the app’s design, steering it towards a more minimalist and user-focused interface.

On the image: the user sets the weight used for that exercise - they can only log one item per set.

Visibility of system status

Visibility of system status

Visibility of system status

Visibility of system status

When it comes to keeping users informed, there’s a noticeable opportunity for improvement in the app’s design.

Currently, users are left in the dark as to whether an active workout is in progress or not, which can lead to confusions such as accidentally starting a workout without realization.

Furthermore, if a user forgets to finish and save their session, there’s no clear reminder unless they remain on the workout screen. Addressing this would ensure users are always aware of their activity status within the app.

When it comes to keeping users informed, there’s a noticeable opportunity for improvement in the app’s design.

Currently, users are left in the dark as to whether an active workout is in progress or not, which can lead to confusions such as accidentally starting a workout without realization.

Furthermore, if a user forgets to finish and save their session, there’s no clear reminder unless they remain on the workout screen. Addressing this would ensure users are always aware of their activity status within the app.

When it comes to keeping users informed, there’s a noticeable opportunity for improvement in the app’s design.

Currently, users are left in the dark as to whether an active workout is in progress or not, which can lead to confusions such as accidentally starting a workout without realization.

Furthermore, if a user forgets to finish and save their session, there’s no clear reminder unless they remain on the workout screen. Addressing this would ensure users are always aware of their activity status within the app.

When it comes to keeping users informed, there’s a noticeable opportunity for improvement in the app’s design.

Currently, users are left in the dark as to whether an active workout is in progress or not, which can lead to confusions such as accidentally starting a workout without realization.

Furthermore, if a user forgets to finish and save their session, there’s no clear reminder unless they remain on the workout screen. Addressing this would ensure users are always aware of their activity status within the app.

On the image: user navigates to workout page, starts the workout, but then after leaving the screen has no indication that it's in progress or a way to go back to it.

On the image: user navigates to workout page, starts the workout, but then after leaving the screen has no indication that it's in progress or a way to go back to it.

Flexibility and Efficiency of Use

Flexibility and Efficiency of Use

Flexibility and Efficiency of Use

Starting a workout ideally would be seamless, yet the current menu could be more straightforward.

User have to navigate and click to much to find their workout. Also, if they don't know which one was the last - or which one is set for today - they will have to navigate through different pages to find their last completion date.

Simplifying this step would not only improve the immediate user experience but also align with best practices.

Additionally, incorporating a feature to review past workout details would be beneficial for users looking to track their progress. Enhancing these aspects of the app is key to elevating its overall usability.

Starting a workout ideally would be seamless, yet the current menu could be more straightforward.

User have to navigate and click to much to find their workout. Also, if they don't know which one was the last - or which one is set for today - they will have to navigate through different pages to find their last completion date.

Simplifying this step would not only improve the immediate user experience but also align with best practices.

Additionally, incorporating a feature to review past workout details would be beneficial for users looking to track their progress. Enhancing these aspects of the app is key to elevating its overall usability.

Starting a workout ideally would be seamless, yet the current menu could be more straightforward.

User have to navigate and click to much to find their workout. Also, if they don't know which one was the last - or which one is set for today - they will have to navigate through different pages to find their last completion date.

Simplifying this step would not only improve the immediate user experience but also align with best practices.

Additionally, incorporating a feature to review past workout details would be beneficial for users looking to track their progress. Enhancing these aspects of the app is key to elevating its overall usability.

On the image: user needs to go through different menus to find and start their workout.

User Flow Suggestions

The suggestions listed here are implemented as a concept in the prototype linked above.

When users open the app, they’re usually looking to log a new workout, so I’ve made this process as straightforward as possible: a quick review of past workouts or starting a new one with minimal effort. My aim is to reduce the number of taps and screens involved, making the workout selection and initiation almost effortless.

With this simplified flow in mind, let’s explore the core redesign suggestions.

The suggestions listed here are implemented as a concept in the prototype linked above.

When users open the app, they’re usually looking to log a new workout, so I’ve made this process as straightforward as possible: a quick review of past workouts or starting a new one with minimal effort. My aim is to reduce the number of taps and screens involved, making the workout selection and initiation almost effortless.

With this simplified flow in mind, let’s explore the core redesign suggestions.

Calendar view / Dashboard
Calendar view / Dashboard

A pivotal enhancement would be revamping the home screen into a calendar view. This would offer users a snapshot of their workout history, aiding in planning future sessions. To add further value, a dashboard could be integrated above the calendar, presenting key metrics and relevant information at a glance, providing a comprehensive view of users’ fitness journeys.

A pivotal enhancement would be revamping the home screen into a calendar view. This would offer users a snapshot of their workout history, aiding in planning future sessions. To add further value, a dashboard could be integrated above the calendar, presenting key metrics and relevant information at a glance, providing a comprehensive view of users’ fitness journeys.

Navigation bar and action button
Navigation bar and action button

Enhancing the navigation bar could significantly boost user experience. The updated layout would neatly categorize the app’s features: a calendar view on the home tab, a section for workout specifics, a hub for communication with the coach, and a personal area for profiles and documents. To further streamline navigation, an intuitive action button would be introduced, smartly altering its function and icon to reflect the user’s current needs, whether it’s reviewing the latest workout or starting a new one.

The proposed action button is a dynamic feature designed to simplify the user’s experience. Here’s a breakdown of how it works:

  • In its default state, the button displays a ‘+’ icon, which, when tapped, brings up a list of the most recent workouts for quick reference and access.

  • When the user navigates to a specific workout page, this icon transforms into a ‘start’ button, signifying that the user can begin logging their workout details.

  • As the user starts their workout, the icon evolves into a ‘stop’ sign, suggesting it’s time to complete and save the workout session.

  • If the user happens to exit the workout screen, the button’s icon shifts to signal that there is an active workout in progress. A single tap on this icon will then swiftly return the user to their current workout page, ensuring they can easily resume their activity without any hassle or interruption.

Enhancing the navigation bar could significantly boost user experience. The updated layout would neatly categorize the app’s features: a calendar view on the home tab, a section for workout specifics, a hub for communication with the coach, and a personal area for profiles and documents. To further streamline navigation, an intuitive action button would be introduced, smartly altering its function and icon to reflect the user’s current needs, whether it’s reviewing the latest workout or starting a new one.

The proposed action button is a dynamic feature designed to simplify the user’s experience. Here’s a breakdown of how it works:

  • In its default state, the button displays a ‘+’ icon, which, when tapped, brings up a list of the most recent workouts for quick reference and access.

  • When the user navigates to a specific workout page, this icon transforms into a ‘start’ button, signifying that the user can begin logging their workout details.

  • As the user starts their workout, the icon evolves into a ‘stop’ sign, suggesting it’s time to complete and save the workout session.

  • If the user happens to exit the workout screen, the button’s icon shifts to signal that there is an active workout in progress. A single tap on this icon will then swiftly return the user to their current workout page, ensuring they can easily resume their activity without any hassle or interruption.

New logging options
New logging options

The updated workout logging is flexible, accommodating both quick selections with preset inputs and detailed entries for sets, repetitions, and weights.

Additionally, users can now add comments to each exercise, allowing for notes and personal insights that enrich the tracking experience.

The updated workout logging is flexible, accommodating both quick selections with preset inputs and detailed entries for sets, repetitions, and weights.

Additionally, users can now add comments to each exercise, allowing for notes and personal insights that enrich the tracking experience.

Conclusion

The MFIT redesign was a great start to our bootcamp, where I learned about heuristic evaluation thanks to the Nielsen Norman Group's methods.

It was also my first time experimenting with Figma, which was both interesting and useful (we love Figma!).

Going forward, I plan to refine the MFIT prototype further, using the feedback I received (and what I have already learned on Figma) to make it even better.

The MFIT redesign was a great start to our bootcamp, where I learned about heuristic evaluation thanks to the Nielsen Norman Group's methods.

It was also my first time experimenting with Figma, which was both interesting and useful (we love Figma!).

Going forward, I plan to refine the MFIT prototype further, using the feedback I received (and what I have already learned on Figma) to make it even better.

Designed and developed by me