Redesign for a Fitness App
My Role : UI/UX Designer
Duration : 8 weeks
Keywords : User Experience Design, User Flow, Navigation, Low-High Fidelity Prototyping, Healthcare App, Sports & Wearables Technology
Netrin’s Repose is a wearable fitness product that quantifies your body's stress, sleep, etc. for better health and performance. The Repose app gives varied metrics about your stress, recovery, activity, and sleep levels using a chest wearable that analyses the heartbeat. The current user base mostly includes sports persons like players, coaches, managers, etc. who require this app to enhance their performance and consistency.
My role was to redesign the app under a new product name, "Conqur", with improved interactions and a seamless session experience
using user feedback from the first round of field testing.
My goals for the redesign:
Deliver a personalized experience and intuitive user interface for the mobile app.
Propose a more efficient session experience, ensuring that users take a session and understand its results with ease.
Improve data visualization and reports for easier understanding of complex health metrics.
For me to get an understanding of the product and its overall usage, I used the existing app and the wearable for a couple of days. This helped me generate a basic user journey for the product, from wearing the device to generating a report.
Wear the chest wearable and connect it to the mobile app using Bluetooth.
Start the session on the app. When the session is running, sync data from the device every 3-4 hours to the app and log all the activities that you are doing during the session.
After a while (ranging from 3 - 24 hours depending on your requirement), stop the session and generate the health report to view your results.
Some of the pain points that I observed in my app experience
Understanding User Feedback from the Field:
While using the app gave me a basic understanding of the session experience, I realized that the intended end users, comprising of sports persons and coaches, may have had a different experience. To get an understanding of their perspective, I got in touch with Netrin's team who had received real-time feedback from the field, from when the app had been used in sports events and training programs by athletes and coaches.
This helped me generate user personas for my reference and consolidate their feedback into pain points and solutions that I would need to incorporate into the new app.
Positive feedback from users:
Live ECG displayed on the Home Screen attracted a lot of awe and attention.
Users liked that they were receiving not just relative inputs but exact, quantified, and personalized numbers about their health. This seemed to encourage more trust in the science and service.
User Pain Points:
The app, having had a dark mode with a Neomorphic design, was not always suitable especially when used outdoors ( during training, etc).
Lack of clarity and ease of use in the interaction experience of the session journey.
For actions to be done during the session ( like logging in activities, syncing data, etc. ) the ‘what’ and ‘how’ behind these tasks turned out to be confusing.
Logging in your activities, which is an important requirement to generate accurate results, turned out to be a dauntingly long and complex task.
While the reports generated provided a lot of numerical data and pie charts, users were confused about how to make sense of so much data and process them into actionable advice.
I also did some secondary research by observing other wearable-based fitness applications like Firstbeat, Suunto, Humon, etc. This gave me an idea of existing conventions and trends in the user experience for such healthcare and fitness apps.
Other wearable based fitness apps in the market
After consolidating the research, observations, and user feedback, I created a rough chart of the information architecture and got started with a low fidelity wireframe. It was an interesting challenge to explore various visual layouts that could best display vast quantities of data without overwhelming the user. I then designed the high-fidelity prototype in a Neomorphic theme, with integrated dark and light modes.
Some of the Low Fidelity Wireframes created
UI Style Guide
The app is available in both dark and light mode for ease of use.