UX/UI DESIGN

Integrating donation content into the Kiva lender portfolio

lender-portfolio-donation-mockup-centered
lender-portfolio-donation-mockup-centered

UX/UI DESIGN

Integrating donation content into the Kiva lender portfolio

PROJECT

overview

MY ROLE

UX/UI Designer

TEAM

Product Manager
Software Engineer

TIMELINE

2 weeks (August 2023)

TOOLS

Figma

MY ROLE

UX/UI Designer

TEAM

Product Manager
Software Engineer

TIMELINE

2 weeks (August 2023)

TOOLS

Figma

CONTEXT

Kiva is a nonprofit organization that provides a platform for crowdfunded microloans. In addition to lending, Kiva users have the option to leave a voluntary donation "tip" during the checkout process to help cover Kiva's operating expenses.

We learned from previous research that some lenders don’t know enough about how Kiva works and its current initiatives to feel compelled to donate towards Kiva’s operating costs at checkout.  As a result of this research, Kiva developed a broader donation messaging strategy that focuses on educating users about the organization’s work and initiatives at various touchpoints prior to checkout.

The lender portfolio was identified as one of the key touchpoints in integrating a “donation education moment” as it is often the first page that returning users go to after logging into their account.

CHALLENGE

Integrate a “donation education moment” that highlights Kiva’s most recent initiatives and achievements in the lender portfolio so that users have a deeper understanding of their donations’ impact while also maintaining easy access to important information about their lending and donation activities.

DESIGN

process

RESEARCH

Establishing guidelines for effective donation content

In previous research, we presented lenders with various types of donation messaging for feedback. Based on those findings, we established a set of content guidelines.

1

Focus is on Kiva's achievements, not lender achievements

2

Goal is to communicate the impact of donations, not ask for one

3

Content is bite-sized and standalone

4

Does not distract from the core tasks on the page

5

Language is accessible and free of microfinance jargon

IDEATION

Repurposing existing blog content

Problem
Our top goal was to keep this project lean so we sourced content from existing blog posts.  However, many of my initial ideas for presenting the blog content in a more engaging way created ongoing work for the graphic design and copywriting team.

Solution
The final design simply utilized the existing blog heading and summary line in order to eliminate any need for bespoke copy and graphics. It also included additional copy, "Donations power progress," to better connect the value of donations to the Kiva initiatives and achievements that were being showcased in the featured blog post.

Initial ideas for the "donation education moment"

Frame-52018

Final design of the "donation education moment"

donation-thank-you-4

Adding donation statistics for more context

Problem
It was difficult to find an optimal placement for the donation education moment because the current portfolio did not clearly mention donations anywhere.

Solution
To offer users more context and information about their donations, we introduced a module that displayed users' donation statistics.

Donation statistics module

donation-module

Increasing discoverability of new donation content

Problem 
Wanting to keep the new donation content below the lending insights and borrowers module, the initial portfolio layout buried the new donation content too deep.

Solution
The lending insights module was redesigned to be more compact and prominent and was surfaced to the top. We also removed an underperforming "Recommended borrowers" section to further push the new content up the page.

Changes made to the portfolio layout

Frame-52021

FINAL

solution

Before

before-1

After

after

FINAL

words

NEXT STEPS

Evaluating placement of donation content

In past rounds of research we saw that users often like to navigate to their lending insights first.  Now that it is at the top of the page, will users have a need to scroll down? Will they have a chance to discover the new content at all? Viewing  live user session recordings to see if and how users are engaging with the new content could help answer these questions.

LEARNINGS

Working with resource constraints

An important lesson from this project was the need to foresee the creation and maintenance of new content. Given that we sourced material from existing blog posts, it was critical to design a system flexible enough to accommodate different heading lengths and image sizes commonly found in these posts. We also had to ensure it was lean and didn't create additional work for other teams.