Redesigning A Non Profit Donation Experience

Redesigning A Non Profit Donation Experience

Redesigning Critter Care's homepage and donation page, as well as the donation form.

Client
Critter Care
Project Type
UI/UX Design
Date
May 2022
 - 
May 2022
Services
UI Design, Prototyping

Overview

The Team

I worked on a team with three other UX designers. My primary role was the UI Designer and Prototyper. I also did user testing and data analytics.

Who is Critter Care

Critter Care Wildlife Society is a nonprofit organization located in Langley, BC, that is dedicated to rehabilitating orphaned or injured Native Mammal species of BC’s lower mainland. They have built a legacy over the past 30+ years, rescuing over 50,000 mammals. Not only do they rescue mammals, but they have taken part in educating the public through civic groups and senior homes. In addition to that they also assist other wildlife management organizations.

Project Goals

  1. Design a simpler donation process
  2. Organize content in thoughtful manner
  3. Highlight how donation funds are used

The Issues

  1. Donation form at the bottom of the page
  2. Information is unaligned and disorganized
  3. Too much white space
  4. Excessive amount of tabs with unclear titles in the dropdown menu

How Might We

How might we organize information more thoughtfully by utilizing the donation landing page’s real-estate, in order to increase the donation rate for Critter Care?

Execution

Secondary Research

Most Likely to Donate

Highest rates of giving among 35-54 age range

  • 89% = 35-44
  • 88% = 45-54
Most likely to Get Confused
  • Seniors (65+) almost twice as likely to give up on task gave up 30 seconds before younger users did
Bounce Rate

60-70% is the average bounce rate on a non profit organization’s website

Primary Research

We conducted a survey within our community to get a better understanding of people’s donation habits. Here were some of our key findings:

  1. 16% of people have issues trying to navigate the website of a nonprofit organization when trying to donate.
  2. 44% did not donate to a nonprofit because they didn’t know the impact their donation would make.
  3. 91% said transparency of how the funds are used is very important to them when donating to a nonprofit.

Target Demographic

Baby Boomers & Generation X

Baby Boomers | Born: 1946-1964 | Aged: 76-58

Gen X | Born: 1965-1979 | Aged: 43 -57

Baby Boomers make up 41% of contributions to Canadian charities in 2017, and are also twice as likely to give up on a difficult task compared with young users.

Current Experience Map

Expand Experience Map

Persona

Storyboard

Design Inspiration

Our design inspiration is a hybrid take on natural elements with an updated aesthetic.

Exploratory Sketches

After all working on exploratory sketches, we used dot voting to decide on which elements we wanted to incorporate into the solution sketches.

Solution Sketches

On the left, we have our solution sketch for the home page and on the right, we have our solution sketch for the donation page

Results

Home Page

Without focusing on changing content, we restructured the information on the home page and the donation page to create a cleaner and simpler UI.

Critter Care has a lot of great content on their site that is hidden by poor UI and unstructured information architecture. We utilized their content and our UI to improve this.

Donation Page

By highlighting the donation form and the goal of Critter Care, we were able to improve the donation experience and foster a stronger sense of trust in the organization.

Donation Form

We created a simple form that was easy to fill out and matched the branding of our site redesign. We also overlayed the form on images to further the connection a donor could have with the organization.

Having the option to share that you donated on social media was found to boost donation rate, and also be utilized by our target group.

View the full Figma Prototype

User Testing

As Linda, our Persona, testers were asked to scroll through the pages and make a monthly donation. The tasks asked of testers is as follows:

  1. Locate the Donate button
  2. Make an ongoing monthly donation
  3. Enter donation amount
  4. Enter you name & address
  5. Enter your credit card info
  6. Submit the form
  7. Return to the home page

Following user testing, we updated some of the copy and reorganized blocks to make for a better flow for the user.

Key Learnings

Through working on updating the Critter Care site and donation experience, we have learned how important information architecture is on a website. Additionally, we have learned through our primary research that individuals are weary of donating to charities and nonprofits because of a lack of transparency from these organizations on their use of funds. We tried to limit this distrust through our design intervention.

Next Steps

  1. Make adjustments to current prototype
  2. Conduct another round of user testing
  3. Finalize prototype
  4. Handoff assets to web developers