Emotion Literacy Advocates — UX Redesign
Redesigning for Real Impact — A UCD-driven redesign of Emotion Literacy Advocates — a Seattle nonprofit whose Google Ads grant was driving traffic but losing visitors before they could connect, learn, or give.
My Role
- UX Researcher & Designer
- Interaction Design
- Stakeholder Presentation
Tools
- Optimal Workshop Card Sort
- Figma
- Slack
- Microsoft Office (Excel, Powerpoint)
Project Overview
Emotion Literacy Advocates (ELA) is a nonprofit whose materials are widely used across schools, social service agencies, hospitals, and HR departments.
Problem
Despite strong website traffic, users were spending little time on the site and conversion rates remained low. Applying User-Centered Design techniques, we redesigned the site to close the gap between visitor needs and site experience, with a focus on clarifying ELA’s mission, improving access to ELA content, and creating a clearer path to donations.
Goals
- Improve site credibility via testimonials, and increase mission awareness
- Modernize outdated design
- Increase time spent on site, donations, content downloads
- clearer action paths for key user tasks
Research Methods
We designed tasks to reflect the most critical user goals and business risks in the Classes & Events experience:
- Comparative Analysis
- Google Analytics
- Quotes from the form submittals
- Quotes from website
- Card Sort
- Surveys
- Interviews
Key Research findings
- No clear path to action — High bounce rates and lack of mobile-friendly rendering left users without direction or major tasks to complete.
- Credibility and trust gaps — Users questioned the organization's legitimacy and wanted cross-links to outside research and clearer information on how funds are distributed.
- Fragmented content experience — Materials, workshops, and resources were scattered, with users consistently asking for consolidated access to all content in one place.
- Unmet audience needs — Form submittals and surveys surfaced specific user interests — self-help, school programs, bullying, depression — that the site wasn't adequately addressing.
Developing Personas
Derrick the Donor
Age: 43
Status: Single
"I lost my brother to suicide, I want to do something to honor his memory and help people who are struggling with their emotions, I don’t have a lot of time but I want to do something."
Derrick the Donor
Age: 56
Status: Married
"I want a tool to help the kids expressthemselves in a constructive way."
Penelope the Poet
Age: 33
Status: Single
"I need help dealing with my emotions, I feel like I have no control over them."
User Task Matrix
Example Action Items
- Make a Donation
- Read Testimonials
- Learn about Emotion Literacy
- Purchase Learning Materials
Ideation
Site structure & Initial wireframes
With a little help we were able to solidify items to be grouped together and the architectural hierarchy and start brainstorming low fidelity wireframes.
Designing and Prototyping
Our redesign of the ELA website was based both on user research, business goals, and the nature of the organization’s work.
Clarity before depth — there is a lot to emotion literacy, but we aim to reel people in easily and educate them over time
Prioritize a connection — have approachable language, show them who emotion literacy is and be clear on how it operates
Build credibility — Show quotes form real people, use storytelling as a key connector to the audience.
Align business goals and user objectives — Have a clear path of action on the homepage for donations, resource downloads and learning about ELA.
Testing the Redesign
What was working
- Users were able to complete majority of 10 tasks we tested for which focused on the homepage and main landing pages
- Good to see we were on the right track
Needed revisions
- How to better describe Emotion Literacy to users, some test users were still unclear
- Consider rewording Items to better meet users expectations