Unite With Ukraine

type
UI/UX Design
Web
INDUSTRY
Non-Profit
YEAR
February 2023
tools
Overview

Unite With Ukraine is a non-profit charity organization that was created to support Ukraine in their war with Russia. The purpose of the organization is to be the main online hub for the war in Ukraine by providing the most up to date news on the war and quick and seamless ways of donating aid. The organization will also provide monthly impact reports and live blog posts from those active in the war to highlight transparency as well as a refugee portal to help those directly impacted by the war.

How can we encourage more donations for a charity organization?
?

Problem Statement

Many people around the world want to help and support the war in Ukraine but are hesitant due to a lack of transparency with charitable organizations

Hypothesis

With monthly impact reports and live blog posts from people receiving the donations, we can provide more transparency as a charity to ensure users feel trust that their contributions are being allocated to the right places

Research

I started off the project by determining key research goals that would help me understand how non-profit organizations can receive more donations.

1

How users interact with charity organizations

2

Determine factors that influence user decision making for selecting organizations to donate to

3

Determine user likes and dislikes about how charity organizations operate

4

Identify the impact the Ukraine crisis has had on users and their stance on the issue

Competitive Analysis

I conducted a competitive analysis on several non-profit charity organizations that donate to humanitarian causes. I wanted to see their user flow of the donation process, how they convey information to encourage aid, and where there can be areas of improvement to encourage more user donations.

Secondary research

I reviewed existing studies on online reservation systems in order to fully understand the potential they can have for improving user needs. Secondary research was also conducted by reviewing information from related articles and case studies to further identify industry trends and user expectations.

I looked over existing websites on non-profit charity organizations to understand their strategies and see where there are areas to be improved upon. I also reviewed psychological studies of users that could impact donation amounts.

Interview & Survey

I conducted an online interview and survey about donation habits and likes and dislikes about charity organizations. Based on my target audience, I interviewed participants who were employed and were of Ukrainian descent.

Problems users face when deciding to make a donation

User motivations for donating to a charity organization

Biggest concerns from users regarding the Ukraine crisis

  • Verifying how their money is spent
  • Transparency, trustworthiness
  • If there is a real impact
  • Desire to make the world a better place
  • Helping those less fortunate
  • The situation and it’s objective’s
  • Tax receipts
  • Escalation of nuclear war
  • Loss of Ukrainian life
  • Russia winning
  • Frozen conflict
  • Destabilization of the EU

59%

Users who indicate transparency as being the main problem they face when deciding to make donations

58%

Users who trust charity organizations to allocate their funds correctly

46%

Users who have contributed to a charity organization in ways other than monetary donations

83%

Users who believe their donations can make a difference in relief efforts for the Ukraine crisis

42%

Users who have been affected by or know someone who has been affected by the war in Ukraine

79%

Users who want to decide which specific area or cause their donations will support

76%

Users who like the opportunity to contribute in various ways, beyond just monetary donations

67%

Users who are interested in donating old belongings or items to charity

QUOTES FROM PARTICIPANTS

"I hate that you can't verify how the money is being spent."
"I hope Ukraine will recieve enough material to push the agressor back into their countries and farther beyond. My biggest fear is that it becomes a continued conflict with Russia holding the war status up which is of course blocking political and strategic decisions for the country."
"I haven't contributed yet but want to, with things like socks or maple syrup. Small things I've come to understand the soldiers need or enjoy."

Project Goals

I outlined the main goals of the project based on the research findings.
Allow users to make a donation quickly with multiple payment options
Allowers users to provide help in variety of ways through different campaigns, donating methods, and social awareness
Provide transparency through reports, blog posts, and statistics on the allocation of donations
Create a responsive site for web, tablet, and mobile

GOAL STATEMENT

Unite With Ukraine will provide monthly reports, statistics and blog posts to highlight transparency and various ways to offer aid through quick monetary donations and different campaigns and volunteering opportunities to encourage more contributions

Value propositions

Personas

I have created a persona based on my research findings who is an empathetic individual driven by the desire to help others. This persona enables me to gain invaluable insights into the user's motivations, needs, and pain points, empowering me to design a compelling and user-centric donation website experience.

User Flow

