Live

Live

Live

SUPPORT A LEARNER

SUPPORT A LEARNER

SUPPORT A LEARNER

A safe and secure platform for individuals to support learners through Edustipend.

A safe and secure platform for individuals to support learners through Edustipend.

A safe and secure platform for individuals to support learners through Edustipend.

The "Support a Learner" initiative by Edustipend is designed to empower learners by providing a secure platform for individuals to contribute financially. These donations enable Edustipend to offer essential resources such as laptops, data stipends, and coverage for course or certification fees, helping learners achieve their educational goals.

Duration

6 months

Duration

6 months

Platform

Web

Platform

Web

Role

UX Designer

Role

UX Designer

Deliverables

UI & UX Design

Deliverables

UI & UX Design

Mobile Design

Web Design

Product Design

Project Overview & The Problem

Potential donors are often hesitant to give online due to concerns about financial security, a lack of transparency about where their money goes, and an inability to see their tangible impact.


"How might we design a donation experience that overcomes these barriers, fostering trust and encouraging contributions to support learners effectively?"

Project Goals

  • For the User: To create a simple, secure, and transparent donation process that provides a clear understanding of the impact of their contribution.Support a learner landing page

  • For the Business: To establish a new, sustainable revenue stream for learner support, increase donor conversion rates, and enhance Edustipend's brand as a trustworthy, community-focused organization.

My Role & Design Strategy

As the lead (and sole) designer, I owned the end-to-end design process. This involved defining the project's design strategy, collaborating with the research team, architecting the user experience, and executing the final UI.

I collaborated closely with the program manager to align with business goals and with the lead engineer to ensure technical feasibility, acting as the primary advocate for the donor's needs at every stage.

Project Goals

  • For the User: To create a simple, secure, and transparent donation process that provides a clear understanding of the impact of their contribution.Support a learner landing page

  • For the Business: To establish a new, sustainable revenue stream for learner support, increase donor conversion rates, and enhance Edustipend's brand as a trustworthy, community-focused organization.

My Design Strategy Was Guided by Three Core Principles:

Build Trust Through Transparency: Every design decision should prioritize clarity and openness. Users should never have to wonder where their money is going or how it's being used.

Reduce Friction, Maximize Intent: The path to donation should be as short and simple as possible. Remove every unnecessary step, field, or decision to prevent drop-off.

Connect Emotionally to Impact: Go beyond the transaction. Create moments in the experience that connect the donor's financial contribution to the real-world story of the learner they are helping.

Discovery & User Research

To ground our design in real user needs, we conducted moderated usability tests with eight potential donors who had previously donated to similar causes. I created an interactive prototype in Figma to simulate the donation flow.

On the sign up page where the donor's data will be collected, there should be an option for donors who want to stay anonymous since some persons wouldn’t want to reveal their identity (a toggle option can be used in this case).

About the donation image, 3 users said they’d like to see some other images showing some donations that have been made, or an animation.

Users also said they’ll like to know where or what is done with their donation.

Users said they won’t feel safe inputting their card pin on the app

a man smiling for the camera
a man smiling for the camera
a man smiling for the camera

The Donor Proto-Persona: "The Cautious Giver"

Based on initial research, I developed a proto-persona to represent our target user. This helped to focus our design decisions on a clear set of motivations and pain points.

Motivations: Genuinely wants to make a difference; feels a sense of social responsibility; is moved by personal stories.

Pain Points: Worried about online scams; frustrated by long, complicated forms; skeptical about how much of their donation actually reaches the cause.

Needs: A secure payment process; clear evidence of impact; a quick and easy way to contribute.

Key Insights Synthesized from Feedback

I used affinity mapping to cluster the raw feedback from the user sessions, which revealed four critical themes:

Anonymity is a Must-Have: A significant number of users valued privacy, stating they would be more likely to donate if they weren't forced to be publicly identified.

Direct PIN Entry is a Deal-Breaker: Users immediately lost trust when asked to input their card PIN directly on the site. This was universally seen as a major security risk.

The "Why" Drives the "What": Donors were highly motivated by seeing the tangible outcome of their contribution. Abstract goals were less compelling than concrete examples (e.g., "₦50,000 = one data stipend").

Social Proof Builds Momentum: A static page felt lifeless. Users wanted to see that others were actively donating, which creates a sense of a living, trustworthy campaign.

Ideation, Design & Iteration

