Human and Intuitive
Spero
non-profit website redesign
Redesigning Spero’s website to amplify the voices of grassroots organizations fighting human trafficking. A user-centered approach to connect donors with impactful, community-led solutions worldwide.
UX Research
Product Designer
Role
7 weeks
Duration
Overview
Background
Many nonprofit websites fail to effectively communicate their mission or engage potential donors. In the case of Spero—a nonprofit that connects U.S. donors with trusted grassroots organizations fighting human trafficking—this challenge is especially critical. Although Spero supports powerful international work, its website lacked clear visual hierarchy, emotional storytelling, and intuitive calls to action. As a result, key content such as partner stories, donation pathways, and impact metrics were difficult for users to find or connect with
Goal
Our goal was to redesign Spero’s website to better reflect its mission, inspire trust, and drive meaningful donor engagement. This included:
-
Enhancing content structure to prioritize clarity and scannability
-
Elevating the visibility of donation options and partner impact
-
Creating an emotional connection through storytelling and accessible design
-
Ensuring the site was visually engaging, responsive, and easy to navigate across devices
Design Process
Research
Current Website Evaluation
Evaluation Criteria
-
UX Design best practices
-
Accessibility principles
-
Jakob Nielsen’s Heuristics
-
Nonprofit website design research
Shortcomings
-
Lack of engaging visual hierarchy
-
Heavy reliance on text
-
Limited user interaction or calls to action
-
Missing storytelling or emotional appeal for donors
UX
-
Homepage lacks an immediate value proposition or compelling call to action for new visitors
-
Heavy text blocks (About, Partners) hinder readability and emotional engagement
-
No clear donation flow or emphasis on how users can get involved
-
Limited storytelling about impact or beneficiaries reduces persuasive power
-
Minimal interaction feedback or visual cues to guide the user
UI
-
Consistent minimalist aesthetic, but lacks contrast and hierarchy
-
Team page helps build trust, but layout could be more consistent
-
Partners pages lack visual branding, resulting in low engagement
-
Contact form is clear and usable, but lacks confirmation message or response expectations
-
Videos are used frequently, but not well integrated with content structure
Observations
Current Website Analysis Insights
01
Low Engagement
The homepage features an auto-playing YouTube video explaining Spero’s mission. However, users tend to skip it rather than watch, missing crucial context about the organization
02
Lack of Immediate Credibility
The "Donate Now" section appears directly under the video, but new visitors may hesitate to contribute without first establishing trust. The site lacks clear indicators of its legitimacy, such as recent updates, testimonials, or proof of ongoing operations
03
Minimal Information, Minimal Impact
While the website’s design is clean and easy to navigate, it provides too little information about the organization beyond the video. There is an opportunity to expand on Spero’s mission, impact, and transparency in a way that resonates more effectively with visitors
Interview with Spero
Jonah Traaseth
Executive Director of Spero
Primary Website Goal: Drive Donations
The Spero team emphasized that the website was created primarily to expand their reach and increase donations. While it currently serves as an informational platform, its main purpose is to motivate visitors to contribute. This highlights the need for a clear donation pathway and persuasive calls to action throughout the site
“The goal of the website is to inform and drive more donations.”
Preference for Video Content
The stakeholder expressed a strong interest in incorporating more video content to communicate Spero’s impact. Videos are seen as a powerful storytelling tool, capable of capturing emotions and conveying the real-life outcomes of their work
“Want to have video content to tell stories of our impact.”
Personal Connection Drives Trust
Spero’s current donor base is largely built on in-person relationships and trust established through fundraising events. This highlights an opportunity to humanize the website and replicate that connection through personal stories, team visibility, and trust-building
“Most of my donors have met me at a fundraising event.”
Interview with experience donors
We conducted user interviews with experienced donors to better understand the motivations, expectations, and trust factors involved in supporting nonprofit organizations.
Trust and Belief in the Cause Are Critical
Many participants emphasized that trust and alignment with an organization’s mission were the key reasons they chose to donate.
Personal Connection Increases Engagement
Several interviewees shared that their decision to give was influenced by personal experiences or long-standing habits of charitable giving
Consolidating Leanings
Affinity Diagram
To synthesize the insights gathered, we created an affinity diagram. This method allowed us to visually group related observations, behaviors, and quotes into emerging themes
Problem statement
Spero’s website was designed to inform potential donors about their cause and to receive donations.
How might we improve Spero’s website in order to quickly inform and inspire donors while creating trust that their donations are going directly to those in need?
Persona
John Colson
45 years old
Financial Manager
About
Hard-working and dedicated contributor in his community. He prides himself on his philanthropic work through various causes and charities locally and internationally while keeping up with his busy work and personal life alongside his loving partner and child. Methodically organized, John would like to see quick results and honest feedback stemming from his support and donations
Motivation
Find a new non-profit to support
Wants to make sure his money goes to a good cause
Frustration
Lack of transparency
Misappropriation of funds
Ideation
Sitemap
Initial user flow for Spero was iterated
Low Fidelity Wireframes
For the prototype, our goal was to preserve Spero’s clean and minimal aesthetic while improving usability and engagement.
While the Spero team valued having a video on the homepage, our analysis showed that users often skipped it, missing critical information. To address this, we integrated the video as part of the content grid rather than the primary focal point. Additionally, we enhanced the homepage by introducing concise, impactful facts to immediately capture users' attention.
We also optimized the donation flow by reducing steps and improving clarity, creating a more seamless and intuitive giving experience.
Usability Testing
We conducted usability testing with participants to evaluate the clarity, readability, and navigation of our low-fidelity prototype
Users Felt Overwhelmed by Too Much Information Per Page
Approximately 65% of users in our usability testing expressed that many pages—especially the homepage—presented too much information at once. Users appreciated the inclusion of impact statistics, but they were reluctant to engage with large text blocks or dense content early in the experience
More Information About Each Fundraising Event
During testing, users showed interest in learning more about individual fundraising events, but the existing layout only provided brief summaries with no option to explore further. This created frustration and limited engagement, as users couldn’t find details such as dates, locations, or how to participate
Impact
In response, we simplified the homepage layout to focus only on the most critical facts and emotional hooks, such as the mission statement and key statistics. Supporting content (e.g., founder’s story, partner details, how to get involved) was moved to secondary pages
Impact
we redesigned the Fundraise section to give each event its own dedicated page. This allowed us to provide richer content—including full event descriptions, sign-up options, and shareable links—without overwhelming the main Fundraise page
.png)
.png)
.png)
