Overview
MY ROLE
UX Designer + Researcher
TIMELINE
20 weeks / Jan. - June 2024
TEAM
Design for America
4 Designers + Researchers
TOOLS
Figma
Wix
Context
Our Client, Encore Vocal Ensemble, requested a website redesign.
My team and I at Design for America worked with Encore Vocal Ensemble, San Diego’s premier performing arts group specializing in songs from musical theatre, Broadway, and film, to redesign their website. Encore’s website is crucial to the organization’s success, as a diverse set of users use the website to book them for events, buy show tickets, volunteer, donate, and audition.
The Problem
Visual inaccessibility
Users with visual disabilities are unable to view the website’s content.
Low bookings / ticket sales
Encore is experiencing a recent decline in ticket sales and bookings.
Project Goals
Enhance Visual Accessibility
Redesign focused on ADA website compliance and improving information hierarchy for clear organization.
Boost business goals
Reconstruct the booking flow for users to easily purchase show tickets and book Encore for events.
In other words...
How might we create an inclusive user experience that prioritizes visual accessibility while boosting business goals for Encore Vocal Ensemble's diverse users?
Solution Preview
Reduced scrolling for easy show bookings
I reimagined the booking flow, reducing scrolling so users can easily navigate to the top of the page.
before
after
Rebranded visual identity for accessibility of diverse users
I designed a new visual style guide that meets accessibility guidelines to ensure all users can navigate and read the site.
before
after
My design process
User Research
“Who are we designing for?” To better understand our problem space and determine the solutions, I utilized multiple primary research methods to discover user needs, pain points, motivations, and behaviors when navigating the site.
Website Audit
Identified pain points and areas of improvement
1. Poor visual accessibility
2. Disorganized information hierarchy
3. Unclear user actions
I conducted a screen-by-screen UX audit of the current website, analyzing the site’s navigation, design, and content clarity.
This helped me narrow down the main pages to prioritize in the website redesign, as well as pitch redesign concepts to the client through a visualization.
User Survey
Demographic analytics revealed the largest age group of users are 65+
63% of users experienced difficulty reading the website.
I surveyed UCSD students, members of Encore Vocal Ensemble, and show attendees, garnering 43 responses.
The website’s lack of color contrast and small text makes it difficult for users to get to desired actions, e.g. purchasing show tickets, especially for older users.
1:1 Interviews
Tasks revealed users experienced scrolling fatigue
Affinity mapping helped me organize user pain points, needs, and improvements.
I conducted two 1:1 interviews, giving them tasks such as booking Encore and purchasing show tickets. During these tasks, users had to scroll excessively throughout the site to perform their desired actions, resulting in fatigue.
Ideation
Through inclusive design, I aimed to nurture customer loyalty and bring in new audiences by:
1
Improving visual accessibility
2
Reducing excessive scrolling
3
Elevating Encore’s branding
Design System
Rebranded visual identity to meet Web Content Accessibility Guidelines
design explorations
My team and I started off with designing low-fidelity prototypes of each redesigned page. From there, I conducted A/B testing with 11 users to gather feedback and further iterate on my designs.
design iterations
I made improvements using feedback from usability testing to simplify the booking process.
1
Re-ordered layout to guide users to booking
2
Elevated branding by focusing on content design / UX writing
3
Condensed information to reduce information overload for users
Reflections
success metrics
Positive feedback from both user testing and Encore Vocal Ensemble’s leadership and members proved good design choices.
what i learned / thank you to...
Through this 20-week project, I learned how to design for accessibility - principles I plan to bring to future design works. This research-heavy project challenged me as a designer, as I focused on how to analyze large amounts of user data to prioritize pain points without disregarding the small details. I learned to transfer those research insights into strategic designs, and it was rewarding to see Encore’s brand identity transform through our work.
Thank you to Design for America for this opportunity and guidance throughout, Encore Vocal Ensemble’s leadership for their trust in me, and my fellow teammates who eagerly contributed to making this project a success.
Design for America 2024 Cohort
Team EVE