Nature of Sound
Nature of Sound is a nonprofit organization operating in Solano County/Northern California. They provide creative community solutions through art, music, film, and games to solve critical issues. Nature of Sound runs youth outreach programs as well as works with programs that focus on aiding victims of crime. They also promote programs focused on special needs children and their families.
I was given the task of running an accessibility audit and updating the website based on user research gathered. I worked with the Web and Development team and became the Lead UI/UX Designer on this project.
My Role
Lead UI/UX Designer | Accessibility Designer | Wireframing | Information Architecture | Brand Style Guide
User Feedback
User C:
"I know Nature is in the name but all the plants make me feel like this is an eco nonprofit"
User G:
"The text is hard to read and in general, it feels so busy. It's hard to focus on reading"
We gathered user feedback on the website by conducting surveys and interviews. We found three common complaints amongst the participants.
User S:
"It feels aggressive to me with all the writing in Caps"
Empathize & Analysis
Based on the data collected, I created two personas, user journey maps, and user stories that reflected our findings.
.jpg)
.jpg)
![Google UX Design Certificate - Persona [Template] (1).jpg](https://static.wixstatic.com/media/ac25fa_98b349b7c2154b60949a9ff64cdefdb6~mv2.jpg/v1/fill/w_385,h_217,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20Persona%20%5BTemplate%5D%20(1).jpg)
![Google UX Design Certificate - Persona [Template].jpg](https://static.wixstatic.com/media/ac25fa_8f1aef962d2e4c059ac774a5aefd4f13~mv2.jpg/v1/fill/w_385,h_217,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20Persona%20%5BTemplate%5D.jpg)
![Google UX Design Certificate - User Story [Template].jpg](https://static.wixstatic.com/media/ac25fa_acf9fe65c2434525a89c7f7d06bf9e5a~mv2.jpg/v1/fill/w_238,h_134,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20User%20Story%20%5BTemplate%5D.jpg)
![Google UX Design Certificate - User Story [Template] (1).jpg](https://static.wixstatic.com/media/ac25fa_f49eb76be20241e384c12af35dd565ae~mv2.jpg/v1/fill/w_238,h_134,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20User%20Story%20%5BTemplate%5D%20(1).jpg)
Accessibility
Redesigning the website to follow WCAG AA color contrast and ADA standards became a top priority with this project. To establish a consensus between designers and the development team before tackling this problem, I created a style guide for the team to follow. This guide detailed which color combinations specifically followed WCAG AA. We used a collaborative Google Doc with all the website's imagery listed to correctly add descriptive Alt text.
Priority
Using the Impact-Effort Matrix, we came up with a priority list for changes that needed to be made.
Color Contrast
Change the color contrast of all UI to follow
WCAG AA regulations.
Alt Text
Add Alt Text to all images and graphics to follow ADA Standards
UI and Typography
Redesign the UI and typography to
Paper Wireframes
Redesign
Before
After
About Page 1
About Page 2
Sign Up Page
Contact Page
Final Outcome
We have received largely positive user feedback on the new design; however, there are plans to run a usability test to guarantee the best user experience on the website.
You can view the final product at www.natureofsound.org
Takeaways
Redesigning the Nature of Sound website was a fun and important challenge. It was a new experience leading a project and delegating work to other designers on the team. Working with the Dev team was an amazing opportunity. I look forward to our future projects!
Kailey Martin