Visual Training App

A Fitness App That Bridges Analytics, Motivation, and Avatar Driven Fitness Tracking

Case Studies

Visual HIIT and Gym Workouts is a popular iOS and Android app built around the idea of visually measuring fitness progress. Following the success of the original app, the team set out to develop a new platform specifically for the personal trainer market. This new iteration needed to support two distinct user groups, each with very different needs and usage contexts.

Personal trainers required analytical tools to manage multiple clients, track business performance, and adapt workout programmes using detailed data, typically working on laptops between gym sessions. In contrast, their clients needed a mobile first experience focused on effortless fitness tracking and motivation, removing friction from daily logging and workout execution.

The Challenges

Dual User Experience: We had to design for two separate but integrated experiences, firstly for the personal trainers (analytics and business tools), and secondly their clients (fitness tracking and motivation). We also had to design across different platforms, web for the personal trainers, and mobile for their clients.

Market Differentiation: It needed to stand out in a crowded marketplace, largely dominated by the My PT Hub and Trainerize apps. The real jewel in the crown was the 3D avatar technology (the platform’s USP), and our challenge was to move it from an underutilised feature to the centrepiece of the platform.

Workflow Optimisation: Personal trainers are time poor, so we designed a system that embraces the natural trainer led dynamic. After an initial onboarding phase that is largely trainer driven, a proportion of the ongoing workload shifts to clients, allowing trainers to focus on coaching rather than administration.

Feature Integration: The product was certainly feature rich, we had to seamlessly combine fitness tracking, nutrition logging, business development tools, and motivational features into a unified platform experience, ensuring both user types can move fluidly between planning, execution, and progress tracking.

Timeline: Of course, time was of the essence. There was a deadline to begin the development inline for a launch date. With that in mind we had to deliver production-ready designs and clickable prototypes (Figma), alongside a comprehensive design system and logic, all within rather tight time constraints.

Research & Strategic Discovery

Our team analysed the fitness and nutrition app landscape across three categories that our research and analysis highlighted:

Fitness Apps: Workout tracking, exercise libraries, and trainer-client interaction models, particularly My PT Hub and Trainerize Apps. We looked at what was the baseline established by the industry in terms of expectations and core mechanics in the UX and UI.

Nutrition Apps: Calorie tracking interfaces, macro-nutrient visualisation, and food logging workflows to identify industry best practices. Most fitness apps have a nutrition application built in but we wanted to identify any specialised aspects that we could leverage in this redesign.

Motivation Apps: Motivation is a key part of any fitness journey, especially the beginning. Gamification systems and engagement mechanics, examining how apps like Duolingo use point systems and un-lockables.

Process Mapping and User Journey Analysis

Using the outputs from our Jobs-To-Be-Done (JTBD) workshops, the team developed a process map, a hybrid of process flow and user journey mapping. This detailed separate but intersecting paths for personal trainers and their clients, with the app connecting them at critical points in the fitness journey. The key journey phases were:

• Education, Exploration, and Conversion: Personal trainer-focused phases which represented how they discovered and adopted the platform.
• Enrolled clients: The onboarding loop where personal trainers onboard new clients into the system using ‘sales-led onboarding’.
• Utilisation: Ongoing daily interactions between the personal trainersa and their clients, including scheduling, workout execution, performance review, and program adaptation.

A critical insight emerged: workload starts at 90% personal trainer and 10% client during onboarding, settling towards a 70%/30% split as the engagement progressed. This imbalance is intentional, serving three goals: grow the personal trainer business, minimise client effort during onboarding, and reduce cognitive load so clients more willingly upload key metrics later.

Wire-framing & Prototyping

The app dashboard was designed around a core insights learned from the user research insights, we knew that users shouldn’t have to navigate through multiple menus for routine tasks. Instead the design focused on surfacing key features and integrating them throughout the journey to reduce friction and cognitive overload.

• ‘Next workout’ reminder positioned prominently at the top
• Quick food and liquid logging (plus buttons on dashboard)
• Today’s nutrition summary, inclusive of macro-nutrients
• A weekly schedule heads-up on a regular basis

This certainly eliminated the menu-diving friction, users could log a protein bar in seconds without navigating away from the fitness main task.

Avatar as Hero Element
The most significant change brought the 3D avatar front and center on the app dashboard immediately upon login. The avatar was core to the USP of the new app, one the client input the data the avatar could provide:

• Immediate visual progress information (biceps, waist, chest, thigh measurements).
• Switching between a before/after view to encourage client motivation.
• Spawning point for deeper trend examination.
• Minimal text exposition, visual representation communicates naturally.

This was more than just a design choice. This was a key differentiation opportunity. From the client’s perspective, the avatar visualises body changes through a before/after switch, providing motivation. For personal trainers, the avatar and associated metrics allow detailed performance analysis to adapt programs effectively.

The Outcome

On time and to the required specification, we delivered a fully functional clickable prototype and design system for the in-house engineering team to start developing. The foundation, including design logic, interaction patterns, and systematic thinking, resulted in straightforward client sign-off and developer buy-in. Deliverables included native mobile app designs for iOS and Android, web application designs for personal trainers analytics and management, clickable prototypes demonstrating core functionality, and a design system with color palettes, component libraries, and interaction patterns.

Customer Experience Transformation

For Clients: Immediate visual progress through the prominent avatar display, recipe-like workout flows that eliminate decision fatigue, quick nutrition logging, gamification through the customisable avatar system, and feedback mechanisms capturing both performance and emotional state.

For Personal Trainers: Business development tools integrated with client management, three-dimensional insight into client performance, difficulty perception, and motivation levels. The optimised workflow respects the natural personal trainer-led dynamic while enabling efficient onboarding and data-driven program adaptation.

The team at Visual received a foundation designed for growth, with groundwork ensuring future features can be integrated without redesigning core patterns. By embracing the natural personal trainer-client dynamic, integrating motivation alongside metrics, and positioning the avatar as the centerpiece, we helped transform the idea into a market-ready platform.