Skidrow Housing Trust
UX/ UI Design, UX Research, UX Writer
Skidrow Housing Trust is a local Non-Profit Organization in Los Angeles, CA who aims to reverse homelessness.
They develop, manage, and operate permanent and supportive housing for people who are experiencing homelessness helping individuals move beyond poverty, illness, and addiction.
​
During this 5-day design sprint, the goal was to help Skidrow Housing Trust express their value and inspire more donors to take action in order to drive postive change.
Project Overview
I collaborated with a team of three other UX designers to conduct a usability evaluation of an LA-based NPO, Skidrow Housing Trust's current donation experience. The following is our process to redesign a more user-friendly donation experience with the goal of increasing trust, reliability, and overall donation revenue.
UX RESEARCHER | UX WRITER | UX STRATEGY | UX DESIGN CONTRIBUTOR
Shared credit to designers, Raymond Xian, Jacinta Macey, & Alex Bailey
Deadline Constraint: 5 Days
Project Type: Design Sprint
Designed for: Desktop, Mobile
Programs: Figma, FigJam
REDESIGNING FOR IMPACT
PROBLEM
An evaluation of the Skidrow Housing Trust website revealed several usability issues that affected trustworthiness and reliability.
SOLUTION
Redesign a more trustworthy, transparent, and predictable user flow while keeping the brand identity of Skidrow Housing Trust.
IMPACT
A user-friendly site that leaves donors feeling connected and driven to contribute to the charity's mission to reverse homelessness.
Problem Space
Today, the average American supports 4.5 charities.
With many causes to support, donors are unsure about which charities they can trust.
​
Research shows that it doesn't take much to change a life forever...
20%
of individuals living in Skid Row are homeless
$1,000
is enough to support a year of housing for someone
9,812
people are no longer experiencing homelessness thanks to the Trust
But as of August 2022, The Skidrow Housing Trust website has usability issues that get in the way of donor contributions.
Here's our initial analysis based on usability and UX principles:
​
-
Little transparency to how donations are used to make an impact
-
Major usability issues concerning layout and user flows, causing confusion and even site abandonment
-
No story or clear mission causing users to feel disconnected and unmotivated to complete simple tasks​
​
It took our team 7 minutes to reach the goal of making a donation as a first-time donor. This is over 500% too slow according to a Neilsen & Norman study.
Research & Discovery
Primary Research
The secondary research performed on the Skidrow Housing trust website and the larger market for online charities, led our team to form assumptions about the current online donation process. We turned those assumptions into questions that we could use to template out a research plan and interview script.
“Lurking beneath every goal are dangerous assumptions. The longer they remain unexamined, the greater the risk.” - Jake Knapp
We interviewed 3 participants in their 60's who were self-proclaimed charitible individuals.
We spoke to a mixture of donors who had donated online and who had never donated online, so we could evenly weigh the effects that an online environment may have on the donation process.
Donna, 64
- Beekeeper
- Not tech savvy
- Hasn’t donated online before, weary of scams
Jenny, 61
- Retired HR Director
- Somewhat tech-savvy
- Only donates to causes she believes in
Herschel, 62
- Business Owner/ CEO
- Comfortable with tech
- Needs to know exactly where his money is going
Through synthesizing our interviewees' pain points, motivations, and behaviors, we organically produced themes and insights that would help direct our focus for the rest of our process
.png)
There was quite a bit of qualitative data to sift through, and all of our themes seemed like valid directions for our team to focus on, however, one emerging theme was directly correlated to the secondary research that we found.
Security and Transparency by far was the most impactful theme that we could focus on based on the research that we had conducted. So we wanted to know...
We crafted a user persona based on the pain points, motivations, behaviors and themes that we found to help us answer this question.
So I’d like you to meet Michelle Diaz who is an avid supporter of a good cause but she often gets frustrated without a clear way to give a donation, or when she feels like she’s being misled about where the money is actually going.
She needs a clear story to believe in so she is inspired to donate.
This is how Michelle navigated the donation process on the Skidrow Housing Trust’s current website.
Many times along the way she is left wondering if the website is legit due to the inconsistencies, broken links, and lack of transparency across her journey.
Looking at everything we had learned so far, we began to iterate designs to help Michelle feel more confident and secure in her donation process to the Trust
Each member of my team began iterating how we envisioned telling the Trust’s story, while simplifying the donation process. We wanted to break down not only how Michelle can support the Trust, but also why she would want to.
Sketching
From here we were able to begin sketching out what sorts of solutions Michelle may want to see in a new donation process.
Exploratory Sketches
From our exploratory sketches we took the best elements and decided on these solution sketches. Giving us a better idea of our designs for prototyping
Solution Sketches
Mid-Fi Wireframes
Our exploration started off with the persona and how they would personally navigate our website. With clarity and transparency guiding us, we wanted to make all the hard work Skid Row has done shine through on each page.
Hi-Fi Wireframes
Moving into Hi-Fidelity Wireframes, we have injected the Skidrow Housing Trust brand colors, messaging and tone within the copy, and focused on the Information Architecture and layout of the website so that it naturally guides the user to the information they want to know most before they decide they want to make a donation.
In this stage of our Design Process, the work that I have contributed to most is:
​
- the website layout and IA
- the task flow/user journey
- the content strategy
- and the majority of written copy and microcopy
Homepage
Donate or Volunteer Page
Make A Monetary Donation Page
Donation Form Page
Donation Confirmation Page
Initial Prototype
These hi-fi wireframes bring us to our initial prototype which we will test on peers and users.
​
Remembering our research and our theme of trustworthiness and security, we want to avoid elements that may "look cool" to us as designers, but ultimately feel over the top or intimidating to our users. We aimed for simplicity and familiarity with transitions, animations, and visual design elements.
User Testing
To improve our designs, and make sure that they feel, are understood, and behave as intended for our users, we conducted 5 user test sessions.
​
Through a scripted task list, we gave our test users a scenario of being a first-time user who may be interested in giving a donation to Skid Row Housing Trust.
​
Here are the tasks and the completion rates of each task and user.
Overall, the data from our test was positive. Everyone was compelled by the story our design told and very interested in donating.
The orange color was a lot at times, and the progress bars were confusing for some users. In conclusion, our prototype was a success, with opportunities for refinement to enhance the design.
We took the feedback from our user test sessions and mapped them on our Design Prioritization Matrix.
Focusing on the high impact, mid to low effort changes we began revising our prototype to ensure the most successful and meaningful version to launch this prototype.
Revised Prototype
Iterating on the feedback we received during user testing, we got to work to implement the design changes that would give our team the highest impact for the time that we had left in our time constraint of the 5-day sprint.
V1 Homepage
We received feedback that the design was lacking breathability and a government ID number, had confusing sections and jarred users with too much orange.
Revised Homepage
We added the EIN number, labeled the awards and proofing section, masked the orange boxes with images and added some breathability to the design
V1 Donate or Volunteer Page
We received feedback that the progress bar was confusing, and the design was lacking breathability.
Revised Donate or Volunteer Page
So we made the progress bar clear by adding dollar amount indicators, and added breathing room.
Final Prototype
Key Takeaways
-
Adding in key elements that build trust like testimonials, badges, and images of real people on the homepage and throughout the journey is important to gaining credibility quickly.
​
-
Donors want more information about where their money is going and expect to be told that information without having to look very far for it.
​
-
Visuals and wording are equally important when demonstrating a believable online story that designers want users to experience.
Next Steps
-
Incorporate extra ways that people can help the cause outside of donating money or dedicating their time - two very valuable items for humans. How can we help people get more involved?
​
-
Improve the prototype to be more accurate of common screen sizes so the elements don’t appear too large (users feel like they need to zoom out)
​
-
Complete the prototyping process by adding more user paths and interactions associated with each page to bring to final prototyping
​
-
Conduct more rounds of user tests to iterate the design and functionality to bring to final prototyping and development handoff
