Case Study : Mobile Donation Experiences
Our take on a Mobile-Based Donation experience for Non-profits
Background
For many non-profits and 501(c)’s, donations are crucial to the organization survival. In today’s changing political climate, government grants have been increasingly competitive, causing charities and non-profits to rely more heavily on individual and corporate donations. This dependence is especially magnified in smaller charities tackling causes in the local community.
However, the current technology infrastructure for many non-profits, especially those of smaller scale, are not conductive to receive donations online. Many of their online websites are dated and in need of advancement to modern design and technology standards.
With the current advancements in online payment technology, and changes in consumer attitude towards online transactions, online donations provide 501(c)’s with a great opportunity to provide a convenient and scalable stream of funding.
At Impact++, we constructed the initial hypothesis that a redesign of the current donation flow of a non-profit website can lead to an improvement in donations. Moreover, we zeroed in on a mobile experience, a segment that is underserved but essential to gathering donations in the current landscape — as it allows for volunteers to get donors to contribute on-the-go.
We believed that an improved mobile experience will lead to more donations through increased usability and technology such as mobile wallet systems. To build for this hypothesis, we underwent an iterative design process to ensure validity and efficacy of our results.
Design Process
In order to validate the need for such a redesign, we chose to conduct research in the form of interviews and live ethnographies. We approached local charities, both large and small, at some their main points of contact with donors, to gain a better understanding of some of the challenges they face in the donation process — this research once synthesized provided direct insight into some of the design decisions we made in the later prototype.
Our primary interaction was with volunteers who wanted to collect donations in popular urban areas, such as shopping malls and college campuses. The goal of these donors were to convince potential donors to contribute to the cause, “on-the-go”; hence, they used mobile sign-up experiences on tablets.
Key Observations:
- Use of Mobile solutions, such as tablets
- Proliferation of online payment software
- Monthly donation options greatly increase contributions per donor
Identified Pain Points:
- Competition for a possible donor’s attention
- Establishing credibility of the organization
- Usability of the donation flow
- Speed of the donation
Personas
In order for us to truly empathize with the people we were designing for, we built out personas of those involved in this typical interaction. This further eliminated our personal bias and made the any prospective solution more user-focused.
Three personas were created to ensure that our designs were made with our users in mind:
Ambushed Pedestrians — Kelly — Marketing Director
Kelly always has an agenda. She knows what she wants to do and how to do it. While on her way to make a return, she is stopped by an individual asking for a donation. She is interested in the organization and sympathetic but does not want to break the groove of her day. Kelly politely declines to listen to their pitch and continues walking. She needs a way to learn more about an organization and donate at a convenient time so her day isn’t disrupted.
Community Organizers — Jennifer — Works for Non Profit
Jennifer works as a Community Outreach Coordinator for a non profit. She is passionate about its goal of helping underprivileged children and is trying to gather donations. Nevertheless, she hasn’t had much luck with getting donations over the phone from disbelieving potentials. Additionally, her schedule is packed with coordinating outreach events and she doesn’t have the time to do more. She needs a simple, hands-off way of establishing credibility and gathering donations.
Tech-savvy Students — Elliot — Full-time student
Elliot doesn’t like to waste time. With his Computer Science schoolwork and his part-time job as a cashier, his schedule is packed. He wants to donate to important causes. However, he doesn’t want to go through the arduous process of inputting his information and donating through a website. He needs a quick, easy way to make small donations using technology like apple pay, while on the go.
After the personas were constructed, we focused towards synthesizing the above research into designs that could positively impact the donation process. We kept three core tenants in mind: usability, credibility and mobility; how easy it was for the user to donate, how the charities’ credibility could be easily established with the user, and how quickly the donation can be completed and transferred into the charities account.
We started out with a ideation phase, where we brainstormed different solutions to simplify the donation flow, thinking about specific UI components that would be more effective, and different content forms that would be more immersive.
From the ideative session, we combed through the notes to discuss ideas that we thought were the most meaningful and would demonstrate the most impact on the user. Themes such as larger donation buttons, and building on existing effective design metaphors rang throughout. The next step was low-fidelity sketches so we could lay out the basic information architecture. The intention was to stick to pencil and paper first to first test out which different architecture would create the best experience for potential users.
Once architecture was finalized, and basic components agreed upon, we set about implementing the designs into Figma, a collaborative online prototyping tool, in order to quickly prototype our ideas. Below are some of our early iterations of the proposed donation flow.
After numerous rounds of prototyping, and collaborative design, we believed that the below would be the most effective donation flow for mobile charity websites.
Interactive Prototype
Wireframes
Below are mockups from a sample donation flow, using Apple Pay.
