The product:

uDonate is a humanitarian aid donation website that prioritises current humanitarian disasters that require financial aid quickly. At the time of undertaking the project in 2022 the Ukrainian conflict was an event of huge importance within global events and the humanitarian disaster so vast that it hadn’t been seen since World War Two.

Project duration:

June 2022

The problem:

A humanitarian website can look like it wants to just receive money, whereas this site needed to tell the story of those who have been affected by this crisis and put a name to those suffering whilst conflict raged in their country.

The goal:

Design a website that could act as a donation portal with a social story to tell and make users engaged with the narrative.

My role:

UX designer leading the app and responsive website design from conception to delivery.

Responsibilities:

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs, determining information architecture, and responsive design.

Humanitarian site - low fidelity Humanitarian website - high fidelity

User research

I conducted a competitor audit to determine the needs and missing opportunities for this type of humanitarian donation website. The findings pointed to the majority prioritising a donation requirement over providing a heartfelt story/narrative that could drive interaction and empathy.

Usability studies also underpinned this thinking and the design was crafted in a way to allow donation but the story being the priority, which in turn provides the user a story that can relate and then when engaged are more likely to donate more to the cause.

 
 

Desktop website

View the Adobe XD Prototype (opens in new window)

Responsive phone website

Accessibility considerations

Clear call to actions

Clear and consistent colours that comply with accessibility design standards.

01

Large buttons

Large buttons that are not difficult to use or to interact with.

02

Call back

A text to speech function is available so whatever communication method  is chosen by the user can best suit their needs or preferences.

03

Next steps

Accessibility

Consider the accessibility further by adding broader functionality to cater for those with sight or hearing impairments.

01

Translation

Currently the site is only in english, so to develop multiple languages within the site (or subsites) so that local cultural differences can be researched and factored in.

02

Enhance

Introduce other ways other than text content to tell a story. Video or an interactive tool need to be researched and explored further.

03