Low-Fidelity Prototype
Description of Project 📖
Website Description
My goal for this project is to design a website/platform where people of all backgrounds and ages have the ability to learn how to play an instrument at any level without any cost, can view pre-recorded lessons with instrument-learning basics, can schedule live lessons with a teacher they can match with, and have unlimited access to a high quality, large database of sheet music for any instrument.
Prior User Research
Heuristic Evaluation:
- During heuristic evaluation, I analyzed two competitor websites with similar goals: Lessonface and Blue Bear School of Music. I found issues with their current design and proposed ways to better my website design by learning from the usability issues from the heuristic evaluation. Some significant issues I found in Lessonface, in particular, were that you cannot remove an instrument category when searching for music lessons which leads to confusion, the existence of an element that appears to be a button but is not a button, and the fact that important links lied under the nested menu.
Pilot Usability Testing:
- I tested the significant usability issues found from heuristic evaluation of Lessonface, my main competitior website. These included:
| Heuristic Being Tested | Usability problem | Task scenario |
|---|---|---|
| User control and freedom | Cannot remove instrument category when searching for music lessons, confusion | Finding a clarinet teacher, then changing to flute teacher |
| Consistency and standards | An element that appears to be a button but is not a button | Find the FAQs page and phone number from the top navigation |
| Recognition rather than recall | Important links under nested menu | Find the "About" page under the nested menu |
Contextual Inquiry and Interview:
-
Next, I performed contextual inquiry by using interview, participatory interaction of the user and observation as my primary research methods. I spoke with someone who is experienced with learning instruments and looking for sheet music online. Some insights were that:
- Having a forum (like Reddit) where people can share knowledge is helpful
- Would be helpful to have a feature to digitally write on sheet music, and an automatic scroll
- Not all people have connections to teachers and easy access to materials
Personas
My two personas were Diego Jacinto and Nidhi Singh.
- Diego Jacinto is a busy manager from an underserved background trying to relearn piano. Diego’s journey mainly included searching up sheet music in the database.
- Nidhi Singh is a mother of a 10-year old daughter who works as a nurse, but is worried about her daughter’s upbringing. Nidhi’s journey included searching for both piano and violin teachers with specific filter options, and scheduling different lesson times for both.
Learn more about them, their scenarios, and their journeys here.
Features
The design features I would like to include are:
- Onboarding for new users who would like to know how to use the website/platform
- Sheet music database that is accessible, high quality, and free for use
- Teacher finding/search feature with a high level filter
- Scheduling lessons feature with a calendar and confirmation screen
- Pre-recorded lessons database and search feature
Purpose of Low-Fidelity Prototyping
The purpose of low-fidelity prototyping is to lay-out the features I proposed and researched on previously. I can see how a user interacts with my design, considering how I initially think my design should be. With low-fi prototyping and testing, I can figure out big issues in my design before I start the high-fidelity prototypes.
Wireframes 🖌️
Wireflow 👩🎨
Testing the Wireflow 🧪
I asked my friend to go through his journey of the low-fidelity wireframes. The journeys he took are in pink.
Notes from the testing 📝
Onboarding
- for onboarding screen #1, for sheet music, wants the option to indicate instrument too
- says that the onboarding makes sense and is simple
- may be missing something for step #4
Sheet music database
- tab has the most popular sheet music for piano, which is nice
- likes advanced search filtering, wants genre too
- for page; wants download pdf and markup tools features
Teacher search
- likes availability multi-select, maybe have times available for teacher as well
Scheduling a lesson
- calendar is not clear in scheduling a lesson. maybe have clear indication of days and times unavailable
- have additional comments feature
Academy
- have most popular courses separated by instrument
- would like to have level 1-5 subsections
- include title of course and level of course
Reflection 💭
I gave my tester the designs and asked him to logically go through the prototype according to what he wanted to do with the website. He talked aloud and suggested things to add or change, but overall did not have any difficulty going through the low-fidelity prototype. I found that directly hand-drawing the wireframes and flow was a lot more difficult than making them in Figma. In the past, for my UX projects, I would create my low-fidelity screens with Figma. However, I think that drawing them by hand makes me think about the journey harder, which is a benefit. Next time, I think I would make them a bit more detailed. When my tester went through the prototype, he found that there were a couple features that were missing or lacking something. From the notes I took of his journey, I will make quite a few changes to my design. First, in the onboarding, I will add an option to indicate what instrument the user is using if they are looking for sheet music. For the sheet music page, I will add more features when viewing it. I will also make the calendar for scheduling the lessons more detailed, perhaps with a legend. Lastly, for the pre-recorded lessons database, I will separate the courses by difficulty level so that the user can find what they are looking for faster.