UX Case Study: Designing a Website for Finding and Viewing Dance Tutorials
Have you ever tried learning dance online? How successful were you? Did you find it easy to follow the tutorials and keep track of your daily progress? I went through various YouTube dance tutorials and Instagram reels but found it challenging to figure out the perfect tutorial that would cater to my needs and ended up wasting a lot of time just figuring out which tutorial to follow.
I went through various paid websites that offer dance tutorials as a service online as well as offline. I did a competitive analysis and found:
Understanding the Problem
I wanted to understand what other users think and feel regarding this problem, which led me to conduct interviews with people who want to learn dance or are learning already. Here is my:
- Screening survey template
- User interview script
To create the ultimate experience, I mapped out the journey that a user goes through as they try to achieve their goal.
The data collected from the interview was then turned into an empathy map as below:
Insights: People want
- Engaging workout sessions
- Easy- to- follow tutorials
- Flexibility to learn from anywhere
- Track progress
- Set difficulty
- Set duration
Using the aggregated empathy maps and interview findings I built the user persona as below:
Methodology
I used the design thinking methodology to understand the user and their problems and come up with ideas to solve them.
The 5 stages of the design thinking process are:
My Role
- Research
- Wireframe
- User Flow
- User Persona
- UI/UX Design
Project Timeline
- 2 weeks
Define
After understanding the pain points, I formulated the problem statement using the 5Ws and H: who, what, when, where, why, and how to solve the user’s problem
Who: A busy marketing manager
What: Ruby wants to find and view dance tutorials
Where: Ruby is likely to use the app at home and hotel stays (when she travels for work)
When: Ruby gets overwhelmed by a large number of dance videos and gets confused about which one is best for her from the beginning of the user journey.
Why: Ruby has limited free time and a lot of time is wasted in figuring out the best high/low energy workout.
How: Ruby wants to go from the home screen to the dance workout tutorial to progress.
Problem statement
Ruby is a busy marketing manager who needs an easy app to find and view dance tutorials because she gets frustrated by a large number of dance videos online and is unable to complete dance routines in a limited time.
Ideate
How Might We?
- Help users find and view dance tutorials
- Help users set the difficulty of routine
- Help users set the duration of routine
- Help users track progress
Below is the sitemap for the website, which will help me to create a logical, organized path between the various information before we start to design the product.
These are some of the paper-wireframes that were made during ideation:
Low Fidelity Prototype
Below are some snapshots from low-fidelity prototypes that I made:
High Fidelity Prototype
At this stage, I implemented all the low-fidelity prototypes into high-fidelity prototypes
Testing
In the testing phase, I gave the prototype for user testing. The feedback received from the testing was used to enhance the product and make it more user-centered. I did in-person user testing because I wanted to see users’ behavior, preferences and how they interact with the product in real life.
Design iteration 1 :
During testing it was observed that users took ~ 10 min on an average to figure out which tutorial to watch. Search bar along with sort and filter’s potential was not being used to the fullest.
Before making changes:
On closer inspection, I realized there are too many tutorials displayed for the users to select from, that it reduces the speed of task completion. I decided to minimize cognitive load by moving search bar to the center of focus and removing playlists, so that users can process the information provided faster and speed up their decision making process. Playlist will appear once user selects the genre, difficulty level and duration of the dance workout.
After making changes:
The search result provides limited content to engage users while not overwhelming users with too much information.
Design Iteration 2:
Although the dashboard provided necessary statistics, it did not have any set target which would motivate the users to achieve a goal. So I modified the dashboard in such a way, which would generate an emotional response through system of reward. I introduced streak to increase user engagement.
Before making changes:
After making changes:
Prototypes
Home
Pricing
Sign Up
Log In
Dashboard
Search
Playlist
Conclusion
From this case study, I tried learning the design thinking process in order to solve real-life design problems. There is still a lot of scope for improvement and iterations for future design development.
Thanks for reading my case study. It was done as a part of the Google UX Design Course. If you can provide constructive criticism and suggestions about my case study, I will be very grateful. You can reach out to me on Linkedin.