I began by mapping out the user flow to visualize the path from intent to action. This exercise was crucial for identifying points of friction in the original concept and demonstrating the value of a simplified approach to stakeholders.

Original Multi-Step Flow (High Friction)

This initial concept broke the process into multiple screens, creating several points where a user might lose momentum and abandon the donation.

Wireframing & Key Decisions

My initial hypothesis was that breaking the donation process into a multi-step "wizard" would reduce cognitive load. The low-fidelity wireframes reflected this, with separate screens for personal details, donation amount, and payment information. However, usability testing on the interactive prototype revealed critical flaws in this approach:


  • Increased Perceived Effort: Users felt the process was "too long" and "had too many clicks." The friction of navigating multiple screens outweighed the benefit of focusing on one task at a time.

  • Major Security Concerns: The most glaring issue was the modal asking for a card PIN directly on our site. Every single user in the test flagged this as a major security risk and a reason to abandon the process. This validated our "Direct PIN entry is a deal-breaker" insight in the most direct way possible.

  • Fragmented Experience: By separating the donation amount from the payment details, we missed the opportunity to create a single, cohesive moment of contribution.


This direct, qualitative feedback was the catalyst for a major architectural pivot. It became clear that user trust and a feeling of effortlessness were the most important metrics for success. This led to the decision to abandon the multi-page flow entirely in favor of a single-page donation form that offloaded all sensitive payment actions to a trusted, third-party processor.

Revised Single-Page Flow (Low Friction)

The final design consolidated all input fields onto one screen and offloaded the sensitive payment step to a trusted third-party processor. This simplified the journey, increased security perceptions, and added a valuable post-donation engagement loop.

Wireframing & Key Decisions

The final single-page design. This reduces cognitive load and keeps all essential information in one place, a direct response to our goal of simplifying the process.

The Solution: A Trust-Centered Donation Experience

The final design translated our research insights into a cohesive and compelling user experience.

Streamlined Flow with "Simulated Impact": I consolidated the donation form, privacy controls (anonymous toggle), and impact visualization into one seamless view. The "Simulated Impact" feature provides real-time feedback as a user types in a donation amount, creating an immediate emotional connection and answering the key user question: "How does my specific donation help?"

Designing for Radical Transparency

To solve the trust deficit, I designed a public "Transparency Dashboard." This features a real-time feed of donations, tracks progress toward the campaign goal, and celebrates the community of contributors. This commitment to openness became a cornerstone of the project.

Incorporated visuals and real-life stories from beneficiaries to create an emotional connection and boost donor confidence in the initiative.

The Landing Page: A Narrative of Trust and Impact

The landing page was architected as a top-to-bottom journey to address every potential user doubt and build confidence at each scroll point.

The Hook (Hero Section)


The page opens by immediately connecting the user's potential action to a human story, placing a beneficiary testimonial next to the donation form. This juxtaposition of emotion and action serves to capture intent instantly, while the form itself, placed "above the fold," directly adheres to our "Reduce Friction" principle.

Building Credibility (Social Proof & Partnerships)


The sections for "Recent Donors," "Our Impact" (with tangible metrics), and trusted partner logos work in concert to build immediate credibility. This directly addresses the "Social Proof Builds Momentum" insight from our research, showing users that the platform is active, legitimate, and supported by reputable organizations.

Answering the Core Question (Impact Visualization)


The "How much can I donate?" section is a direct translation of the "The 'Why' Drives the 'What'" research insight. It visually breaks down donation amounts into tangible, real-world outcomes (e.g., "₦10,000 can get a learner a monthly data stipend"). This transforms an abstract financial transaction into a concrete, understandable act of support.

Proactive Transparency (Selection Process):


The "How We Select Beneficiaries" section was included to proactively answer a key question that arose during early exploration: "How do I know my money is going to someone who truly needs it?" By clearly outlining the selection criteria, we reinforce our core principle of "Build Trust Through Transparency" and alleviate a potential point of hesitation for cautious donors.

Streamlined Flow with "Simulated Impact"


I consolidated the donation form, privacy controls (anonymous toggle), and impact visualization into one seamless view. The "Simulated Impact" feature provides real-time feedback as a user types in a donation amount, creating an immediate emotional connection and answering the key user question: "How does my specific donation help?"

Ensuring a Seamless Mobile Experience


