In a study of 3 million people, music industry professionals were 4X more likely to experience hearing loss and 57% more likely to develop tinnitus. Yet, often less than 2% of musicians consider preventative hearing care. Project Decibel (PdB) is a hearing wellness initiative tackling this challenge by breaking down barriers to reach and provide care to individuals within the music industry. As a musicophile, I was thrilled to be on this project.
Knowing that 40 million Americans aged 20-69 live with hearing damage from everyday noise is scary. Almost as scary as the fact that there’s little to no regulation.
Weeks earlier, a team of UX designers from Designation conducted extensive research, concepting, and testing to create wireframes for the PdB mobile product. Due to time constraints, some of their final concepts came to us untested, giving us a unique opportunity to dive deep into the UX. This rocked.
I anticipated our biggest hurdle was creating a visual aesthetic that balanced the look, feel, and mood of music and health. Products from these industries elicit different emotional responses, so utilizing too much aesthetic from either had potential to alienate or confuse PdB users. I saw a parallel to my previous client, Clickx, when we explored the integration of a friendly and professional tone across a data visualization and learning platform. I was eager to see how I could apply and grow this idea to a new project.
In our kick-off, we learned Jenna and Drew weren’t thrilled about dark interfaces—they worried their app wouldn’t feel medical enough. Our clients spoke about the importance of familiarity, as most users choose to work with Project Decibel because they know their unique needs as music industry professionals are understood.
To determine a competitive niche for PdB, we dove into domain research to evaluate the market trends and patterns. We examined Mimi Test, Listen Carefully, ACS, Sensaphonics, Musician Hearing Solutions, and Soundcheck Audiology and synthesized our research to determine their strengths and shortcomings.
We found many competitors incorrectly balanced visual themes between the music and health industries, making them feel untrustworthy. Most competitors felt surprisingly outdated due to text-heavy pages, poor hierarchy, and stock photography—this excited me about potential differentiation for our client! To seek style inspiration and direction for our designs, we also examined many out of category products. Airbnb, Awair, Moodnotes, and Spotify were most inspirational to my design process.
Music industry professionals’ hearing is directly tied to their professional value. PdB users must feel confident in our expertise and confidentiality. We emphasize approachability, so users can come to us without hesitation.
The music community is at high risk for hearing disorders, yet they face shame when seeking preventative action and care. We break down these stigmas by creating a balanced visual aesthetic between the music and health industries.
Often on the road, music industry professionals don’t have time or a place to see a specialist. By utilizing quick digestion, we provide a convenient and efficient way for users to access hearing healthcare.
Music is a vast industry and the aesthetic appeal to different genres is just as broad. To create design directions that connected with any music professional, I needed to break beyond visuals that were genre-specific. I surveyed friends to explore what music means to them and the mood it sets. Stevie Nicks broke down barriers, so I drew from my inspiration, our design principles, and three emergent moods to create style directions that gently pushed PdB’s boundaries as a medical application.
My third style tile was a clear favorite. Jenna and Drew loved the color, unique typography, sound shaped waves, and photography. They were also drawn to the juxtaposition of round and sharp corners and warm and bright white tones. Compared to my other visual directions, they preferred the organic feeling of the wave-like progress bar, a simpler “before you start” graph, and more “album-like” photography. I integrated these elements when I began designing high-fidelity mockups.
Before diving into high-fidelity designs, I individually evaluated and collaborated with my team to find areas of opportunity within the wireframes—some wireframes were untested, making this critical. We sat down with Jenna to go over some of our questions and ideas before iterating.
Quick links took up valuable real estate and were redundant with the bottom navigation. We removed them to streamline the screen.
dB-A frequency weighting is used most frequently, making a focal drop-down menu unnecessary. We moved it into the decibel meter settings.
Our client expressed that safety was the most important feature of the decibel meter, but it was absent. We added a safe exposure limit using OSHA ratings, allowing users to see the permissible exposure time.
Message my audiologist was repetitive with the top navigation and added unnecessary information. We removed it to streamline the content to critical patient information.
The PDF Export function misaligned with common mobile patterns. We removed it.
Drop-downs, oh my. This page had a potential 20 clicks for 10 questions. We streamlined the design by replacing all drop-downs.
A long scrolling page can lead to survey fatigue and question skipping. I evolved hearing history into three click-through screens grouped by topic to increase ease and efficiency.
Horizontal radio buttons can decrease response accuracy so I utilized vertical stacking.
There was an inconsistent application of top navigation across screens. I improved consistency by aligning the patterns.
Crowding of information decreased digestion and cluttered the design. To improve scannability, I redesigned the structure.
We built our initial mockups and prepared for two rounds of desirability and usability testing, first on static screens and then using a clickable prototype. Over the course of 10 days, we tested a total of 9 music industry professionals including: musicians, sound engineers and tour managers.
Users responded positively to my colors, typography, and look and feel. As we moved through iterations over two rounds of testing, we honed in on some key areas of opportunity.
One of my project goals was to spend more time exploring color—while I iterated often and explored paired shades to create an illusion of depth, it wasn’t until the end of user testing that I realized I needed to be more deliberate to design a meaningful color system. I adjusted my application of color to incorporate more functionality, using greens and blues to indicate headers and navigational items while I used pink and red for visual highlights in iconography and text.
Many of our iterations revolved around UX and functionality, principally the sound level meter—the original wireframes had similar functions to other sound meters on the marketplace but when our users saw them, they had trouble understanding them. This key insight into user behavior and their expectations and needs as music industry professionals dramatically changed our design solutions.
We incorporated feedback from our final round of testing and client meeting to create our proposed solutions. In our final iterations, we parsed out what we could achieve in our final days of the project and what would become future recommendations for the PdB team.
I’m proud of how tirelessly we worked to iterate both the UX and UI of our designs. User testing reiterated the importance of testing our own assumptions and allowed us to make rapid progress. In the end, Jenna and Drew loved my design system and chose to develop it!
These high-fidelity mockups are the central jump off points of Project Decibel—however, they are a piece of the puzzle. I also created a prototype to illustrate interaction design and a comprehensive style guide to use as a branding and visual communication tool as they begin development. If you’re curious, please check out my InVision prototype and style guide.
After we wrapped up the project, Project Decibel asked me to continue on as a consultant and Jenna and I determined a few immediate needs. Due to time constraints, the UX team was unable to touch the e-commerce area of the app and Project Decibel was in dire need of something to show their investors. After gathering some data and research on popular e-commerce pages and other health platforms, I went straight from sketches to high-fidelity mockups. This rapid turnaround allowed Project Decibel to give their partners an idea of next steps.
Working from sketches directly to high-fidelity mockups was a new experience and at first it was slightly uncomfortable—it gave me insight into the fact that every process and project will be different and that time constraints and business needs are significant influencers. I'm excited to use design and strategy to help business and user goals converge for Project Decibel and future clients.
Looking forward, as our designs underwent significant UX and UI changes, additional user testing will be critical. Within the decibel meter, I want to test that:
I also want to test the restructuring of the hearing history questionnaire, as user testing was inconclusive,. I hope to conduct A-B testing to give Project Decibel a quantitative idea of how changes may affect whole-questionnaire and individual-question completion and accuracy rates.
Jumping off my work in Clickx, I deepened my understanding of my own process and used this to iterate my designs further. Project Decibel required significant UX and UI work—throwing myself into research and best practices while solving usability and desirability problems was a new challenge that I fell in love with.
During this project, I worked through many iterations of color. At the time, I thought I was completing my stretch goal of exploring color. At the end of testing, I realized if I was to create clear and meaningful designs, I needed to be direct in how I applied my palette. I learned how to pair colors to create depth and movement in my designs, but more importantly I learned how to build a design system that integrated color through multiple levels of function. Moving forward, I will approach building color differently—start with less and be deliberate about each color added.
Additionally, reflecting on our first round of testing, when 50% of our users were no-shows, I felt incapable of analyzing our results. At my core, I’m a scientist and I approach everything with this mindset, so having a sample size of three people was a statistical and mental obstacle for me. I reconciled this by digging deeper into our interview transcripts to nail down the drivers and develop my conclusions. Our small user pool taught me that valuable data and insights can come from a few people—such constraints are inevitable, so flexibility is essential. I’m proud of the solutions I designed for Project Decibel and I look forward to seeing where my partnership with them goes!