Website Redesign & Development Process to Increase SEO & donations
RESPONSIVE WEBSITE REDESIGN

Website redesign to increase non-profit donations by simplifying the donation process & checkout as well as optimizing the website for mobile users. ANIDA is an international organization that runs community-based programs in Ontario, Ghana, and Jamaica.
 

anida mockup.png

PROJECT OVERVIEW
The Kick-Off

Project type:

Timeline:

Role:

Tools:

Contract

6 Months

UI Designer, Presentation

Figma

ANIDA is an international organization that runs community-based programs in Ontario, Ghana, and Jamaica. They aim to empower underserved communities by removing obstacles that prevent children from accessing education and which keep women and their families in poverty. The redesign increased non-profit donations by simplifying the donation process and increased SEO by creating campaign-specific pages.

PROJECT OVERVIEW
What I Did

I worked alongside the web developer, executive director, and media coordinator on this project of redesigning ANIDA’s website. Through our collaboration we:

 

User testing

  • Created multiple pages to A/B test the various strategies and determine the effectiveness of certain design elements at generating conversions.

 

Create campaign-specific donation pages

  • Increased specificity for time-bound campaigns to create a stronger sense of urgency, driving higher conversion rates.

 

Optimize for mobile

  • Many donations will be coming from users using their mobile devices, thus it's important that the donation process is user-friendly and engaging at all screen sizes. 

PROBLEM SPACE
Secondary Research

I researched to see what information donors want to see on non-profit websites before they decide whether to donate. Their answers fell into 4 broad categories, 2 of which were the most heavily requested:

 

  • The organization's mission, goals, objectives, and work.

  • How the organization uses donations and contributions.

 

In addition to observing what "closed the sale" for charities that attracted user contributions, I also analyzed the turn-off factors that caused charities to lose out, even after users had spent considerable time on their websites.

The donation-killers:

47% 

were usability problems relating to page and site design, including unintuitive information architecture, cluttered pages, and confusing workflow.

53% 

were content issues related to writing for the Web, including unclear or missing information and confusing terms.

17%

of users couldn't find where to make a donation.

APPROACH
Design Process

Articulating ANIDA’s impact on the community was the main focus of the redesign, and the best way to do this was through storytelling.

 

Telling their story is one of the most effective ways to appeal to their donors’ empathetic side and compel them to get involved and contribute. Part of inspiring donors to give to ANIDA means relaying their story and mission to show the impact they have made. I was able to do this through:

 

  • Showing donors the impact they will have

  • Keeping the mission, objectives, products out in the open

  • Being transparent by showing how ANIDA has specifically used the donations

DESIGN
Hi-fidelity Prototype

Gift Cataloge Page

gift catalogue.png
gift catalogue-1.png

Donation Page

donate.png
donate 2.png
donate 3.png

THIS WORK IS STILL UNDER CONSTRUCTION
If you'd like to see a full case study or learn more about my experience at ANIDA, please contact me!

DESIGN PROCESS
Key Learnings

Include a compelling "Why"

  • The donation page shouldn't just feel like a payment processing form. It should remind people about the impact of their donation on the organization. This compelling "why" came from understanding the potential donor's motivations.

 

Simplify the process

  • The donation form should be painless for the user to provide a simple and straightforward donor experience. The easier the process, the more likely the user will complete the donation process.

HAND OFF
Next Step

Hand off to developers to make the magic happen! To make this a seamless process, I created a design system to help prevent any inconsistencies and ease the job of the developers. 

mockup.png

PEAKED YOUR INTEREST?
Explore Other Projects

mei mockupppp.png

MEI is a digital tool designed for users to virtually try on makeup trends using AI and AR technology.

Users can find their perfect shades, customize their looks and shop all at their fingertips. It’s like having a personal glam squad in your own pocket!

google mockup.png

Collaborated with data scientists and web developers in a 24-hour hackathon challenge to create an innovative solution that explores data security.

Rookie is an education tool designed to engage in real-time interactions through Google Chrome to improve user privacy through data education.