Nomad Hub

Designed to help expats meet new people, make friends and find community.

Project Overview

Role

UX|UI Designer

Duration

6 Weeks

Scope

UX Research, Strategy, UI Design, Branding, Prototyping, Testing, Iterations

Tools

Figma, Miro, Optimal Workshop, Whimsical, Lyssna

The Challenge

Every day people move away from home for a fresh start in a new place. As exciting as this change may be, there also comes certain challenges, one of the biggest being loneliness and a lack of friendship and community.

The Objective

Create an online, global community designed specifically for expats to find each other, make connections and build friendships wherever they call home.

Research

According to the Association of Americans Resident Overseas (AARO), at least 5.4 million Americans currently live abroad. Globally, millions of people move abroad each year for a multitude of reasons. With the rise of remote work and the digital nomad era, this number is only going to continue to climb. With such high numbers, I was curious to know what drives people to move abroad and wanted to understand what pain points they experience in the process. A mix of competitive analysis and user interviews helped me dive further into the problem space.

Understanding the User

My goal was to understand the motivations, problems and experiences of millennials and Gen Zers who have moved abroad in an effort to better understand where their frustrations lie. This was crucial in order to define the problem and design the solution.

Research Objectives

  • Understand why people move to a new country.

  • Understand what the experience is like.

  • Understand what frustrations people face with moving to a new country.

  • Understand how people acclimate to a new culture.

  • Understand how people find community and friends when moving to a new country.

Competitive Analysis

With such a large number of people living abroad, I expected there to be a number of resources already available in order to help users with the transition. I conducted a competitive analysis to assess what is already on the market and comparative research to see where there is room for improvement.

The closest competitor, InterNations, claims to have a large expat community, but majority of members appeared to be either professional expats who relocated for business or older expats not within my target market. This was promising as I was starting to see a definite gap in the market for a comprehensive digital solution aimed at millenial and Gen Z expats. I was curious to find out more in my user interviews.

User Interviews

In order to get better acquainted with the problem space in relation to my target market, I conducted several interviews via video call with millenials who have had multiple experiences moving to new countries while in their 20s and 30s.

  • The focus was to hear about the participant's overall experiences, both positive and negative.

  • The goal was to learn what areas were challenging or frustrating before, during and after the moving process.

The user interviews revealed 3 key insights:

  • Participants mentioned feelings of loneliness and noted how challenging it was building new friendships and finding genuine connections.

  • Finding housemates that are good matches can be difficult and adds to the stress of moving somewhere new.

  • Financial concerns with moving to a new country caused large amounts of stress and worry during the process.

  • "I was really lonely for many months when I was there. And I had to just suck it up and kind of start doing things by myself. And then I ended up finding friends through other ways."

  • “If I were to move again it would be a bit harder for me to get into a community because I wouldn't do any backpacking anymore because I'm getting too old for it. So my biggest concern would be meeting people. I don't know how I would be able to meet people."

  • "I do remember housing was one of the biggest challenges as well. Finding a roommate, like a match is pretty difficult. I feel like I was still a bit more lucky but I do know that it is not an easy thing."

  • "The initial waiting for your first paycheck to come through, I remember was quite frustrating, because when you move to a new country, you spend a lot of money upfront, trying to get yourself set up and sorted, and then it feels like an age until you start recuperating all that money back.”

Define

Building User Empathy

My competitive analysis and user interviews provided me with a better understanding of who my users are and what problems they face as expats. In an effort to turn my research findings into concrete visualizations, I created two user personas to help me empathize with my users and understand their needs. Meet our users:

POV & How-Might-We

Now that I could visualize my users and empathize with their issues, I wanted to create a point-of-view statement and “how-might-we question” that would help me clarify the key problem and focus on designing to meet my user’s needs.

The POV Statement:

I’d like to explore ways to help expats find friends, connect with a community and find housemates because they may find it difficult to meet new and like-minded people when others are already established in their lives, social circles and routines, which additionally may make it harder for them to find housemates and contribute to their overall stress integrating into a new place.

The Question

How might we connect like-minded people who have moved abroad and are wanting to make friends, integrate into a community and find housemates in their new location in order to minimize their stress and make their move seamless?

Ideate

Roadmapping Product Features

With my POV and HMW Question highlighting the problem and focusing my attention on my user’s needs, it was time to start strategizing. Keeping my research in mind, I created a Product Feature Roadmap which ranked features from high to low priority and helped inform design decisions. View below or access the feature roadmap here.

Creating Structure

Now that I had my product features ranked by priority, I created a site map which organized the content into pages with an established hierarchy in order to visually represent the layout of the website.

Mapping Out User & Task Flows

With a better understanding of my users, my priority features and the hierarchy of my content, I started sketching out user flows and task flows to better understand how a user would navigate the website, complete various tasks and what they might do if confronted with any potential roadblocks. Below are task flows that show three tasks a user may complete while engaged with the website.

