Skip to main content
UI Coach Logo
Back to challenges
Intermediate

Donate to a Verified Local Cause

Design a donation flow that helps supporters understand a charity, choose how funds are used, and keep a reliable receipt.

Mobile, Responsive web

The brief

Understand the problem

Background

People are more comfortable donating when they can verify the organization, understand the campaign, and see how fees and recurring commitments work.

User context

Mei wants to donate to flood recovery in her region. She prefers a verified local charity and needs a receipt for tax records.

Product problem

Donation pages often prioritize emotion over informed consent. Critical details about verification, fees, recurring payments, and data sharing can be easy to miss.

Objective

Create an informed donation experience from cause discovery through receipt and recurring gift management.

What to design

Define the experience

Required experience

  • Cause discovery with charity verification signals
  • Donation amount and allocation choices
  • Payment review with fee and recurrence disclosure
  • Receipt and gift management

Screens and states

  • Cause detail
  • Donation form
  • Payment review
  • Receipt
  • Recurring gift settings

Core user flow

Follow the critical path

  1. 01

    Mei reviews the campaign and the charity's verification details

  2. 02

    She chooses an amount and whether to cover processing costs

  3. 03

    She selects a one-time gift and reviews data-sharing choices

  4. 04

    She pays and downloads a receipt

  5. 05

    She later changes her communication preferences

Product rules

Requirements and constraints

Requirements

  • Separate campaign claims from independently verified organization details
  • Make one-time and recurring choices unmistakable
  • Disclose fees before payment confirmation
  • Allow optional anonymity without compromising the receipt
  • Provide cancellation and payment-method controls for recurring gifts

Constraints

  • Tax deductibility varies by location and organization
  • Campaign totals may update while the user is donating
  • The charity may restrict how funds can be allocated

Reality check

States worth considering

The payment succeeds but the receipt is delayed
The campaign closes during checkout
A recurring payment fails
The donor requests a refund or correction

Finish line

What to deliver

  • Design five mobile screens covering trust, payment, receipt, and recurring gift control.

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Color palette
#1B1A1A
#E9C5B7
#716561
#8B8C8A
#8C848C
Font pairing
LustriaLato

Lustria & Lato

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations