Accessibility Add-on
Enhance the music streaming experience of
the HoH (hard of hearing) community
My Team
Shenhao Xie: UX Design
Katherine Cheng: UX Research
Cani McMillian: UX Research
Project Length
3-month UX Project
Jan.2020 - May.2020 (3 months)
Project Overview
Currently, there is a noticeable lack of accessibility features on popular music streaming apps for users that are hard-of-hearing (HoH). We aimed to better convey music to the HoH community by designing a sustainable, universal, and accessible solution to improve the desktop music streaming experience. Our final design is a accessibility add-on that features:
Access to live lyrics & more detailed lyrics presentation
Summary of background stories
More discoverable & intuitive equalizer
Overall Process
Secondary research
User interview
Survey
The problem
User needs
Design requirements
Sketches
Wireframes
Usability testing
High fidelity prototype
The Problem
90%
of Americans listens to music for an average of 32 hours a week30+
Music streaming services available ~1 in 20
Americans are D/deaf and hard-of-hearing~1 in 3
people in the US between the ages of 65 and 74 has hearing lossListening to music has been an enjoyable part of our lives. For most people, listening to music is a simple process. However, we barely think about the limits placed on music streaming for people who are deaf or hard-of-hearing. With many companies moving towards making products more accessible, there is a noticeable lack of accessibility features on popular music streaming apps. This makes us wonder:
Is there a way to make the music streaming experience more accessible and enjoyable? How can we best assist in creating a better streaming experience?
The Research Phase
For the research phase of the project, we aimed to learn more about the previous studies conducted related to this topic and to utilize previous data available to us. We also explored existing solutions in the market to gauge our target users’ current experience with music streaming as well as their goals, motivations, and expectations. With our research goals in mind, our team used secondary research, interviews, and surveys to answer these overarching questions:
What are HoH people’s perceptions of existing music streaming tools?
Why and how do HoH people listen to music (streaming)?
What are some important factors that could make the music streaming experience user-friendly for HoH users?
How can technology better assist people who are HoH to make music streaming accessible?
We tried to design for both the deaf and hard of hearing communities, but decided to narrow down our focus on the HoH communities only because of the huge difference in the need of the two groups as well as other factors including limited time and access to the deaf communities.
Research Process
Secondary Research
Before our team explored primary research, we decided to conduct secondary research to validate expected interview protocols and support further data collection. We sought out scientific reports, scholarly journals, personal narratives, and other existing research to determine the HoH communities' interest in music streaming.
User Interview
Our team conducted remote interviews with 5 members of the HoH community through Zoom. Cameras were on throughout the interviews so participants could see our lip movement, which helped us convey meaning. Participants were recruited through two Reddit communities, “hardofhearing” and the “rit”, which is the official subreddit of the Rochester Institute of Technology, the home to the National Technical Institute for the Deaf.
Survey
To gain additional quantitative and qualitative insight, we surveyed 32 members of the HoH community for further data investigation. Participants were also recruited through the two Reddit communities mentioned above. The insights we gathered helped validate the findings we obtained from the previous two research methods.
Research findings
01
Lyrics and sound quality are two key aspects that the HoH community value the most in music streaming.
Sound Quality
#1 consideration when choosing platformsLive lyrics
80% participants use lyrics toolsExisting equalizers look complicated to use and users assume they have a steep learning curve.
02
“It would make it a lot easier for me to understand the song but it’s too complicated for me right now.”
“I would have tried to use it if I know this feature was there.”
Equalizer is often hidden deep in the settings, making it very hard for the users to find if they are not looking for the feature specifically.
03
People care about understanding the message a piece of music is trying to deliver.
“I think the main goal is that you want to be able to understand the artists, what their message is.”
62%
participants try to understand the message …
Music is often a “background” element that HoH users use as they multitask.
Most HoH users prefer desktop for music streaming because it’s easier to multitask on.
After synthesizing our research findings, we further refined our problem statement:“How might we better convey music to the HoH community by improving the desktop streaming experience and providing a universal solution that could be applied to all desktop streaming platforms?”
Based on the data we collected in the research process, we made a list of design requirements formulated during the research process:
The solution has to provide access to live lyrics and have better lyrics presentation.
The solution has to make hearing-related accessibility features (e.g. equalizers) more discoverable and more intuitive.
The solution could help users better understand a piece of music by providing more details and related info of the music.
Into Design
After refining our problem statement and setting our design goals, we moved on to brainstorming potential solutions for our project.
After a few rounds of ideation and weighing the pros and cons of different solutions, our team decided to move forward with the idea to create
an accessibility add-on for desktop streaming platforms
We created and demonstrated our design using Spotify, as it’s the music streaming platform that the HoH community uses the most, according to our research.
Iteration I: Concept Testing & Findings
We created wireframes to demonstrate the ideas of our concept and features. Before moving on to creating a prototype with higher fidelity, we wanted to make sure the features we incorporated and the interactions in our design align with users’ mental model.
Therefore, we recruited two HoH users to participate in concept testing sessions and iterated on our design accordingly.
Findings
Incorporating features related to visual accessibility would be helpful to our users.
Both users wanted the ability to adjust the font size of our lyrics section so the add-on is more accessible to a broader audience.
“One thing I think... to have an option to adjust font size and color would be nice.”
① Added a feature that allows users to change the font size of lyrics and background story.
2. The structure/interactions of our equalizer page weren’t clear to users.
When asked to customize the equalizer by adjusting the frequency of a song, neither participants were able to complete the task without hint.
② Added descriptions to each section to provide clearer instructions to users.
③ Added background colors to each section to better group and distinguish each feature.
Iteration II: Usability Testings & Findings
After our concept testing and round one iteration, we reached out to three more HoH users who had never seen our design to conduct a second round of testing to make sure our product is easy to use and intuitive to our users.
We iterated on our design based on the feedback gathered and moved on to creating our high fidelity prototype using Figma.
Findings
The beat visualization could be distracting to some users.
“It will be distracting for me if I also want to do other things. An option to turn it off would be nice.”
④ Added a switch that allows users to turn off the beat visualization.
2. The flow to customize the equalizer was still not clear to users.
The success rate of customizing the equalizer was still low - 2/3 participants didn’t get it right on the first try as they assumed they would need to select a pre-set mode first before making customization.
⑤ Added a pre-set mode named “customized”, as users adjust the properties under the “customized mode” section, this pre-set mode would be automatically selected.
Final Design
01.
Better lyrics presentation
The accessibility add-on allows users to access live and complete lyrics with font sizes based on their own preferences. By providing the detailed captions feature that displays info of sound effects and including the beat visualization at the bottom, we are bringing the feeling of music to both users’ ears and eyes.
02.
Beat visualization
Users can view the beat spectrogram at the bottom of the screen. If a user finds dynamic elements disturbing, they have the option to disable this feature by clicking the toggle switch to off.
03.
Background story tab
Our add-on makes it easier for users to learn more about the background stories of a song and the message the artist is trying to convey and allows users to do further research more easily through search shortcuts.
04.
Discoverable & intuitive equalizer
Users can access the equalizer with a single click anytime. We also provide a description tooltip to explain different modes and make the experience more accessible to less savvy users.
05.
Sound Customization
Users can fine tune the sound based on their personal preferences. The tooltips show what instrument sounds match to each frequency range. Vocals and music volume can also be adjusted separately according to user needs.
Besides the dark mode version, we also created a design guide for the light mode version. The design guides that we curated adhere to AA WCAG standards.
Style Guide
Light mode mockup examples
Conclusion & Reflections
We were happy to find out through user tests that all our participants found our product helpful and meaningful. With our add-on, we hope that we could make the music streaming process more simplified and intuitive, and that we were able to create a sustainable experience that users in the HoH community can better enjoy.
“The info icon is perfect - now I know what equalizer does. I will definitely use this.”
“The vocal & background customization is really useful, because sometimes the vocal is too soft and you just can’t hear it.”
Our team is happy with our final solution. However, there are still room for improvements:
An ideal solution should be cross-platform, even though we focused on the desktop version for the project.
Ideally, we should be able to integrate the add-on with different music streaming platforms to reach a broader audience.
My takeaways from this project:
It’s important to design the research process and research methods according to research goals and the target audience.
It’s very important to consider all kinds of constraints in the design process if we are looking for a sustainable solution.
Thanks for scrolling! Feel free to check out my other projects!