Helping orphans find families
Change One Life - Ukraine is the Ukrainian charity organization that creates video profiles of children in orphanages, so the prospective adoptive parents can find them faster. This organization changes the adoption process in Ukraine and totally disrupts the old bureaucratic system. They made video profiles for over half of all Ukrainian orphans, and they also provide informational support for adoptive parents.
Overview
Like any non-profit, it operates with the support of donors. So one of the key design goals was to help the organization streamline the donation process and be clear about who they are and what they are doing. We had to understand what motivates people to donate and what information they need in order to make this decision. We also kept in mind that the website serves different types of users with different needs and goals, so we had to find a balance to help each of the personas get what they needed.
Business goal
Increase donations to support the organization and help parents find relevant information.
Role and duration
Volunteer UX design lead. I worked with the founder, developer, and content designer, from research to development.
July 2018 - January 2019
Research
Quantitative research
To kick off the research, we looked at the data we already have to understand what people do on the website. Some interesting findings:
60% of visitors use a mobile phone;
The second visited area (after video profiles) is blog posts, but it also has a very high failure rate.
One of the least visited areas is “video advices.” It was important to understand because the team already invested enough resources that unfortunately did not bring expected results.
Very few people reached the donation page.
Based on these findings we decided to optimize for mobile more, invest in quality content, and improve the donation experience.
Qualitative research
One of the most important research questions is who the people that use this website and how we can help them to make smart decisions?
We identified 4 types of users:
Prospective adoptive parents (Ukrainian and foreigners).
Current adoptive parents (Ukrainian).
Donors (Ukrainians, foreigners, businesses).
Foreign adoption agencies.
Each of these types has different goals and needs different information. For example, prospective Ukrainian parents should be able to search for a child and understand the adoption process and the steps they need to do. They also need educational resources and might also want some encouragement and inspiration from success stories.
For this phase of design iteration, we wanted to understand what information the donors need to make a donation and what motivates them. I looked at Nielsen Norman Group research on donation usability, made competitive research based on successful charity organizations, and conducted interviews and usability studies.
Exploratory interviews and usability study
Five potential donors had a scenario: imagine that your friend asks instead of a gift for his/her birthday to make a donation to a particular charity, and gives you this link. Looking at this organization's main page, what do you think they do? Where on the site can you donate money?
What information do you need to make a donation?
Results of the initial research:
5/5 could not fully understand what the site is doing.
5/5 understood that the website is related to children and adoption, but they were not sure how.
4/5 could not immediately find the button Donate.
5/5 wanted to know what the money will go.
Research recommendations
Based on our findings, for this phase, we decided to focus on improving a few areas of the website:
Information architecture: simplify the structure and reduce the number of unnecessary links and categories.
Landing page: be as clear and concise as possible about “who, what and how”: mission, goals, achievements. Also provide straightforward paths to the most important sections: video profiles and how to help the organization.
Donation page: improve donation form, explain how donations will be spent, and give information on alternative ways to help.
“About us” page: who we are, why should you trust us.
Improve video loading: we discovered that the loading speed of the short videos about children takes a lot of time, and it’s almost impossible to watch them from abroad. We decided to try compressing the videos before loading them into the server and use CDN (content delivery network) to improve the viewing experience for different parts of the world.
Ideation and design
Our research findings gave us plenty of insights for taking the new direction in design. We wanted to serve different personas, but at the same time make these experiences clean and not overwhelming. The new designs also tried to follow the existing visual style, such as color and typography. We also added font hierarchy and new visual patterns, such as using hero images for the main pages.
Information architecture
A few problems I discovered about information architecture:
The top navigation is pretty heavy: it has seven L1 groupings, donation button (separately), language selection, phone number, sign in, “favorite” video profiles. This amount of information fits 1280px resolution but not smaller sizes.
Seven L1 grouping + donation buttons confuse users, they don’t know where to go.
Most of the L1 groupings have a menu with L2 pages. On mobile, it’s even harder to navigate them.
L1 groupings are not the most frequently used or the most important to communicate the value of the website.
As a team, we did a few rounds of card sorting to discuss how we can improve the information architecture based on feedback from the users and analytics that we have. We tried to streamline navigation and focused on how it can serve different types of users.
View before and after in a higher resolution.
Landing page
The new landing page focuses on answering a few main questions:
What are the organization mission & goals?
What are the results of organization actions are?
How can one support the organization?
What is the value for adoptive parents besides video profiles?
What do adoptive parents say about it?
We also decided to show a section with recent blog posts for Ukrainian- and Russian-speaking audience (not translated to English right now) to test if this can impact engagement.
Donation page
The goal of this page is to provide different ways to donate without overwhelming with the options, give a clear explanation on how the money will be spent, and tell about other ways to support the organization, such as engaging as a business or even share on social media.
About us page
The previous “About us” section had a few links in the top navigation. We decided to remove them from the navigation and have a single overview page about the organization and provide links to more details, such as who the team is and documentation about organization legitimacy.
Responsive design
We know that 60% of the users access website on a mobile, so all the new pages were designed with responsiveness in mind. We focused on three breakpoint: mobile (320px-639px), tablet (640-1279px), and desktop (1280px+).
View before and after in a higher resolution.
Iteration
I tested the new designs with another five users. The script was the same, and I also created two versions of the landing page: one option with a generic hero image, the second one had a collage with kids’ portraits, who looking for families.
5/5 understood the purpose of the website.
4/5 understood what the organization does (one participant did not read the text, and made conclusions solely from the images).
5/5 immediately found the “Donate” button.
4/5 understood how the money will be spent.
5/5 chose the variant of prototype No. 2, with portraits of real children.
Development
Currently, a few new designs are implemented:
I also work closely with the developer to create new page templates for the content management system and align the styles. Another design and development challenge is to set the payment system and make the payment process smooth and straightforward. We’re also testing compressing the videos and applying content delivery network, and so far this dramatically improved the loading speed.
Future and retrospect
The qualitative research and data provided a lot of insights that we can implement and test in the future:
Applying design thinking on the organization level to help the organization and families meet their needs.
Creating a system for birthday fundraising campaigns.
Continue improving other areas of the website, such as video profiles’ search and resources for parents.
Monitor analytics to uncover more insights and the impact of the redesign.
During this phase of design and development, I learned what people care about when they donate their money. It’s really important to provide clarity, enough details, and guide them through the website by presenting clear options and paths. I also learned the challenges of operating a charity: we have to rely on each other and build a trustful relationship with partners in order to move this project further. The path is not always fast and straightforward. But by the end of the day, everyone works towards the same goal: helping children and their future families to find each other. And every minute worth it.