Role

UX Researcher

Maker & Stitcher

Visual Designer

Methods

User Research

UX Analysis

Wireframing

Prototyping

User Testing

Duration

1 Week

Tools Used

Figma, Figma Mirror, Adobe Photoshop

The Task at Hand

During a 1 week design sprint, Nadia Diaz, Max Tagesen, and I were tasked as a team to improve the donation process for an already existing or imaginary charity. With a common interest in fighting climate change, we decided to redesign the donation process for the Rainforest Alliance.

Rainforest Alliance

The Rainforest Alliance is an international non-profit organization with a mission to create a more sustainable world by using social and market forces to protect nature and improve the lives of farmers and forest communities.

Their mission is to create a more sustainable world by using social and market forces to protect nature and improve the lives of farmers and forest communities.

In 2019, fires in the Amazon destroyed over 2.24 million acres of forests.

Why Climate Change?

Climate change affects nearly every aspect of our lives and the lives of millions of species. With irreversible effects and increasing pressure, the time to address climate change is now.

Why Rainforest Alliance?

We believe that the Rainforest Alliance mobile browser lacks empathetic storytelling within their Information Architecture and User Interface, which may limit the users potential donation and overall engagement with the organization.

Why Mobile Web?

We learned that mobile donations have increased 205% in the past year, making this a great opportunity to improve the current platform.

Research

After conducting user interviews, we synthesized the collected data into pain points, motivations, and behaviors.

Within these categories we found important themes including pain points such as “users are unaware of the impact their money makes” which correlates to the motivation “people like to know who they are helping” which relates to the behavior of “donating to causes they feel connected to”.

Pain-Points

• Unaware of the impact of their donation

• Confusing donation process

• Lack of payment options

Motivations

• Gratification from donating

• Wants to help those in need

• Likes to know who they’re helping

Behaviors

• Donate to causes they feel connected to

• Popular payment method is credit card

• Typically donates every month

Assumptions

• The current donation process could be improved to increase donations.

• Donors tend to donate more when they know where their money is going and who it is helping.

• Donors will donate more once the current donation process has been improved.

• Donors tend to donate more on their mobile device.

Our Goal

Our goal was to provide a stronger connection between the user and organization while streamlining the donation process in order to increase awareness and donations.

Hypothesis

We believe improving the storytelling aspect during the donation process will increase consumer awareness on the impact of their donation. We will know we’re right when we see a 10% increase in recurring donations.

How might we…

Persona

To help us better visualize the current process and create an effective redesign, we decided to look at the process from John Stewarts life.

The current donation process on a mobile web browser does not allow the user to empathize with the cause and issue at hand. We found that there was no call to action on the landing page, and the “Donate” button was hidden and difficult to differentiate from other buttons.

We also found the text on page prompting potential donors to donate was excessive and generic, not informing donors where their money was going and how it was helping.

Below is the flow of their current donation process.

Our donation process in Action

For the redesign, our team decided to add a bright yellow “Donate” button on the hero video banner for the donor to easily see when they land on the page.

We rearranged the information architecture on the main page, allowing users to understand the purpose of the charity and the important message they are trying to convey.

We also made current projects easier to find allowing donors to donate directly to certain projects.

A profile page was also added so users are able to see the impact of the donations and how their money has helped save rainforests.

Click below to see the prototype in action.

Constructive

• The thank you message is not specific to the chosen donation project

• The spacing throughout the website was tight

• Better language could be used for select headers

Positive

• A user immediately donated to the Rainforest Alliance after testing the prototype

• Users felt they could connect with the brand aesthetics and interface

• The photos and color told the story and helped donors empathize with the cause

• Users felt as though they were well informed of the impact of their donation

• Donors liked to see what projects they contributed to

Design Decisions

As a team, we chose to abide by Rainforest Alliance’s existing design language; including their typography, colors and logo.

When it comes to the design, we restructured the information on the home page to develop an immediate connection between the user and the organization.

We highlighted key information invoking empathy through the use of color and font. We also chose an empathetic approach with the UI by implemented images that users would instantly connect with.

By streamlining the donation process and providing more information to the user, we are able to ensure the user is engaged and invested throughout the process. We also introduced multi-directional scrolling to organize information and add an interactive element.

By implementing new methods of payment, we were able to stay up to date with current trends, and we were able to effortlessly allow users to contribute.

Project Brief

The project includes developing a digital solution to allow consumers to easily access information on sustainable alternatives to regular household products that would otherwise require a substantial amount of time to obtain.

The project objectives include improving access to information on sustainable alternatives to household items. The project would allow users to maintain the majority of their lifestyle, while not compromising on the environment to the same degree.

The target audience is Canadian Citizens aged 18-35 wanting to make a sustainable change in their life.

During the course of the design sprint, we learned a lot as a team.

We learned that…

• Photos can deeply enhance the story

• Users appreciate consistency

• Color can significantly impact how a user feels

• A GIF is very minimal and effective way to captivate a users attention

Some next steps include:

• Email marketing to encourage users to view their profile and engage within the community

• Offering donors tangible incentives for donating

• Granting donors livestream access to current projects as well as a 24 / 7 livestream from cameras in the rainforest