Recognizing that a significant portion of potential donors would access the page via mobile devices, a responsive design was a critical component of the strategy. The goal was not just to shrink the desktop site but to create a mobile experience that felt native, fast, and equally trustworthy.

  • Single-Column Simplicity: The multi-column desktop layout was refactored into a clean, single-column flow for mobile. This ensures readability and a natural top-to-bottom scrolling experience, keeping the user focused on the core task of donating.

  • Prioritizing the Core Flow: The entire donation-to-share journey was optimized for mobile. The single-page form is particularly effective in a mobile context, where users are less tolerant of long, multi-page processes. The success and share modals are designed to be clear and concise, perfectly fitting the smaller viewport without feeling cluttered.

Designing for Radical Transparency

To solve the trust deficit, I designed a public "Transparency Dashboard." This features a real-time feed of donations, tracks progress toward the campaign goal, and celebrates the community of contributors. This commitment to openness became a cornerstone of the project.

Gamifying Engagement with a Referral System

To expand the campaign's reach, I designed a referral system and leaderboard. This empowered beneficiaries to become campaign ambassadors, creating a powerful viral loop and fostering a sense of shared community ownership.

How It Works:

Beneficiaries create unique referral links and share them across social media or directly with their network.

For every successful donation made through their link, the beneficiary earns points.

These points accumulate and qualify the link owner for laptop stipends, providing an added incentive to actively promote the campaign.

The Donation Success Screen


Upon a successful transaction, the user is presented with a clear and reassuring success modal. This design serves two purposes: first, it provides immediate positive feedback, confirming that the donation was processed correctly. Second, it acts as a strategic fork in the user journey, offering two distinct paths for post-donation engagement: "See recent donations," which reinforces the transparency principle by linking to the public dashboard, and "Share on social media," which encourages the user to become a campaign advocate. This crucial step transforms a simple transaction into an opportunity for deeper engagement and community building.

The Social Sharing Modal

To make sharing as frictionless as possible, this modal appears after the user clicks "Share." It provides one-click access to major social platforms and includes a pre-populated, editable message. The message is crafted to be personal and impactful, containing a direct link to the donation page and a campaign hashtag (#Edustipend). By removing the effort of crafting a post from scratch, this feature significantly increases the likelihood of users sharing the campaign with their networks, directly supporting the goal of expanding reach through a viral loop.

the referral system

To boost social media engagement and drive donations, we introduced a Referral System as part of the Edustipend campaign. This feature empowers potential beneficiaries to generate and share personalized referral links with friends and loved ones, encouraging them to contribute to Edustipend.

How It Works:

Beneficiaries create unique referral links and share them across social media or directly with their network.

For every successful donation made through their link, the beneficiary earns points.

These points accumulate and qualify the link owner for laptop stipends, providing an added incentive to actively promote the campaign.

IMPACT of the support a learner campaign

The "Support a Learner" platform was a significant success, validating our user-centered and trust-focused design strategy.

0

Successfully Raised

The platform successfully raised ₦5,356,660, establishing a vital and sustainable new funding stream for learner resources.

0%

Increase in Conversion Rate

We achieved a 48% conversion rate from a user visiting the page to completing a donation

0%

User Trust and Satisfaction

Post-launch qualitative feedback was overwhelmingly positive. Users consistently highlighted the ease and speed of the single-page process.

LESSONS LEARNT

Simplicity Drives Action

Simplifying the donation flow to a single page significantly reduced potential drop-offs. A straightforward design ensures users stay focused on the primary goal.

Feedback is Invaluable

User testing provided insights into design pain points and areas for improvement. Early feedback helped ensure the final product was both user-centered and intuitive.

Transparency is the Best Conversion Tool in Fintech

While a simple UI is important, it was the explicit commitment to transparency (the dashboard, the impact simulation) that truly built the trust needed for users to convert.

Next Steps & Future Opportunities

Recurring Donations: Introduce a feature for users to set up monthly donations to create a more predictable revenue stream.

Recurring Donations: Introduce a feature for users to set up monthly or yearly donations to create a more predictable revenue stream.

Do you have an idea you would love to bring to life?

LET'S TALK.

Do you have an idea you would love to bring to life?

LET'S TALK.

Do you have an idea you would love to bring to life?

LET'S TALK.

© 2025 Ubon Udonkang. All Rights Reserved.

© 2025 Ubon Udonkang. All Rights Reserved.

© 2025 Ubon Udonkang. All Rights Reserved.

Create a free website with Framer, the website builder loved by startups, designers and agencies.