Musical-u

Competitor Analysis

Heuristic Evaluation

I conducted competitor analysis of similar websites, first through heuristic evaluation. Based on the 10 heuristics/severity ratings from the NN Group, I evaluated two websites: Lessonface, and Blue Bear School of Music to see how they were advertising and designing their services.

I chose Lessonface as a competitor application because this website displayed many features I envisioned to include.

These include:

1. Personal matching with a suitable teacher
2. Reviews
3. Individual pages for teachers with information.

However, I would like to focus only on instrument learning, and emphasize more on the idea that everyone is welcome to learn instruments. I wanted to use Lessonface as inspiration and to help me decide what to build upon.

From analyzing Lessonface & BBSM, I found that I would like to take note of two things:

1. Adding an onboarding feature
2. Accessible, simple hero section & design

Pilot Usability Testing

Following the heuristic evaluation, I wanted to learn more about the potential usability problems Lessonface might've had. I conducted usability testing using the heuristics and issues I highlighted from my heuristic evaluation and created tasks accordingly.

Following the UT, I found that my participant experienced the issues I was testing. I was also introduced a new issue with the website's responsive design, where information was omitted when the window became smaller.

Contextual Inquiry

After conducting heuristic evaluation and usability testing, I realized that I needed to know more about the behavior, background, and user experiences of my target audience.

I decided to use interview, participatory interaction of the user and observation as my primary research methods. I chose to talk to someone with a background in music and had a piano with learning resources nearby.

I had my subject perform three activities in front of me:

My findings included that having a forum (like Reddit) where people can share knowledge, a feature to digitally write on sheet music + an automatic scroll would be helpful features to include. Additionally, I found through our conversation that not all people have connections to teachers and easy access to materials.

UX Storytelling

Persona + Usage Scenario

I decided on three features I would want to focus on for my personas, Diego and Nidhi.

1. Sheet music database that is accessible, high quality, and free
2. Teacher finding/search feature with a high level filter
3. Scheduling lessons feature with a calendar and confirmation

I first designed my features, wireframes, and prototype with pencil and paper. Using information gathered from prior research, I was able to start ideating my platform. After sketching out my prototype, I asked a participant to go through the prototype and mark their journey. I also acquired others' feedback on what to change or add for my high-fidelity prototype.

I used my paper prototype as a reference to create this design. First, I used Figma and created a frame with a custom size. I then laid out my components from the paper prototype. I then created the logo for my proposed service, Musical-u. I decided to go with a cool-toned color palette (purple/blue), avoiding warm tones like red, which is an alerting color, and yellow, which is difficult to design around because of contrast reasons. After coming up with the logo and color palette and checking its contrast ratios, I was able to come up with a fairly high quality design. Then, I made variations according to options I preferred for typography, shape, and light/dark mode.

Link to Figma File with my screen design variations.

After creating my low-fidelity prototype and finalizing my interface design system, I was ready to start designing my high-fidelity prototype, where I could visualize my fleshed-out application. I utilized Figma to first create the design system, and then incorporate it with all of the tasks I have proposed by creating the remaining wireframes. Using the feedback I received from the cognitive walkthrough we did in class with two other students, as well as my impression testing and feedback from the low-fidelity prototype user testing, I was able to create my final designs.

My prototype supports these main features:

1. Signing up + Onboarding
2. Viewing and searching through a sheet music database, markup of sheet music
3. Teacher search and booking lessons through a modal pop-up
4. Searching through the Academy with courses that include pre-recorded lessons

Additionally, my prototype supports:

1. Viewing the homepage signed in/signed out
2. Signing in