Hangout
Social app for meeting new people that match your vibe.
Product Type: Mobile-First Community Finding Platform
Role: UX/UI Designer
Timeline: 90 Days
Tools: Figma, FigJam,
Optimal Workshop, Illustrator
Design Challenge
How might we get people who are new in town to meet their
neighbors and get better acquainted with their community?
When I moved to a new city for the first time, I realized how daunting it could be to make new connections and find places that felt like home. Despite living in a vibrant area, I felt isolated, scrolling through social media in search of meaningful connections but coming up empty. This inspired the idea for Hangout—an app designed to help newcomers like me find their footing by connecting with others who share their interests and exploring the best spots in their new surroundings.
The Problem
I saw a gap in the market: While many apps help people meet or find events, none focused specifically on the unique experience of being new to a city.
My goal with Hangout was to create a space that felt friendly, inviting, and geared toward helping users build real connections in an unfamiliar environment.
Competitive Analysis
After identifying the shortfall, I highlighted the need for a specialized app designed to support users moving to a new environment, distinguishing it from traditional social platforms.
Analysis Insights:
-
With a massive monthly active user base each of these platforms offer extensive reach, diverse demographics and a wide range of features but can also be very overwhelming.
-
Findings highlighted the need for a streamlined, easy-to-navigate interface for forming meaningful friendships and focus on hyper-local interactions, emphasizing trust and safety.
User Interviews
User interviews became my compass while developing Hangout.
Early on, I had ideas about what newcomers needed based on my own experiences, but it wasn’t until I sat down with real people—listening to their stories, frustrations, and desires—that I truly understood the challenges they also faced when moving.
Each interview revealed nuances in behavior, emotional triggers, and unmet needs; helping me transform assumptions into actionable insights, guiding the app toward a more meaningful and impactful experience.
Here are some of the questions I asked during the interviews:
-
What was your motivation to move?
-
What was the timeline for the move?
-
What resources did you use for moving?
-
How many people were involved in the move?
-
Were there concerns about the move?
-
What were some thoughts/feelings during the move?
-
How did you feel after the move and once you were settled?
-
What were some ways that helped you get better acquainted?
-
What were some of the challenges you faced?
-
Was the move a success?
"I relocated from a diverse area near the nation's capital to a rural part of New England. There were no major cities nearby and I had concerns about meeting new people and finding things to do."
- Interviewee
Interview Findings:
100% of participants experienced feeling home-sick after moving.
All participants experienced mixed emotions like excitement/anxiety.
3 out of 5 participants moved out-of-state for better employment opportunities.
5/5 frequently used Google searches to find things to do nearby.
Affinity Mapping
Synthesizing Gathered Data
The data gathered from the interviews allowed me to work on affinity mapping and gave me insight into the types of users that would be using
this platform.
Affinity mapping also helped me understand what users expectations were when moving to a new location and what they were truly seeking.
Affinity Mapping Insights:
-
From user interviews and the affinity map, I identified three common patterns and pain points: Meeting new people outside of work was challenging. Finding things to do in a new area was overwhelming and moving expenses made it challenging to stay on budget.
-
I learned about some of the issues movers have faced and the need for an app that safely and effectively allows newcomers to connect with like-minded people in their new area.
POV and HMW
Using Point of View (POV) statements and How Might We (HMW) questions,
I aimed to identify features that best assist users in engaging with methods aligned to their mental models. Additionally, I sought to offer users an approach that is intuitive, easy to use, and not overwhelming.
Highlighted POV:
Shakira is a single mom of two and is new in town. She would like to explore safe ways of meeting other busy/like-minded moms and to ultimately build lasting relationships.
View full list of POVs
Highlighted HMW:
How might we help a newcomer like Shakira meet other busy moms like her and become better acquainted with her new community?
View full list of HMWs
POV and HMW Insights:
-
POV: From the users' perspective, I understood their frustration with massive and overwhelming social media platforms, which often turn promising community-finding tools into sources of stress and anxiety.
-
HMW: My empathy with users highlighted the need for a community-finding feature that provided a simple and safe way to meet people with common interests, explore activities in a new location, and gradually form lasting relationships.
Personas
I explored the wants and needs of individuals relocating to a new and unfamiliar location, then developed personas that captured the unique characteristics of Hangout users.
Developing these personas made me more aware of each user's unique goals and needs. This understanding was crucial, as it showed me how they would interact with Hangout and how it would shape the overall experience with my product.
.jpg)
.jpg)
Persona Insights:
-
Shakira and William (user personas), were based on insights gathered from user interviews, POVs, HMWs, and affinity mapping. Although they lead distinct lifestyles, both were seeking safe, mobile-friendly ways to connect with their new cities and communities. I aimed to seamlessly facilitate these connections and meet their needs.
Information Architecture
Next, I created a site map, user flow and task flows to provide a visual representation of the web structure and the completion of tasks. This helped to understand the organization of content and ensure the product met the needs of users on the platform.
User and task flows for Hangout clarified the thought process, helped prioritize pages, optimize flow, and focus on features and the overall user experience.
Site Map:
Interaction Insights:
-
Arranging the sitemap and flows ensured that I did not miss a step or complicate the task at hand.
-
Creating the site map, user flow and task flow ensured that all information the user was interacting with was valuable and easy to follow.
Low Fidelity Wireframes
When I began developing Hangout, I embraced rapid low-fidelity iterations as a secret weapon. By sketching out simple wireframes and rough drafts, I quickly tested ideas without getting bogged down in details. This allowed me to gather valuable user feedback early on and helped me refine the app’s core experience.
Every discarded idea brought me closer to the solution, and by the time I transitioned to high-fidelity designs, I had already validated the user flow. This process saved time and resources, ultimately leading to a more intuitive and user-friendly product.
Low Fidelity Wireframe Insights:
-
Sketching low fidelity wireframes helped explore design flows and provided a solid foundation before any detailed work took place.
-
They quickly displayed the user experience and helped avoid excessive focus on aesthetics, saving time and allowing for quick iterations and revisions.
User Interface Kit
Component Library
Creating a component library and a style guide ensured consistency, efficiency, and scalability in UI/UX design. These resources helped with speeding up the design process, helped promote collaboration, and maintained brand identity across the platform.
High Fidelity Wireframes
Once the UI components were established, user feedback showed that a welcoming aesthetic and intuitive design were essential.
Feedback also highlighted that the color palette and overall aesthetic harmonized beautifully, with consistent button and input field design, and seamless transitions between onboarding screens.
Usability Testing
After testing the prototype with actual newcomers and developing multiple iterations of the app’s interface, I faced challenges such as balancing simplicity with functionality. However, these hurdles ultimately made the product stronger.
Based on their feedback from the beginning, I realized I needed to validate and make sure that I hit the nail on the head with exactly what they expected from the product.
Usability Testing Insights:
-
The feedback and insights from usability testing helped me understand some key areas that needed a little bit more attention to fulfill the user’s needs.
Iterations
With Hangout, users are guided through a seamless onboarding process that helps them discover people with shared interests and new places to explore.
The personalized recommendations, clean design, and smooth transitions between features make it easy for anyone to dive in and start building connections.
*Enhancing the Login Screen
Branding elements/imagery here
*Form Field Schema
Removed progress bar since there are now less screens.
Added multiple input fields to reduce the number of onboarding screens
*Approaching the Brand from a Fun + Memorable Place
Having the Welcome page appear before onboarding screens received negative feedback during testing.
Welcome page was changed to "You're in!" and was added at the end of the onboarding screens.
Reflections
After launching Hangout, I saw incredible feedback from users who finally felt like they had a tool to help them navigate their new environment. Whether it was joining a book club or discovering a favorite coffee shop, Hangout empowered people to step out of their comfort zone and build a community from scratch.
Through the process of developing Hangout, I learned the power of listening to users and adapting quickly. My commitment to making an intuitive and welcoming platform helped me create something that truly resonates with newcomers, and I’m excited to continue evolving the app to meet their needs in even more meaningful ways.
