Introduction
NNOXX, a health and fitness startup, developed the first wearable fitness device to measure nitric oxide and muscle oxygenation levels in the body, helping users boost fitness performance, train smarter and reach their fitness goals more efficiently.
As part of their ongoing efforts to broaden their user base, NNOXX wanted to enhance the existing workout experience by developing an intuitive, user-friendly companion app to compliment their new wearable device.
I co-led UX efforts by conducting a competitive analysis, defining user journeys based on client requirements, testing prototypes, iterating on design solutions, and ensuring a seamless handoff to developers. Throughout the process, we focused on developing an MVP and aligning our efforts with NNOXX's broader business goals, taking into consideration scalability to ensure the app could accommodate future features, evolving user needs, and a growing user base.
My Role
Product Designer
Timeline
Sept 2023 - Dec 2023
Platform
Mobile App
Team
UX Designers x 2
Managing Director x 1
Co-Founders x 2
Engineer x 1
THE PROBLEM
Users face delayed access to key insights making it difficult to adjust workouts in real time.
Users faced a critical gap in their workout experience: the wearable device lacked a screen and performance data and insights were only accessible on desktop post-workouts. This delayed access to information made it difficult for users to make informed adjustments to their workouts, leading to slowed progress and missed opportunities for optimization. To address this, NNOXX set out to expand the functionality of their product ecosystem by designing an MVP companion app to compliment their new wearable device.
How It Works
1
2
Impact
The app was successfully launched at the end of 2024 and marked a significant step in delivering a more seamless and intuitive user experience that motivates users to stay engaged in their health and fitness journey.
DESIGN PROCESS
Our target users range from fitness enthusiasts to professional athletic trainers
Our stakeholders identified three primary user groups: seniors, working professionals and physical trainers. We decided to prioritize seniors and working professionals, as they presented a larger market opportunity but higher likelihood of disengagement due to a lack of time, motivation, or understanding of the technology.
A key design challenge was introducing users to nitric oxide as a new standard of fitness measurement. With varying levels of fitness expertise across the user groups, it was essential to create an experience that was both inclusive and accessible, balancing simplicity for beginners with depth for experts.
Building empathy and understanding through journey mapping
Taking insights from research, we collaborated with the stakeholders to design a comprehensive user journey illustrating how users would interact with the new app experience. We mapped out key touchpoints to ensure seamless interactions between the app and wearable device.
Refining flows, interactions and functionalities
Informed by collaborative sessions with the NNOXX team and close collaboration with my internal team, we crafted a series of comprehensive user flows mid-fidelity wireframes to visualize and refine user flows, interactions and functionalities. Our approach focused on rapid iteration, collecting feedback from stakeholders and refining designs before testing with our users.
The designs focused on balancing innovation with familiarity.
Understanding that the app centered around a complex and innovative concept, it was crucial to create a simple design that focused on clear language and intuitive navigation to reduce user friction. The goal was to minimize users cognitive load to maximize usability through the following strategies:
Avoid Over-Engineering: Focus on solving the core problem effectively first. Don't over-engineer solutions that add unnecessary complexity.
Use Familiar Patterns: Stick to common design patterns and interactions where possible to lower the learning curve and reduce user frustration. This would also allow us to spend more time refining the complex flows.
Use Progressive Disclosure: Make essential information prominent, and hide advanced or less critical features behind additional steps. This keeps the initial experience simple while offering depth for those who need it.
Usability testing of the early prototype resulted in key changes
To validate our designs and prototypes, we conducted usability testing with 9 of our target users. The goal of these testing sessions were to:
Identify issues early on to reduce risk of costly design revisions
Validate any assumptions we made
Collect feedback on usability and overall user satisfaction
Users were excited about this new concept to help improve their overall health but we discovered opportunities in the experience where additional support or guidance was needed.
Incorporating visual aids to support users through complex workflows
Users found the instructions unclear and ambiguous, leading to frustrating guesswork. To address this, we introduced visual aids — originally planned for future iterations — to minimize drop off rates and boost user confidence.
BEFORE
AFTER
Introducing "Exertion Score" to help understand workout effectiveness
Phrases like "Speed it up" and "Slow it down" were vague. Because auditory instructions were not feasible within our project timeline, we adopted target zones to help users better understand the concept of exertion. The arrow symbols alone did not intuitively communicate to users what the app was trying to signal.
BEFORE
AFTER
FINAL DESIGNS
Supporting our users learning curve
Users were excited by this new concept for measuring nitric oxide in an effort to improve their overall health, but the existing workflows required clearer instructions. While a learning curve was expected, we prioritized providing the proper guidance needed to help users complete their tasks successfully.
Active Workout Session
Monitors nitric oxide (NO) levels in real-time to guide users pacing
Health Check
Measures baseline nitric oxide (NO) levels taken before the workout
REFLECTION + KEY TAKEAWAYS
Open communication speeds up the design process
Early and ongoing collaboration with cross-functional teams is crucial to align on feasibility and implementation. Given project timelines and budget constraints, we couldn't afford delays or additional iterations. Regular check-ins helped keep everyone on the same page. This was most important in the early wireframing stages where we were designing user flows that needed to integrate with the wearable device, leaning on our stakeholders for their expertise.
Next Steps
Design Handoff: Our design team also closely collaborated with their developer to ensure a seamless handoff of the designs, including a small founding design system based on our designs and detailed descriptions of interactions for each screen.
Continue to monitor and analyze metrics: The release of the NNOXX app is an MVP so the NNOXX team prioritized a quicker release to start collecting data and feedback on their own. Our design team hopes to collaborate with the NNOXX team in the future once again.