OC Music & Dance Case Study
I am
OC Music & Dance Case Study
SUMMARY
Tina Hong & 2 group members
Project Duration: Two Weeks
My Role: User Research, Interviewing, Persona Development, Storyboarding, Wireframing, Style Guide & Digital Mockups
Media Used: Illustrator, Photoshop, Paper, & Pens
RESEARCH
- Observations: We visited the site on multiple occasions to watch the traffic of the lobby, open mic night, and the classrooms.
- Interviews: I met with the V.P. of Marketing, and also conducted interviews with parents and students of OCMD.
- Competitive Analysis: We analyzed OCMD's current website, as well as some other dance and sport organizations' websites to compare and see what the current trends were.
- Students parents who want to register them for classes.
- Students are between ages 8-18.
- Hear about OCMD through word of mouth or through Facebook
- Need an easier registration process.
- Parents want easy signup and enrollment for their kids.
- Parents want to enroll both kids for classes at the same time.
Current Users:
- The current website had many dead-ends, resulting in a high percentage of drop-offs during the class searching process.
- Most of the users were not able to reach the registration form and would show up in person to register for classes.
Current Website:
- Clear navigation.
- Modern user interface.
- Cleaner website with design consistency
- A functioning website.
OCMD Needs:
Persona
After meeting interviewing and observing parents, students, and the marketing director, we synthesized our research data and came up with a persona.
Storyboarding
We then developed a storyboard to get an idea of how the new website would help the user.
Journey Mapping
We then broke down each step of the storyboard, to understand the actions, feelings, and opportunities for each step of our new process.
Style Guide & Flow Chart
We revamped the style guide to give it a little more color while working out the flow chart of the new website..
OCMD's Original Style Guide:
Revised Style Guide
Wireframe Ideation
We made up several wireframes before deciding on one for our final.
Final Redesign
After many iterations, we proceeded to make a digital mockup.