I created a flow to illustrate the quickest way a user would make a donation on the website.
I created more user flows for different scenarios that could occur when a user is interacting with the app to make a reservation; booking a reservation at a favourite restaurant for a special date, looking up a restaurant the user read about, deciding on a reservation based on a specific cuisine, and browsing for nearby restaurants based on the user's area.
SCENARIO 1
Nataliya heard about the Russian invasion in Ukraine and is very concerned. Nataliya is from Ukraine and her parents immigrated to Canada when she was 8 years old so she feels a deep personal connection to this issue. She visits the website and browses through the home page to look at one of the impact reports. After seeing the transparency of the organization, she decides to make a donation.
SCENARIO 2
Nataliya read some news articles about some casualties in the war in Ukraine. She knows she has a couple of days off based off her nurse work schedule so she decides she wants to volunteer some of her time. Natliya goes on the website to see what campaigns are running and joins a local fundraiser.
SCENARIO 3
Nataliya was having brunch with her friend Sarah where she brought up the war in Ukraine. Sarah decides to help and asks for the website Nataliya uses to donate. Sarah goes on the website and decides to make a $100 donation.
SCENARIO 4
Nataliya's 12 year old daughter Sofia has been hearing awful things about the war and wants to donate to help Ukraine. She visits the site with her mother and they decide on donating an individual first aid kit.
SCENARIO 5
Nataliya is going through news and social media on her phone and keeps reading about the situation in Ukraine. She decides there are some old belongings in her basement she could donate. She goes on the website and locates the mailing address to donate items. She packs up some old clothes and blankets and ships them off.

Information Architecture

Once the main user flow was established I created the information architecture of the app. This allowed for a visual display of hierarchy and clear organization of the content.

CONSIDERATIONS

I wanted to employ several design principles based on the psychological research findings I found and provide different methods of aid to encourage further user contributions:
I applied the anchoring to the donation form, goal proximity on ongoing projects, and the identifiable victim effect through live blog posts of those active in the war. I also incorporated ways to help through volunteering, programs, donating items, and spreading awareness on social media.

Sketches & Wireframes

Wireframes were created for different screen sizes and devices after deciding on a layout from the sketches.

sketches | Home PAGE

wireframes | HOME PAGE (WEB, TABLET, MOBILE)

wireframes | DONATE, PERSONAL DETAILS, CONFIRMATION PAGES (WEB)

wireframes | DONATE, PERSONAL DETAILS, CONFIRMATION PAGES (MOBILE)

wireframes | VOLUNTEER, REFUGEES PORTAL PAGEs (MOBILE)

Branding

The color scheme was an easy choice for me for this project, as I felt it should be the national colors of Ukraine; blue and yellow.

By incorporating the national colors of Ukraine into the website's branding, we honor the country's heritage and communicate a message of compassion and support to those affected by the crisis.

MOODBOARD

Color palette

TYPOGRAPHY

UI Design

I created HI-FI version of all the main pages of the website in various formats

HIGH-FIDELITY | HOME PAGE (WEB, TABLET, MOBILE)

HIGH-FIDELITY | DONATE, PERSONAL DETAILS, CONFIRMATION PAGES (WEB)

HIGH-FIDELITY | DONATE, PERSONAL DETAILS, CONFIRMATION PAGES (MOBILE)

HIGH-FIDELITY | VOLUNTEER, REFUGEES PORTAL PAGEs (WEB)

Usability Testing

I conducted a usability study using the high-fidelity prototypes. I wanted to find out if the main user experience of making a donation is quick and easy to complete. I also wanted to know if there was enough information provided on transparency, mission statements, and volunteer opportunities throughout the site. Research goals were:
The results of the testing provide a comprehensive understanding of the platform's usability and user experience. Below are some key findings:

100%

Users who successfully make a donation within 5 minutes of starting the donation process

80%

User who spent 4-5 minutes browsing the website before making a donation

100%

Users who found there was ample information provided to encourage a donation

100%

Users who found there was ample information provided to show transparency
I made a few changes based on the results from the usability testing.

Latest Prototype

COMING SOON

Takeaways

I learned a lot about charity organizations and discovered several valuable insights to enhance the UX and overall effectiveness of the donation platform.

Integrating donation reports and statistics along with new updates on the crisis situation and impact of donations can promote transparency and trust among users, encouraging them to engage and contribute more actively.

Furthermore, the research shows users want ways to contribute in ways in addition to financial means. Users want to be able to volunteer, fundraise, and donate personal belongs.

Overall, this case study has shed light on the impact of design in fostering empathy to facilitate positive change. Additional features that could be implemented to provide more information and encourage more donations from users include: