Improve user experience to search for non-profits and complete donations.
UX Research, UX Design
Americans gave 410 billion dollars in 2017.
On average, donors donated to 4.5 different non-profits
54% of donors worldwide prefers to donate online
25% of donors completing their donations on mobile devices (read more here)
According to a survey conducted by finder.com, 61% of Americans admit to receiving unwanted gifts from just Christmas holidays - resulting in at least $15.2 billion wasted.
What if in lieu of purchasing an unwanted material gift,
people donate to non-profits?
inLieu in a mobile app platform that allows users to donate to 1.6 million different non-profits. They are on a mission to change the way people gift and hoping to divert the unwanted gifts into donations to non-profits.
The goal of the project is to provide a clear and streamlined donation experience for inLieu users, where they can find credible and relevant information regarding the non-profits, and have a transparent payment process.
I interviewed 8 users who has experience donating to non-profits asking the following questions:
What are the users’ current donation habits?
How do the users learn about non-profits?
What do the users consider when donating?
What are the users’ past donation experiences like?
"I consider current events and the impact of my donation when choosing where to give."
"If I can't find important information about the org or if the payment page looks sketchy, I usually won't trust the site to donate."
"I need to know what I’m donating to, have different payment options, and be able to find my payment receipts."
The persona is a representation of a typical inLieu user. Let's take a look at Lisa's behaviors, pain points, and priorities.
Lisa donates to several non-profit organizations and is looking for a better way to do so. She also would like to get more of her friends to get involved, but she is not sure how to do so.
“If I have to spend too much time figuring out how to donate, I would just pick another non-profit.”
31 Years Old | Consultant in NYC
Donate to trustworthy non-profits
Be informed with non-profit updates
Keep track of donation history for personal and tax purposes
Easily access key information about a non-profit
User-friendly interface and payment process
Donation history and tax receipts
Hard to keep track of donations on different platforms
Untrustworthy sites and payment processes discourages her from donating
To gain a better understanding on the usability of the app, I observed 3 users complete various tasks on the app and identifies a few problem areas
Currently users have to go through 4+ clicks in the app before they can filter and search for non-profits to donate to. They do not have the option to explore the non-profits before deciding on who they want to dedicate the donation to.
The top and the bottom of the nonprofit box leads users to different screens.
Nonprofit donation page.
Can access donation info page under "nonprofit".
Nonprofit info page.
No option to go to donation page directly on info page.
Visual Design and Information Architecture
Text were cut off, making it difficult for users to understand the context. Relevant information were separated on the payment screen, so users have to scroll up and down to confirm the charges. Sentences are not aligned.
Text aligned left - cutting off words in the middle
Only 1 option selection is allowed to filter down nonprofits
Nonprofit Info Page
Nonprofit description is cut off when exceeding a certain word count
Text not aligned
No CTA to donate from this page
"Personalize Your Gift" is an option for users to leave a message for the recipient along with the donation, but it's located on the bottom of the page
Payment information are not group together, making it difficult for users to know how much of their money is going to fees, how much they're getting charged, etc
Grey section line under each section title creates confusion on where information should be inputted
Lisa's user journey
With insights gathered from user interview and usability testing, let's take a look at Lisa's journey using inLieu.
Lisa really likes the social feed on inLieu where she gets to see what other non-profits others are donating to
It takes 4+ clicks for Lisa to be able to start searching for non-profits
Lisa clicked on a non-profit hoping to read more about their description, but the app took Lisa directly to the payment page
Lisa decided on a non-profit she wants to donate to, and she wants to cover process fee, but she couldn't tell how much of her money is going to fees and how much she is going to be charged
Ideation and Design
I focused on creating a seamless experience for users to easily search for nonprofits and donate to them.
I decided to add a tab for users to have easy access to search and filter nonprofits
Search bar allows users to type in keyword. Filter allows users to narrow down their search results (see next screen)
Option to select a cause to be taken directly to filtered search results
Each cause option has an icon associated with it. (icons in wireframe for reference only). User can select more than 1 causes to narrow the search
Filter icon shows how many filters are applied in the green bubble
Selected causes are also displayed as buttons where users can delete the filter to update search result
Option to sort by relevance or by alphabetical order
Search results are displayed vertically as a list (instead of horizontal scroll) to increase the number to search results displayed on the screen
Option to add nonprofit as a favorite directly on the page
Nonprofit description where users can click on "see more" to read more if paragraph exceeds display word count
Added nonprofit cause category for users to be able to explore other nonprofits within the same cause
CTA to direct users to donation page
Moved nonprofit and option to "donate as anonymous" to top of page
Select who to donate on behalf of on payment screen and text box to add personalized message
Donation amount selection, fee options, cost breakdown grouped together for users to get transparency on the amount they'll be charged
Added options to pay with card, Apple pay, gift card
Grouped relevant information together and added lines between each section to create clear visual break. Modified font size and colors to create a more modern and clean interface
A reminder on where to find payment confirmation is shown along with a thank you message
Social sharing with a click of a button
Next Steps & Takeaway
For next steps, I would conduct additional usability testing on the new design and explore other ways to make the search home page more personalized and interactive.
I love the mission of inLieu to divert some of the consumerism to creating more impactful changes. For this project, I looked for areas that I can redesign that could make the most impact within the time limitations. Through user interviews and usability testings, I truly got to identify users' pain points and narrow the scope of the project. I want to thank Liz Kentor for giving me the opportunity to work on this exciting project. I've gotten a lot of insights on how a beginning stage start-up operates.
As I wrap this project experience up, I hope to continue to design mission-driven products to help human move towards conscious and impactful decision making.