Duration / 2 Weeks
Role / User Research, Visual / Interface Design
OC Music and Dance is a nonprofit performing arts school which wanted a modern website redesign to attract new clientele. During a two week project my team developed a proposed redesign.
Easy Registration / Users can easily create a new account and add classes for one or more students.
Intuitive Navigation / Users can navigate intuitively which will leads to more online registrations and less manual in person registrations.
Modern user interface / The website would be responsive to scale appropriately for desktop and mobile users.
User Persona / Based on the company goal to expand into new demographics the persona was a Caucasian female who is a mother of several children interested in music classes.
Meet Britney / She is a mother who wants her two kids to have a well rounded appreciation of the arts. She wants to find a performing arts school to send both her son and daughter to guitar lessons designed for their age ranges.
Challenges / The current process flow was confusing and inconsistent. The user would not have a clear idea on how to navigate the site. There were also a number of broken links to the pages and users were shown error messages.
Redesign / I redesigned the process flow so users can easily navigate the website, choose several classes, register, and checkout within a single visit.
Moodboard / The team used Invision to craft a Moodboard. We analyzed modern dance websites and were impressed by their simple designs aesthetics. Rose, Gold, and Black were used prominently in the redesign. The colors represented grace, glamour, and elegance in dance. The use of card modals to showcase the professors was also leveraged.
Style Guide / We also leveraged colors from OC Music & Dance logo. Their purple and orange colors were used in the main buttons. Several font pairings were tested before Acumin Variable Concept and Proxima Nova choosen.
Draft Wireframes / Adobe Illustrator was used to do both Wireframes and the high fidelity Prototype. We developed several Wireframe designs before the final one was chosen. The design concepts included splitting the top section into four rectangles.
Final Wireframe / a carousel was used to scroll through the main items on the front page. Large icons are used to represent classes which can be selected.
Upon entering the site users are presented with a carousel to quickly learn about different class offerings. The JOIN NOW is a clear call to action for users to learn more about the school.
A diverse selection of classes was offered so I grouped them into six distinct categories. High resolution images were leveraged to visually represent each category in a grid. This simplified the class selection process compared to the existing design. The current design required users to navigate several text drop down menus and a lot of the links were broken.
Since professors are key to a quality education they are included in the front page. With card modals the users can quickly read up on the qualifications of the professors. Users can choose Read More to see details on their teaching styles and personalities.
User select Class Schedule to see what is available at a glance. This improves on the existing design in which users must navigate through several menus only to find there are no classes which fit their schedule.
Users can see available classes and enroll in several at once. A window opens up and the background fades away so user attention is focused on the classes.
The integration with Facebook allows users to quickly register with their existing accounts instead of needing to make a new one. They can also e-mail register.
The checkout pages have progress bars to show users their overall progress. The summary clearly outlines line item cost along with the total.
Given more time the prototype would have coded into a actual website. The Read More sections under the professors would also open a new floating window for users to view additional details. The other class categories would also be developed just like the flow for the Music category.