CHALLENGE
OneProsper is an organization with the mission of empowering women in arid regions around the world to grow crops while conserving water. They need a way to engage users to donate money to these women to provide them with the necessary resources in order to do so.
SOLUTION
Design a donation system in which users can learn about individual beneficiaries' stories, learn how their donation will provide actionable solutions to their problems, and receive updates on the improvements of the beneficiaries.
MY ROLE
As the lead UX Designer and PM, I was the point of contact with the founder of OneProsper to communicate strategy and meet design deliverable deadlines. I managed the timeline of work throughout the project, mocked up low and high fidelity wireframes, and worked with their development team through implementation
DEFINE
PRO BONO WITH A PLAN
Understanding this was a pro bono project, the first thing I did was create a proposal in order to specify the mission and scope of the project, as well as outlining the site architecture. This was instrumental in understanding the stakeholders needs and holding our team accountable to meet deadlines.
DISCOVERY
UNDERSTANDING THE PROBLEM
Starting with a competitive analysis, we analyzed other non-profit organizations that were centered around engaging users to donate to a specific cause. Our stakeholders emphasized the need for not only an easy-to-use interface, but important it was to honor the stories of the women who were being donated to. We consolidated our research into specific, actionable findings.
USER RESEARCH
At the same time, we began conducting user research with people who had previously donated to OneProsper in the past to gain an understanding of their motivations.
The main questions were about what they wanted to see, read, or understand, in order to donate. What made them connect with the cause? What were the underlying motivations behind that first click to donate?
We consolidated our research into these three main findings:
It is difficult for users to donate to OneProsper on the site as it existed. The CTA wasn't abundantly clear, and the flow for donating wasn't easy.
There would be two big improvements that would compel more people donate: (1) clearly defined metrics that show the impact per dollar, and (2) more compelling storytelling.
Users are mission driven. They love the cause and often feel personally connected. They are more inclined to donate when that connection feels stronger.
IDEATION
DESIGNING IN LO-FI
We begun with low fidelity wireframes outlining our goals for the UI design. Through this process we were in constant communication and collaboration with our stakeholders to make sure we were expressing our design decisions to satisfy their needs as well as the users.
DESIGNING IN HI-FI
Once we confirmed our initial designs, we moved into higher fidelity in order to manipulate color and typography to communicate CTA's and branding. The goals being to direct users to evoke an emotional response to connect with their personal stories in order to donate.
Once the donation layouts were created, we moved into higher fidelity to create the landing page, featured stories, and beneficiary page. It all came together to look something like this:
IMPLEMENTATION
COLLABORATING WITH DEVS
From this stage in our design process, we collaborated with the developers to implement the changes involving architecture and visuals that we defined in these mockups.
Some of the challenges in this phase occurred because we were working with several different devs who were spread out across locations. To overcome this roadblock, we created a similar outline as we did for our design deliverables, that worked as a running progress document to define tasks that were in progress, completed, or needed additional resources.
Our stakeholders were extremely pleased with our proposed solution, and you can view the final product on their live site here!
