Simplicity & Focus: Designing The Simplest Donation UX

My Last Project in the Corporate World

Scan to try the app (inside UAE)

A Simple product is a product stripped of complex UX

The donations Mini Program for Botim was my last contribution to Botim as a fulltime product designer before going back to freelancing 😇. I hope it achieved its purpose and helped people make donations with ease this Ramadan and will continue to do so now as well.

Challenges

1. Simplify donation flow: a mini program that helps people donate in the quickest and simplest way possible.
2. Design a charity GPT experience for an even simpler donation flow & drive user attention to it in a way that doesn’t harm the original UX.

1. A Simple Donation Flow

I was lucky to work with a great PM for this project. Fred has some real skill in understanding business & user needs and translating them into designer-friendly and very detailed PRDs. So when he delivered the donations PRD we had a crystal clear vision of the goal:

A mini program that helps people donate without the usual struggles: finding a trusted charity, making a single or scheduled payment & managing donation history.

So to achieve that, I did a quick round on existing donation flows in competitor apps to get some insights:

competitors donations flows

Designing the donations homepage introduced a new challenge, it needs to look good and have a logical flow no matter how many campaigns we may have at any point in time and it needs to allow space to add more features like recurring donations in the second phase.

So here I went through a few iterations and these were the final two:

The thinking that led from iteration on the left to the one on the right

So what happens when a user taps Donate? it is really simple and we had some good things going for us:

1. Name is pre-populated since they are a Botim user.
2. We have an integrated payment gateway, users may use their Botim wallet balance, saved cards or apple/google pay or a new card to pay.

I took it a step further in design so that:

1. Amount is preselected with the option to change with one tap.
2. Frequency is a radio button with all options visible and one-time is preselected for least friction possible.
3. Email is optional and comes last since it’s not necessary for the interaction but it is good to have business-wise.

So technically, all user needs to do is select or enter amount > pay.

It can’t be simpler…or can it?

2. Charity GPT — Chat to Donate

What is simpler than filling a form? texting of course. CharityGPT came to life as a special flavor of BotimGPT for charity. So the user does not need to look at the screen to understand the form, they just talk to the Bot instead.

We had two challenges in designing the GPT:

1. Perfecting the conversation flow to make it as short as possible, allow user to chat more within the donation topic but steer the conversation logically back to it when user takes unexpected tangents.
2. This GPT would be the first of its kind, so we had no idea how people would react to it; we wanted people to see it and use it but we did not want it to distract users who prefer the manual way.

I designed multiple variations and finally landed on the this one:

1. Entry animation + small animated element to draw user attention to GPT → BG is white so animation is the only contrasting & attention grabbing element in the design, it does not throw users off the manual donation flow but is clear enough in case they want to try it.
2. Since it’s a charity GPT, the first prompt is automatically generated: “I want to donate” to reduce work on user side.
3. Campaigns and donation amounts are clickable buttons so no need to type anything from user side unless they want to donate a custom amount or ask about the campaigns.

Other options I had for GPT entry point:

Both did not make the cut; we were concerned users would miss the manual option altogether if we put this much focus on the GPT so I came up with the very simple one shared above.

The best thing about being a designer is that no two projects are the same, every problem requires thinking and a new approach and this is why design is the best job in the world 🩷.

And so my journey in the corporate world ends. I hope this project marks a good ending and sets me up for a good new beginning.

Watch it light up the sky 🌟

Botim on Instagram: "💙 Did you know you can make a difference in one minute? ✨ Chat with…