Topfit

As active gym-goers, we have a personal connection to fitness and a healthy lifestyle. With the redesign of the Topfit app, we have developed an application that is not only functional, but also creates a connection to the individual needs between people and the gym.

ROLE:    CONCEPT, RESEARCH, VISUAL DESIGN, UI/UX DESIGN

COLLABORATOR:    MYKHAILO SAMOTOS

LOCATION & YEAR:   SCHWÄBISCH GMÜND, 2024

Overview

TopFit is a fitness chain in Baden-Württemberg dedicated to helping people achieve top physical condition. However, the previous version of its app encountered several challenges.  Outdated navigation and a confusing layout led to misunderstandings about the application's 

functions. Additionally, there was a lack of feedback mechanisms and integration with the TopFit community. Conducting a SWOT analysis revealed that, while the app was effective for managing contracts, its repetitive elements and lack of structure resulted in accessibility issues.

Research

Through a combination of quantitative and qualitative interviews, we gained valuable insights into user preferences. It became clear that users highly value tracking features but are reluctant to invest in premium versions. In face-to-face surveys, many potential users are either unaware of the TopFit app or do not recognize its benefits. 

However, gym enthusiasts expressed interest in features such as utilization monitoring and equipment availability. In addition, some users prefer virtual training support that allows them to track their fitness goals independently of direct interaction with a trainer.

User Profiles

We identified and defined four different personas and focused primarily on the needs of three individuals who face challenges in terms of training plans, motivation and training variations. Based on our analysis, we framed the following key questions that served as guiding principles in the development of solutions:

• How can we help Julia create a customized workout plan that accommodates her schedule and fitness goals?
• How do we motivate Sergey and show him progress?
• How do we protect Elizabeth from injury?

Information architecture

Our app aims to overcome barriers in terms of motivation, progress tracking and knowledge sharing. With a clear information architecture that includes workouts, activities, challenges and profiles, we provide seamless navigation and systematic content organization for an smooth user experience.

Wireframes & Paper prototypes

Our next step was to create design variants and find solutions to all the problems we identified during the interviews. Various design ideas were discussed, evaluated and gradually improved, from paper designs to high-quality wireframes and prototypes. Our focus was to further improve the user experience by establishing a clear visual hierarchy that easily guides users through the process. The new designs were tested and revised multiple times until we were confident in our product vision.

Result

By using NFC, users can efficiently connect their smartphones to the fitness devices, resulting in seamless integration. The devices can then automatically transmit data to the app in real time. In addition, the training data, including repetitions, weight and training duration, is recorded accurately and precisely.

For people who are new to fitness or don't know how to exercise properly, the Topfit app provides expert guidance and instruction through workout plans. Users also have access to videos which can be watched during training to make sure the excercise is performed correctly.

Staying motivated to train can be a challenge, especially when it comes to individual training. With personalized training plans, progress tracking and challenges, we want to change that.

In addition, we have integrated a reward system where users can collect points for each challenge and workout. When a certain score is reached, the user is awarded a reward. This keeps motivation high and makes training a rewarding experience.