The goal of this project is to design an AI-powered dashboard for the Swimming Technique Improvement App. The dashboard effectively visualizes data collected from sensors, providing users with a clear and easy-to-understand view of their progress. Proper terms and visualizations are used to ensure effective communication of the information.
UX Researcher,
UIUX Designer
Beginning swimmers who want to improve their technique.
Age: 25-55
To better understand target audience's swimming experiences and needs, I interviewed four target audiences to gain insight:
3/4 "A fun way to stay healthy and relax."
1/4 "A preparation for skin-diving for holiday travel in future."
2/4 "Breathing technique is my main focus."
1/4 "I want to be able to swim longer without taking breaks."
1/4 "I want to learn butterfly swimming."
2/4 "It is hard to find out what's wrong with my movements and the coordination of them, and how to correct it."
1/4 "Breathing when swimming is hard, I don't have enough time to breath before sinking into water."
1/4 "I don't understand what causes me to run out of breath."
1/4 "Yes, a smart sports watch and its app. However, there is too much data about speed and pace. I find metrics like Average Stroke Rate and Average Stroke Count per Length to be too technical and meaningless; and SWOLF is always confusing. I never read it."
3/4 "No."
"No, it just tracks my progress. Some apps appear more professional and offer training plans, but I am not that focused on improving my speed. I care swimming duration more."
"I watched YouTube videos and then practice in the pool."
"I have tried to get guidance from a friend who is good at swimming, but it was not very effective."
To understand the existing solutions in the market and identify opportunities for improvement or differentiation.
Takeaways:
- Overwhelming dashboards with technical terms that may be difficult to understand, such as SWOLF (a measure of swimming efficiency calculated by adding the time to the stroke count, for a given swim distance, for example: 40 seconds + 30 strokes = 70 SWOLF score)
- Lack of clear visual aids in presenting data
- Relying on data collected from smartwatches, limiting accuracy in tracking and analyzing swimming technique
My design aims to address these limitations by:
- Utilizes data collected from sensors specifically designed for swimming, which gather metrics such as stroke distance, stroke time, kick distance, kick time, swimming time, pause time, and more. This data serves as the foundation for the AI to provide comprehensive and accurate analysis.
- Presents the information in a clear and easily comprehensible manner through unique terms and effective visualizations.
To ensure consistency and inform design decisions in the project, I created a word list.
In this project, a data list was created to clearly define and track the metrics that would be used in the dashboard to measure the progress of users in App. This data list helped to ensure that the dashboard effectively visualized relevant information, allowing users to easily understand their progress
This project focuses on selecting and categorizing crucial metrics for analysis and user presentation in a swimming improvement app that features AI-powered training and movement correction. The metrics are broadly grouped into General Performance Metrics and Specific Movement Metrics.
.jpg)
Data Collection Definition: Metrics for data collection are bifurcated into General Performance Metrics and Specific Movement Metrics.
- General Performance Metrics: Aid the AI in tailoring personalized training plans.
- Specific Movement Metrics: Form the basis for the AI to analyze and suggest improvements in technique, specifically targeting individual movement corrections.
User Data Visualization: For presenting data to users, a subset of General Performance Metrics is chosen. The metrics selected for user display are those that are straightforward and easy to understand, aiding users, especially beginners or intermediate swimmers, in visualizing their progress and performance effectively. This selection enhances user engagement and offers a tangible way to track their improvement.
Starting with the question "How can we show users our evaluation of their movement correctness?", I sought insights from a former swimming athlete. Through this interaction, I learned that 'Movement Efficiency', which includes 'Movement Completeness' metric and 'Movement Coordination' metric. These metrics offers a user-friendly way to convey the AI's assessment of the user's technique. They allows users to track their progress and strive for improvement without having to interpret specific, complex data.
.jpg)
To ensure a clear and intuitive interface that enhances user experience and aids in effective communication of the swimming metrics, the Information Architecture is meticulously organized and structured, aligning with user needs and goals.
To organizes data in an understandable and intuitive manner for users, and to ensures that the visual design and layout of the dashboard align with the underlying organization of data. I consolidated the metrics into three categories:
.jpg)
To offer historical context and motivate continuous improvement, I expand the original metrics to trend metrics and group them based on their effects between each other, which allows users to track their progress over time and see the correlation.
Given that offering a holistic view of the user's overall performance regardless of swimming type, I use "Average Performance" to summate all the different types of swimming activities the user engaged in for the day/week/...
.jpg)
A former swimming athlete emphasized the importance of Stamina for consistent swimming duration and Movement Efficiency, based on the completeness and coordination of movement, for avoiding energy waste, especially for beginners. These insights helped refine the data list, ensuring highly relevant metrics for users looking to improve their swimming technique.
.jpg)
I consolidated the eight key data points into four categories: Pace Ranking & Goal, Average Performance, Stamina, and Movement Efficiency. The inclusion of Ranking & Goal is designed to enhance motivation and enjoyment for users. The other categories were chosen because they are particularly relevant to beginners and remain easy to understand. This reorganization aims to make the dashboard more accessible and helpful for all users.
.jpg)
Solid color for core metrics: Time and Distance are depicted in a solid color, representing the foundational, foundational, and directly measurable aspects of the swimmer's performance.
Gradient Colors for Complex Metrics: Pace, Coordination, and Movement Completeness are visualized with gradient color, signifying the intricate, multi-dimensional, and interdependent nature of these metrics.
This distinction helps convey the simplicity and directness of Time and Distance while also highlighting the more complex nature of Pace and Movement Completeness. It can create a visually engaging and informative experience for the user.
The design decisions were guided by an empathetic understanding of user needs, a precise analysis of the data's nature, and a creative approach to conveying complex relationships in an accessible way:
Understanding User Needs and Goals: Recognized that beginner swimmers are focused on endurance, pace, and calorie goals, and also concerned with movement efficiency.
Considering Data Nature: For continuous data like endurance and pace, chose line charts to reflect their ongoing trends. For discrete metrics like movement completeness/coordination, opted for bar charts to represent their discrete values. Given the flexibility of bar charts to visually represent paused time, multiple design options were created for A/B testing.
Highlighting relationship and Effects: Combined different chart types when necessary to emphasize how one metric affects another (e.g., how efficiency affects endurance).
In alignment with Information Architecture 1 and the Option 2 Endurance Trend visualization, the single-screen option emphasizes a unified and concise presentation. This approach allows for a quick and comprehensive view of core metrics, reflecting the principle of efficiency. By consolidating essential information into one screen, users can easily grasp an immediate snapshot of their performance.
Multiscreen Option
According to Information Architecture 2 and Option 1 Endurance Trend visualization, the multiscreen option offers a more detailed and segmented data exploration. This design strategy divides information across various screens, catering to users who wish to delve into specific aspects of their metrics. By enabling a more personalized and nuanced view, the multiscreen approach aligns to offer tailored insights.
Based on the A/B Testing results, 7 target audience participants were involved.
1. Which layout and structure do users prefer?
2. Are the terms and labels used in the app easily understood by users?
3. How do users feel about comparing current performance with goals versus yesterday's performance?
4. What are users' interests and needs regarding data related to specific swimming styles?
5. How do users prefer to visualize endurance data between bar charts and line charts, especially when considering factors like paused time and overall readability?
6. Is there additional information users desire that the app currently doesn't provide?
1. Users prefer a design and navigation emphasizing simplicity and ease of use.
2. Complex charts can be overwhelming for some users, indicating a need to simplify the design where possible.
3. Users responded positively to the goal comparison feature, particularly for endurance metrics (distance and time), while showing a preference for daily progress tracking for movement coordination and completeness.
5. Most users favored line charts over bar charts for their cleaner visual representation. However, feedback highlighted that specific data points were easier to discern on bar charts due to the prominent end of bars compared to lines.
6. The addition of a Calorie metric was strongly desired by users, reflecting a focus on health and fitness goals.
Benefits: Streamlines navigation and improves content organization, offering a clearer and more more efficient user experience that separates summarized data from detailed trends.
Benefits: Simplifies user interaction by consolidating metrics into one view, eliminates repetitive dropdown actions, and provides a more fluid and efficient way to access specific style's data with just one swipe
Benefits: Provides an immediate comparative view, and enhances the understanding of individual style contributions to overall performance.
Benefits:
A: Aligns the app with user objectives, provides personalization, and helps users track progress toward their goals, fostering motivation and engagement.
B: Enhances readability, allows users to easily identify specific data points, and connects visual representation with precise values.
Benefits: Streamlines navigation and improves content organization, offering a clearer and more more efficient user experience that separates summarized data from detailed trends.
