Jessie Olson
UX designer

United Neighbors

Where women and children refugees find safe and free housing

Image alt tag

Project Overview

United Neighbors is a platform designed to protect and empower women affected by the Russo-Ukrainian by creating a space where they can find safe housing and supportive communities. This design won first place in the 2022 All-women's, Break the Bias Hackathon.

Challenge

More than 3.7 million Ukrainian refugees are in immediate need of a website that will help them find free and safe housing outside of Ukraine.

Solution

Design a responsive site where refugees can be matched with a host through a resettlement agency or organization.

Scope

This was a five-day hackathon challenge to create a platform that will focus on solutions to challenges that women face.

Deliverables

Market research, user research, UX Design, product branding, responsive site MVP

Details

Role: UX/UI Designer, Client: 2022 Break the Bias, All-Women Hackathon, Tools: Figma, Miro, Canva, Sketchbook

Design Thinking Process

EMPATHIZE

As of May, nearly 6 million Ukrainians have fled their home country due to war.

Secondary Research

To gain more insight into the topic and narrow down the scope, I started by conducting simple secondary research by reading current events news articles as well as past and present studies done focusing on refugees.

In addition to secondary research, we conducted primary research by interviewing Cassie L., a Senior Program Analyst at the U.S. Department of State who works on the Refugee and Missions program. She provided us with insight gained through her experience of working with refugees and resettlement agencies, and the many challenges that come with it.

Key Findings

  • Approximately 90% of refugees are women and children.

  • Female refugees are at a much higher risk of danger when searching for housing.

  • Existing language barriers and cultural norms between refugees and hosts.

  • Resettlement agencies are understaffed, therefore the process is longer when finding temporary housing.

  • Lack of resources for refugees to settle into their communities.

United Neighbors

What are others doing?

To learn more about how other companies approach providing housing for refugees, I knew looking at strong housing platforms from analogous companies could provide innovative ideas for how to tackle this challenge.

Insights:

  • The platform must be safe and reliable.

  • Having videos, different language options, and availability worldwide would reach more users in need.

Building Empathy

I synthesized my learning in the research phase by creating a persona and empathy map for a potential United Neighbors user. These tools summarized my research findings with a focus on human-centered thinking and building empathy with users. I noticed that finding housing as a refugee makes users feel unsure, anxious, and overwhelmed.

Empathy Map

Empathy Map

Synthesizing user needs

From the empathy map, the persona encapsulated my research findings and provided me context into how to approach future decision-making based on the user's goals and motivations when seeking housing. I also created a persona that expressed the host's point of view when offering their home for free to refugees in need of accommodations.

User Personas

User Personas

DEFINE
Feature Prioritization, MoSCoW Method

Feature Prioritization, MoSCoW Method

Prioritize

Armed with the knowledge of what the users expect, what the business needs, and what the competitors do, I used the MoSCoW Method to detail what features the site must, should, could, and won't have.

User task flows

The results of the MoSCoW method allowed me to establish a task flow of the path a user might take to either become a host or find a host. This task flow, followed by a more robust user flow allowed me to build an overview of the pages with a general sitemap. This sitemap was key to keeping the focus of the design organized and optimizing the flow of finding free and safe housing.

United Neighbors
IDEATE
Sketches

Sketches

Lo-Fidelity Wireframes

Once we had the user task flow, we knew that the website would feature four key pages: a home page, questionnaire form, confirmation page, and profile page.

Mid-Fidelity Wireframes

Taking into account the user research and personas, I started with creating low-fidelity wireframes using Figma to visualize the key elements and features of the website.

United Neighbors
Style Tile

Style Tile

Discovering the brand

Research and style tiles were used to create the United Neighbor's brand. The colors, typography, logo, and elements portray a sense of a helping hand with brighter days ahead for Ukrainian refugees. In other words, some much-needed optimism for such a delicate situation.

PROTOTYPE

Hi-Fidelity Wireframes

Using Miro's wireframing tool, I built out the desktop and mobile versions of the four key pages required to either be a host or find a host, including homeregistration, confirmation and profile.

Putting together initial responsive wireframes allowed me to visualize the elements of the site to focus on for the high-fidelity design.

After planning out the wireframes and style tile, the final designs were able to come to full fruition.

What's next?

Given the time constraint of five days, my team and I were not able to conduct usability tests to find user pain points, which would have enabled us to revise the existing designs and make improvements.

While I am very pleased with how the final designs turned out, I would also like to have conducted user interviews and facilitated more user research prior to creating the user personas and empathy map in order to gain a deeper understanding of the users.