The Leacock Foundation Site Redesign

How do we attract interest to a good cause?

TEAM

of 3 students
UX Design Bootcamp
University of Toronto

ROLE

UX Researcher
Idea Generation
Requirements Analysis
Prototyping
User Testing & Evaluation

The Leacock Foundation is an NGO providing enriched literacy and leadership opportunities to underserved communities in Canada and South Africa. While its current site provides ample resources to potential donors, volunteers, and young professionals, we wanted to look into re-designing their web and mobile platforms in a way that maximizes donor and community engagement. Our research and solutions therefore focused on the questions that underscore what draws and retains community involvement.

User experience
User interface

How it works

Leacock's redesign emphasizes simple actions and quick results. Donations can be made in just a few clicks. You can browse and pick causes or programs that you most connect with. Keeping up to date with the programs you're involved with is straightforward and relevant to your interests.

One of the biggest deterrents in engaging others is time. If it takes longer than a few seconds to figure out how to donate, users simply drop off. The first few moments a site like Leacock has with a potential donor is therefore crucial to user engagement.

What did users want?

User surveys and interviews revealed a few key issues:

Users do not trust NGOs with their money
Most people prefer greater transparency and control over where their money would be going

Users like feeling more involved
Most users preferred to volunteer rather than donate because they wanted to feel more attached to the cause‍

‍Convenience and simplicity are key
If there are too many steps in the donation/volunteering/information-procuring process, drop-out rates are higher

‍Design is still important
Regardless of how good the cause is, people still feel put off by bad UI and design choices

USER EXPERIENCE

DONATE NOW
We worked off a simple premise: the easier we make it for users to donate, the more likely Leacock is to receive donations.
In fact, it’s one of the first things we see on the homepage. We even take the guesswork out of the donation process by providing suggested amounts.
EXPLORE ON-THE-GO
All of Leacock's functionality was made mobile-friendly to enable users to make quick donations while in line for a coffee, or read about programs on their morning commute.
CHOOSE YOUR PROGRAM
Users are able to pick one or more specific projects to donate to, and subsequently receive updates on. This would hopefully foster closer relationships between donors and their causes, and inspire them to get more deeply involved as they see various Leacock projects come to fruition, thanks to their support.

USER INTERFACE

Style

Colours, typography and components have been kept simple to allow Leacock's content to shine. Leacock's main distinctive trademark is its signature colour (Crimson - a slight variation of their original shade). All other design elements and styles are clean, flexible, and unobtrusive.

Colour Palette

Typography

Components

Telling a story

The most important and compelling part of Leacock's programs is its students. Our focus therefore lay on building a visually-rich site that told their stories and offered us a look into their world.
Layouts catered to images/snapshots of Leacock's impact in both local and international communities.
mikella.seth@mail.utoronto.ca
RESUME