Thesis Project: Research, design, and code a platform to help dancers efficiently find classes they like.
Project name: Pocket
Project Summary
Through user research, multiple rounds of testing, and coding, I created a prototype of a platform to efficiently find suitable classes for students.
Responsibilities
-
User Research
-
Experience Design
-
Prototype & User Testing
-
Full Stack Coding
-
Visual Design
Overview
Pocket is an efficient service aiming to connect prospective students to dance instructors by allowing them to perceive the instructor's style in the form of video instead of words.
Timeline
While this project took a full 2 years, I delved deep into each stage, going back to previous steps when needed.
Problem discovery
I conducted ethnographic research at the front desk at City Dance Studios.
The most common questions that students asked were:
-
What is (style) like?
-
Is this class hard?
-
I’m interested in (style), which one should I take?
-
I’m a beginner dancer, which class should I take?
I did both qualitative and quantitative user interviews around a set of learning goals.
General Information
-
How long have you been dancing?
-
What do you like about dance?
-
How often do you dance?
Thoughts and Experiences about dance classes
-
Why do you take dance classes?
-
What are you currently trying to learn more about in dance?
-
Tell me about your best dance class experience.
-
Tell me about your worst dance class experience.
Process of choosing a dance class
-
How do you pick a dance class?
-
How do you know if it’s suitable for you?
-
What do you not like about this process, and why?
Research Learnings
To students, schedule, location, instructor, and difficulty were the most important factors when choosing a dance class.
For students, it is hard to tell if they will like a class.
Dance studio websites with little to no detail about the class nor the instructor’s style.
Image source: City Dance Studios, Full Out Studios, and In The Groove Studios
They need to keep hopping between multiple sites to get more information about a single class.
“Having to go back and forth between the studio’s website and multiple instructors’ various social media accounts is a hassle.”
Quote from a student regarding looking for classes
Teachers find it harder to ensure their best works gets seen.
Competitive analysis
I did an in-depth competitive analysis on other ways students could use to find dance classes.
Empathy Map
Problem Statement
How might we make the search for a suitable dance class more simple, efficient, and intuitive?
Preliminary sketches
I brainstormed different concepts and ways to solve the problem, and got feedback from dancers.
After scoping down from an idealistic platform, I decided to create a platform with a Class Finder that showcased different styles through videos.
Wireframing and user testing
I created prototypes on Figma and conducted multiple rounds of testing, incorporating feedback and increasing fidelity.
Learnings and iterations
Learning: Sliding scale felt too subjective and vague
Before...
Sliding scale was vague; can’t tell where students land in
...After
Switched to radio buttons instead to show 5 distinct levels
Learning: Screens were still too text-heavy
Before...
Text-heavy bio goes against the idea of being more visual
...After
Used tabs to section out information, keeping visuals first
Visual Design
For visual design, I started off with a mood board and five keywords.
Movement
Energetic
Active
Fluid
Strong
To balance out the text heavy information, I needed to create a cohesive visual design system that was able to space text out but not feel scattered.
Technical Development
I challenged myself to learn and build the platform on React Hooks.
The platform relies heavily on the database of classes, so I learned and used Firebase to work with React.
Clickable Prototype
Stacy Student can efficiently find suitable dance classes.
Outcomes and Learnings
This project really ran me through the whole design lifecycle in depth, and I had to do it all by myself. I learned a lot about scoping and keeping plans and expectations realistic.
Key Outcomes
-
Conducted both qualitative and quantitative research
-
Iterated through multiple prototypes for user testing
-
Created a cohesive design system that is on brand
-
Learned to use React Hooks and Firebase
What I learned
-
Products need to constantly reevaluate if what they’re doing matches the community’s needs
-
Technical libraries and languages are tools, and there may be multiple tools that can do the same job