Empowering Taekwon-Do practitioners to customize, simplify and track their training
Taekwon-Do Trainer App Mock-up
OVERVIEW: Taekwon-Do Trainer is a mobile app that offers a one-stop-shop experience for ITF Taekwon-Do practitioners looking to level-up their Taekwon-do training. They are able to customize their workouts, search for relevant and useful Taekwon-Do and sport specific fitness drills and workouts, plan and track their workouts as well as challenge themselves or friends to stay motivated and have fun.
ROLE: Research, Problem Solving, Ideation, Competitive Analysis, Personas, Information Architecture, Wireframing and Prototyping, Usability Testing and Visual Branding
SCOPE: 4 Weeks - October 2021
TOOLS: Figma, Adobe Photoshop, Maze, Zoom
PROBLEM STATEMENT
Need for a high-quality training tool to guide and motivate practitioners
Many martial artists train at home with a goal to progress and improve, however, some practitioners have been forced to train at home due to pandemic restrictions. They lack efficient resources and often experience boredom or burn-out from not having proper guidance and direction.
WHY AM I INTERESTED?
I am interested in this project as I am a 5th degree black belt in ITF Taekwon-Do and an international competitor and champion who often trains on my own and I have personally experienced these issues.
Kimberly Flying Side Kick
Kimberly Holland Cup Champion 2018
SOLUTION
Design a functional and intuitive mobile app for ITF Taekwon-Do practitioners
Customizable training for each practitioner
Searchable Taekwon-Do and sport specific fitness drills and workouts
Ability to log/track workouts
Features to make training fun and more motivating
PROCESS
To design the Taekwon-Do Trainer app, I followed a lean UX Design Thinking process to ensure that my decisions were supported through user research and feedback.
Lean UX Design Thinking Process
Design Thinking Process
RESEARCH
Quantitative Research
Screener survey via Google Forms
44 participants
Personal Network via Facebook, Instagram and email
I kicked off the project with both quantitative and qualitative research methods. Since I am also a martial artist with over 19 years of experience, I used my personal network to source participants. I conducted an online survey along with in-depth interviews. The survey allowed me to better understand the target audience. I chose 6 individuals from the qualified survey participants to discover user goals and pain points.
My goal was to listen to Taekwon-Do practitioners and their home training experiences. I learned about the types of problems they encountered and what they wanted to improve about the experience.
Key Takeaways
Taekwon-Do practitioners are active training on their own
Qualitative Research
6 participants
Follow-up, In-depth survey and interview questions
Email and Chat
Participants pooled from the initial survey
Some of the questions asked:
What goals do you have when training on your own?
How do you stay inspired to train?
If there was an ideal training app for your students or competitors, what features would you like to see?
Interview Insights and Key Findings:
Practitioners lacked access to efficient resources when training at home
Students are experiencing Zoom fatigue during remote training results in students feeling unmotivated to train
Practitioners want to be able to create a training plan with milestones
Users want to see and set goals for training
Requested Features:
Scheduler
Customized training plan
Ability to search for Taekwon-Do and fitness drills
Awards system for students
Instructor/coach and student sharing platform
Next steps included determining how to create a martial arts and fitness training mobile app that is visually engaging while taking into consideration all of the pain points, needs and wants of the user.
COMPETITIVE ANALYSIS
Other popular Taekwon-Do training apps lack customized planning tools
Competitive Analysis
Summary and Findings
Both apps have high quality Taekwon-Do curriculum and content, however, they don’t allow the user to customize their training, nor do they offer a calendar or training log to help practitioners track their training or make a workout plan.
TKDCoaching is a more complete app for training, but it offers limited content with strength and conditioning or other sport-specific drills that would help ITF Taekwon-Do practitioners.
Mobile App Inspiration - Dark mode, calendar feature and clean video UI
I also decided to study a few other mobile apps to observe their successes and remix features that I liked to incorporate them into the Taekwon-Do Trainer App. For all three apps I studied, I liked the convenient use of the tab bar for navigation.
Fitbod Fitness App
Fitbod Fitness App - I really liked the onboarding process on this app. I also liked the dark (black) background and simple color palette.
1stPhorm Fitness App - I liked the calendar feature and the ability to track/log workouts and display various stats.
Netflix - As I wanted the Taekwon-Do Trainer App to be a video-based app, I looked to the popular Netflix app and really liked the scrollable thumbnail images of the movies/shows. Also, I liked the layout of the video details screen, which displayed a video player as well as a description.
STRATEGY
USER PERSONAS
Discovery of 2 primary user personas - Competitor/Student and Instructor
As a competitor and student, I want to be able to customize and track my Taekwon-Do training and be able to have access to Taekwon-Do and functional fitness drills that are sport specific to help me improve my techniques and increase my skills for competition or testing.
As an instructor, I want to be able to find drills for my own training at home as well as to be able to motivate my students to train more on their own.
Student/Competitor User Persona
Instructor User Persona
JOURNEY MAP
Following the Competitor’s Journey to understand his goals and empathize with his pain points.
To get into the mind of Ben, the competitor, I created a customer journey map to allow me to maintain a customer-centric mindset. This process allowed me to empathize with Ben as I was able to better visualize and understand his emotions as he goes through the process of searching for the ideal Taekwon-Do training app.
This is an important step to the UX Design process as I am able to identify the areas that need attention and better understand the customer’s needs in order to improve both the customer’s decision-making process and experience.
Customer Journey Map
INFORMATION ARCHITECTURE
USER STORIES
Identifying the Key User Stories to focus the app design on
As a user I want to be able to:
Create a new account
Customize my training
Find quality martial arts and fitness drills and be able to train more effectively at home with more guidance and resources
Track my workouts and make a plan for my training
Motivate myself to train more at home and have fun with training
USER FLOWS
Understanding user behaviors navigating through the mobile app with possible interactions and paths
“I want to create a new account.”
“I want to customize my training.” - Onboarding process
“I want to search for Taekwon-Do or Fitness drills and workouts that will help me improve my techniques.”
“I want to be able to track my workouts and make a plan for my training.” - Calendar and workout log
“I want to be able to motivate myself to train more at home and have fun with training.” - Challenges section
SITE MAP
Understanding the structure and visualizing the hierarchy of the mobile app
The site map is an important step as it allows me to better understand the scope of the app, view the hierarchy of the pages and have a big picture to help me improve the navigation of the app.
Site Map - Version 1
WIREFRAMES
Wireframing process
Crazy 8s Sketches - divergent thinking for homepage ideation
Sketching wireframes for all screens based on the user flows and site map
Digitizing the wireframes and creating low-fidelity wireframes on Figma
DIGITAL WIREFRAMES
Creating Low-Fidelity Wireframes on Figma to show more detail of the screens
Digital Wireframes - Taekwon-Do Trainer App Part 1
Digital Wireframes - Taekwon-Do Trainer App Part 2
BRANDING AND VISUAL DESIGN
Creating Branding assets to evoke feelings of happiness, confidence, energy, wisdom and understanding for the user
LOGO, TYPOGRAPHY, COLOR PALETTE
Sketching is a great ideation tool and this process again allowed me to exercise divergent thinking in developing the Taekwon-Do Trainer app logo. I initially focused on sketching numerous ideas and then expanded on a double T design. I liked the simplicity of the design and was very happy with the final design.
Taekwon-Do Trainer Logo
Typography and Color Palette
Taekwon-Do Trainer Style Tile
ICONOGRAPHY
Creating custom icons for the Taekwon-Do Trainer app was an important part of the visual design process and improve the aesthetics of the design itself.
Taekwon-Do Trainer App Iconography
HIGH FIDELITY MOCKUPS
Taekwon-Do Trainer App Mockups 1
Taekwon-Do Trainer App Mockups 2
USABILITY TESTING
Conducting Usability Testing to keep user feedback at the forefront of the project
TEST OBJECTIVES:
EASE OF NAVIGATION - observing how users move through the app while following task prompts
INTUITIVE FEATURES - to determine whether the features are intuitive to use and interact with
USEFUL AND PRACTICAL - to understand if participants find the Taekwon-Do Trainer App and its content useful and if they can see themselves using it on a daily basis
Round 1 of usability testing was conducted via Zoom with three participants. I spent 45 minutes to 1 hour with each participant having them test the prototype and provide feedback.
2 female black belt instructors/competitors (4th degree and 5th degree black belts)
1 male student/competitor (1st degree black belt)
100% task success rate from all 3 participants on all 6 tasks
KEY FINDINGS:
Title of the Explore page was confusing as there are two different drills search pages (one for Taekwon-Do drills and one for fitness)
The participants found the calendar a bit confusing with the different colors for dates and didn’t know what they meant - accessibility was an issue
Iterations on the mobile app after Round 1 testing
Prototype Iteration after Usability Testing #1
Conducting Usability Testing Round 2 to test updated features and recommended changes
Round 2 - Maze platform - unmoderated testing
14 Participants
57% Completion Rate of all tasks (8 of 14 users completed all tasks)
KEY FINDINGS:
6 users abandoned the testing (gave up) during the Onboarding process as they found the Maze platform confusing
Mark as Complete button stood out more than the Add to Calendar button
Calendar page was overwhelming with too much information
Final Updates to Taekwon-Do Trainer App after Round 2 Usability Testing
Usability Testing #3 after the final iterations to ensure that design was functional and intuitive
Maze - unmoderated testing with 4 participants
100% task success rate from all 4 participants on the following tasks:
Create a new account
Complete the Onboarding process
Find and select a Taekwon-Do drill and add it to the calendar
Find and select a fitness drill and add it to the calendar
View the calendar and training schedule
Find a fitness challenge and add it to favorites
View the profile
FINAL TAKEAWAYS:
Basic flow and experience of the app for the user was straight forward and made sense.
Onboarding process was confusing to some users during an unmoderated testing via Maze.
Some users found multiple options to choose from as overwhelming while some users really appreciated that they could choose the options and customize their training experience through the onboarding process.
Based on the feedback and recommendations, I made two major iterations to the design.
CONCLUSION
FINAL DESIGN - HIGH-FIDELITY MOCKUPS
Taekwon-Do Trainer App Final Prototype
IMPACT
The feedback received with the usability study and my high-fidelity prototype has been positive. This shows that the design of the app is usable and meets user needs for ITF Taekwon-Do practitioners.
WHAT I LEARNED
I learned that extensive user research and testing played a crucial role in the UX Design process. I also learned that for unmoderated usability testings, it’s important to provide clearer instructions and expectations to help users complete tasks.
I also learned that for future usability testings
NEXT STEPS
There are numerous features that can make this design and app the best on the market and highly usable and useful for Taekwon-Do practitioners. To further develop the Taekwon-Do Trainer App, I would:
Design a Chat feature that allows users to communicate with other practitioners including an instructor or coach to seek more customized guidance.
Design a Video upload section to share progress videos with instructors and coaches to get direct feedback.
FINAL THOUGHTS
I created a highly intuitive and visually appealing martial arts and fitness training app that would meet the expectations of Taekwon-Do practitioners looking for guidance, motivation and assistance to train on their own.
What excites me about this project is that it fills a gap for martial arts instructors, students and competitors and would offer a complete solution to helping them plan, track, learn, improve and stay motivated to train at home during times they don’t have an instructor to guide them in person.
Thanks for reading!
I look forward to creating wonderful experiences with you.