Design

Sketches & Wireframing

Finally it was time to start creating my key screens. I started by sketching out the concepts in low-fidelity, then moved to Figma to create mid-fidelity wireframes. View all mid-fidelity wireframes here.

Branding & UI Design

While brainstorming a name for the product, I knew I needed to keep my research and user persona’s in mind. The idea of an expat, or digital nomad, in search of community led me to the name Nomad Hub.

From there, I created a mood board using my brand keywords as inspiration.

Connection - Finding genuine connection with others through real-life experiences in order to feel fulfilled.

Community - Building a community in a home away from home in order to feel a part of something, a sense of belonging.

Exploration - For those who seek experiences and are curious about the world.

Contentment - The feeling of happiness and fulfillment from living a full life and having meaningful friendships/relationships.

Adventure - For those who want more out of life and are willing to go looking for it.

For color, I pulled from my mood board and came up with my palette:

The palette is inspired by colors found in nature and is made up of warm, earthy tones. The green hues represent a fresh start and growth, which is aligned with Nomad Hub’s values of connection, exploration and building community. The oranges bring out the feelings of sunshine, warmth and happiness. The colors together represent adventurous days hiking mountains or getting lost in the forest.

With my colors defined, I turned my attention to creating my logo. After several iterations, I arrived at my finalized logo, with the U in ‘Hub’ representing a home and overall community.

Building the Prototype

With my branding in place, I brought my wireframes from mid-fidelity to high-fidelity by incorporating my logo, colors, icons and typography. From there, I was able to build the prototype and prepare for usability testing. Have a look below or view the high-fidelity wireframes here.

See it in Action

Getting Started

Users are able to join Nomad Hub by signing up for an account and completing the onboarding process. This helps to build their profile and sets them up for success with finding matches so they can start making connections and integrating into their new community.

Make it Fun

Once they have an account, users can access their profile to make changes and edit their preferences. They can also check on their progress as they go from ‘newbie’ to ‘officially local’ by earning fun badges for completing certain activities, such as messaging a match or registering for an upcoming event.

Chat it Up

From the home screen or community social page, users can access their matches, which are suggested to them based off their common interests, location and preferences. From their, users can explore their matches’ profile and either add them as a friend or send them a message. It could be the start to a beautiful friendship!

Test & Iterate

Usability Testing

With my prototype ready, it was time to test. I conducted a usability test with five participants in order to evaluate the ease of use and navigation and identify any usability issues within the platform. I wanted to understand the user’s overall experience and what they liked or disliked about Nomad Hub, as well as gather feedback for improvements.

Participants were asked to complete the following tasks:

• Sign up for an account and complete the onboarding
• Access and edit profile to have yes for looking for housemates
• Access the community social page from the menu
• Message a match

Success was measured by the following metrics:

• Task success rate
• Time to complete tasks
• Ease of use
• Error rates and issues encountered
• User satisfaction (scale from 1-5)

  • “Overall easy and functional.”

  • “I like the multiple access for signing up and that one was in the top right corner and one on the log in page.”

  • “I think it is a cool platform and useful.

Revisions

The following areas were identified as needing improvement:

• The social page was not easily distinguishable.
• Could use more guided direction via the drop down menu.
• Friends and matches sections on the community page were not easily spotted without scrolling down.

Relocation

The sub-header “Social” was relocated to a more prominent position under the header “Community”, which makes it more noticeable.

Spacing

The search bar, along with the other elements below it, were all moved up to accommodate the lost space. This allows the “Your Friends” and the top of the “Your Matches” sections to be seen first, without the need to scroll.

Consistency

The change to the “Social” sub-header now helps the drop down menu make more sense in terms of consistency and navigation.

The Final Product

Before

After

After extensive research, strategy, design, testing and iteration, Nomad Hub is ready for it’s close up! Check out the high-fidelity prototype and dive into a place where connection is made.

Final Thoughts

Project Takeaways

This was the my first end-to-end UX|UI design project and although conceptual, I grew to really love Nomad Hub and found the process of creating it to be incredibly rewarding and educational.

Some key takeaways are:

  • When possible, aim for a wider research pool. While this project was conceptual for the purpose of learning and practice, in a real-world scenario I would opt to start a project with a wider demographic and research interview pool..

  • Pixel-perfect isn’t always necessary for low or mid-fidelity. When creating low or mid-fidelity prototypes, being pixel-perfect might not always be the most ideal when trying to meet deadlines, although always necessary in high-fidelity.

  • Use existing design patterns to decrease workload. In order to be more efficient, make use of existing design patterns that users are already familiar with and comfortable using.

  • Organization is key. So much goes into the design process and having a well-organized project plan will go a long way.

Thank You!