The Salvation Army
Role: Lead UX/UI Designer
Key Contributions
🔑
Designed design system modules, low-fidelity wireframes, and high-fidelity screens
🔑
Led the design team with regular check-ins, task delegation, and project coordination
🔑
Acted as the primary design liaison between the client, development team, and internal stakeholders, ensuring alignment across all design-related efforts
🔑
Served as lead presenter in client meetings; clearly communicated design strategies and solutions
🔑
Conducted in-depth secondary research to inform design decisions and the user experience
🔑
Oversaw quality assurance for development, ensuring the final product met design standards
Outcomes
🎉
Optimized the Path for Users to Find Help
🎉
Redesigned Over 1,200 Sites With a Consistent UI
🎉
Created a Design System
Project Background
What is The Salvation Army?
Founded in 1865, The Salvation Army is a Christian organization providing social services in over 130 countries. They offer both spiritual guidance and practical support to vulnerable populations, regardless of religion, race, or background.
The Salvation Army Web Ecosystem Has More than 1,200 Sites
Due to the hierarchal structure of The Salvation Army, each site has a different design which causes an inconsistent experience from one site to another.
The Army Was Switching Their Hosting Platform, Creating an Opportunity for Design Improvements
The Salvation Army decided to switch their website’s hosting platform, and saw this as an ideal opportunity to redesign and improve their site. Their last major overhaul was back in the early to mid-2010s, making it a timely update.
User Problem
Users Have Difficulty Finding Local Salvation Army Help and Services
Throughout the Salvation Army ecosystem of 1,200 sites, there's no clear starting point or defined steps for a user to find local help and resources.
Solution
I Optimized The Flow for Finding Help and Redesigned Their Entire Web Ecosystem of 1,200 Sites
The Salvation Army's Largest User Base are Those in Need of Help
80% of Users are Those Who Need to Find Help & Resources
Through demographic surveys based on self-identification questions on the live site, my team found that 80% of site users were wanting to find help. These people can be the economically disadvantaged, people with disabilities, military veterans, etc.
These Users Don't Have Time or Energy to Navigate a Difficult Site
These users typically have other frustrations to worry about whether it be finding where their next meal is coming from, getting rehab services for their loved ones, or even preparing for their first job after getting out of prison.
Salvation Army Personas
Why Users Have a Difficult Time Finding Help
There's No Clear Start or Pathway For a User to Find Help & Resources
On every location's site, there's no clear indication of where a user can begin to find local help & resources. Because of this, there's also no clearly defined steps to find those resources.
How Do Other Sites Address This Difficulty?
Before Designing a Solution, I Asked Myself "How Do Similar Sites Tackle This Kind of Problem?"
I researched various sites with a similar goal of connecting users to the right resources, including HCA Healthcare, Feeding America, and even Olive Garden. Two of the most inspiring references were Baylor Scott & White Health and the YMCA, both of which clearly show users how to find resources and where to access them.
An example of Baylor Scott & White's user flow for finding help
An example of YMCA's user flow for finding locations with specific facilities and programs
We Tested a Feature Before Designing
With Baylor Scott & White and The YMCA References in Mind, We Tested a Similar Flow on the Live Site
We added a button in the navigation that begins the flow for users to find help, which would bring them to a page that allows them to search for Salvation Army locations near them.
We found that there was a 12% increase in users clicking into local Salvation Armies.
Test page excerpt of having a CTA for finding help in the main navigation
Designing a Clear Pathway For The Users To Find Help
Using the References and Tests as Support, I Designed and Optimized the User Pathway to Find Help
At any time, they can simply click "Find Help" in the top navigation to begin the process of accessing support and services. I added additional elements like filters and more interactive result cards so that there would be more clarity during the user flow.
How a user finds help
Making That User Flow Consistent on All Sites
As I Optimized the User Flow, My Team and I Created a Design System for a Consistent Design & User Flow on Every Site
This design system created a consistent experience on every site, especially when finding help. Now, once the user navigates the different sites, they have a reliable way of method of finding help on any site.
The design system was created closely in tandem with the development team. We had weekly check-ins throughout the project for constant collaboration and alignment.
Design System Excerpt
Results
🎉 Optimized the Path for Users to Find Help
I made the pathway to finding help shorter and more clear on any page.
🎉 Finding Help is Consistent Across All 1,200 Sites
All sites now have the "Find Help" button in their navigation so now no matter what site a user is on, there's a clear CTA and pathway to find help.
🎉 Created a Design System So All New Iterations Will Have a Consistent Experience
The Army now has a design system that every site can use for future pages.
The Current State and Into The Future
At the Time of Writing, the Designs are Still in Development
Because of this, I don't have any measurable data to see what is performing better and what does not. However, that is something that will be collected after launch.
KPI's to Measure After Launch
Some KPI's I'd like to measure as a symptom of success for this redesign would be:
What are the click rates of CTA's like Find Help, Donate, and Service pages compared to the old design?
Are service pages receiving more traffic than the old design?
Is The Salvation Army receiving more donations compared to the old design?
