MeetFriends.
New friendship horizons
A simple social app that brings new people with common interests together, forming new friendships in society's rapid digitalization.
MeetFriends.
UX DESIGN CASE STUDY
Making friends after moving to a new location is a struggle of adult life. With the development of offices in more and more locations and the possibility of online work, it is becoming increasingly easier to work from anywhere around the world, allowing us to explore and travel freely. However, this kind of constant change comes with a cost — loneliness. This is especially true after the unprecedented COVID-19 pandemic caused a huge rift in the world's perception of socialization, causing a wave of unforeseen loneliness that has had a lasting impact around the world.
MeetFriends aims to close this gap between like-minded people in the same city and destigmatize the idea of meeting people from a digital interface. After all, humans are social creatures at our core.
TIMELINE
PROCESS SUMMARY
This is an individual case study project that I ideated, researched, and designed using a combination of physical sketching, Figjam, and Figma. The project was completed in the summer of 2021.
This case study takes a rigorous step-by-step approach that focuses on exploratory research, a sketch and mock-up phase, a wireframe stage, and prototyping and testing. After synthesizing all of this data and reiterating, the final design was created.
Friendship starts here...
Discover.
Message.
Show your identity.
See compatibility.
Share ideas.
Follow your interests.
SCOPING THE PROJECT
What's the problem?
According to a survey conducted by Cigna in 2020, three out of every five Americans are lonely, and the number is on the rise. On top of this statistic, people are now moving around more often, as job turnover rates are quicker collectively. There is currently no single popular way for people to meet others online from a friendship perspective.
Who's the competition?
For my competitive analysis, I looked at a variety of products that users typically use to make connections online. Currently, the main competition for the type of app I am trying to create lies in the form of dating apps, because they have a similar goal of having their users form one-on-one connections, and they are much more widely used than other types of meet-up apps like Friender, VINA, or Meetup.
One dating app, Bumble, has created a version called Bumble BFF that is fairly successful because it is an extension of the dating version of their app. Unfortunately, this means that people have to choose between using the dating mode and friend mode, and most of their users still have dating as their top priority. Meetup allows users to find groups that host online or in person events to help users meet people in their local community. After considering this research, I decided that my ideal product concept is a healthy mix of Meetup and Bumble BFF.
EXPLORATORY RESEARCH
What are the pain points?
To understand my potential user's pain points with similar products, I conducted generative interviews with 8 users and supplemented these findings with survey responses from 35 users. From here, I generated a list of the most common answers from each category and translated them into a list of real app interfaces that I could create.
DESIGN REQUIREMENTS
Prioritizing features
Based on my research findings, I created a list of requirements to guide my design and ideation process. I translated the list of features and concerns into 8 different categories of interfaces that I would design and create links between, and began to integrate my ideas with other users's ideas to begin the prototyping phase.
DISCOVERY
A common reason why dating apps are successful is the quick reward and interactivity that a swiping mode provides. Even though my app will have a lot of other features that differ from most of these connection apps, the swiping feature is still a must and will serve as the home page of MeetFriends. From the discovery page, users will be able to see mutual friends, mutual interest groups, and mutual priorities and hobbies.
EASY PROFILE
The profile-creation page is a key feature for putting the user's best self forward when trying to meet friends. To make this process fun and less tedious, the profile set-up will include simple yes or no questions to create widgets on your profile indicating your basic information and a bucket list creation feature so the user can put down some places and events that they want to explore in the city.
PREFERENCES
Part of creating a good profile is deciding what you want from the other party. The preferences interface could include factors like age, distance, interests, and dealbreakers. I also considered an option users could have to fill out a short questionnaire from the preferences page and automatically be matched to one compatible person every day using a machine learning algorithm.
FEEDBACK
One common complaint from the survey was that the people they connected would unmatch with them without giving feedback about what went wrong. MeetFriends will require the person who unmatches to provide some feedback about why they chose to unmatch with the other user, hopefully clearing up possible confusion.
MESSAGING
Direct messaging is a feature on all social networking apps and dating apps, so the feature has been done over and over again. Unfortunately, a lot of these apps don't provide many different ways to interact, so the conversation doesn't always flow. In my app, I plan to start each conversation off with a prompt or diagram of the users' common interests and qualities.
BROWSE
The browse interface will allow users to find events and nearby entertainment and restaurants to add to their bucket lists, as well as connect users with the interest groups that they want to join / allow them to create new ones for their city.
BUCKET LISTS
Bucket lists allow people to keep track of their ideas. When meeting a new person, sometimes it's hard to find an initial activity to get the ball rolling. Therefore, a bucket list feature lets the users find common ground and make hangouts easier to schedule.
INTEREST GROUPS
One feature that I really enjoyed about Meetup was the fact that users could easily find common ground to bond over because the primary feature of the app is based around interest groups. I wanted to integrate this interest group idea and combine it with the discovery page to give users more than one way of connecting with people.
ANONYMOUS
INTERVIEWEE
"I wish there was an easy way to meet friends online that has fun, interactive features, a quick way to judge friendship compatibility, and a method to find common ground."
IDEATION & SKETCHES
Ideating a solution
Based on the list of ideas compiled from the user interviews, I created some preliminary sketches to represent the different interfaces that I thought were crucial to the project. To guide my low-fi prototyping process, I created a flow diagram to better understand the relationships between the different screens.
LOW-FI PROTOTYPING
Proof of concept
Using my flowchart diagram as a guide, I created a low-fi prototype design in Figma for each big feature that I wanted to include, which came out to 8 different primary screens. At this stage, the prototype was a general wireframe without a clear theme or identity to focus on the user experience.
Discovery
Profile
Preferences
Interest Group
Messaging
Browse
Bucket List
Feedback
Results: User testing
My initial prototype was tested with 10 participants in a limited capacity. The goal of this testing session was to evaluate whether users were able to understand the different functionalities of the app and to collect constructive feedback.
WHAT USERS LIKED
Connecting with people in multiple ways.
Users were excited about the ability to find compatible friend matches through the discovery page and the interest group pages.
AREAS OF IMPROVEMENT
Lack of design identity.
Even though my low-fi prototype was a framework and users were informed of this, as a whole they felt like a strong aesthetic direction would greatly improve the user experience of the app.
Creating their own bucket lists.
Users loved the idea of being able to make a bucket list, especially when using the app in a new city. Combining this feature with a friend matching app is something that they had never seen before.
Misdirected profile focus.
Users loved the idea of being able to make a bucket list, especially when using the app in a new city. Combining this feature with a friend matching app is something that they had never seen before.
Ease of creating a profile.
Users thought that the process of creating a profile and setting their preferences was intuitive and easy.
Widget creation.
Users liked the consistency of adding widgets to different aspects of their profile to make themselves appear more unique.
Additions to the compatibility feature.
Users liked the compatibility feature on the top of the discovery page, because they wanted to know at first glance what similarities they had to someone. However, they wished that there were more options to add more information, such as a display of mutual interest groups, general likes and dislikes, and qualities that someone looks for in a friend. Also, creating a specific page for this section would make it more streamlined process to add information to your compatibility chart.
Bucket list needs to be more primary.
Users liked the bucket list feature so much that they wanted it to be a primary feature of the app, potentially as an addition to the navigation bar.
ANONYMOUS
INTERVIEWEE
"I really like the concept of being able to meet people with similar interests and plan events in a new city by connecting with them online on one app."
FINAL DESIGN
Establishing an identity
The average target user for MeetFriends is a fun, adventurous young professional seeking abundant social opportunities in a new city. Keeping this user base in mind, I created a design guide to create a cohesive user interface for the final prototype with a modern take, complete with sans-serif fonts, rounded corners, and bright colors.
Discovering in a new city
Allowing users to discover people in a new city by using the traditional method of swiping was an element of MeetFriends that was both well-received by users and a feature I decided to prioritize. Discover became the first tab on the main navigation bar, serving as a home base for users to go back to when they are ready to begin initial interactions with new friends.
The compatibility bar at the top of the screen allows users to quickly gauge if another user has similar interests and would be compatible as a friend.
The profile info card shows another user's public information, including their name, personal bio, widgets, and prompts & pictures.
The connect / no thanks bar stays in a constant location at the bottom of the screen as the user scrolls.
Compatibility gauge
Current apps that connect people lack a quick way to gauge whether someone would be a compatible connection for them. The compatibility bar in MeetFriends' discover page is guided by the Overview settings page, which allows users to decide what their compatibility bar displays to other users that come across their profile.
Easy access to profile and preferences page.
Users have access to their profile completion percentage, match rate, and number of current friends.
The user has the option to display interest groups, their bucket list, likes and dislikes, and qualities they look for in a friend.
Browse for interests
The browse page connects users with interest groups and bucket list locations in their area. Users can connect with people from interest groups, providing a second way to connect with people other than the discover tab. The bucket list allows users to easily plan events with the friends they meet through MeetFriends, and find events that both parties are interested in.
Browse and search for interest groups and bucket list locations.
The top bar displays popular interest groups near the user. The bottom bar displays the top bucket list locations in their area.
Users can visit different interest group pages and connect with people with similar interests.
Completed bucket list items appear underneath the active list items. Clicking into it shows the person you completed the item with.
The bucket list is broken into categories based on the nature of the activity, and include tags and ratings for easy search.
Interactive messaging
The messages page displays the interest groups and friends that a user has matched with. The top of the general messaging screen shows the interest groups that a user has joined, as well as the friends that the user has not yet begun messaging. On the direct messaging page, the user can see the shared statistics that they share with the other person, including general facts, likes and dislikes, qualities, and interest groups in common.
The top bar displays the interest groups and individual friends that the user has not yet connected with.
On the direct message interface, the user's shared stats with the other user are displayed to prompt conversation.
Friendly feedback
Users have the option to provide feedback for another user when unmatching to give the other user a better idea of why they believe the friendship is incompatible. Encouraging friendly feedback is a good way to keep users accountable for their actions and facilitate self-improvement.
The unmatch button exists on the direct messaging screen.
Users can tag simple key words as reasons that they want to unmatch, as well as write a short answer.
Users can play interactive games with their matches as an icebreaker activity.
MeetFriends.
A simple app that brings new people with common interests together that accomodates society's rapid digitalization.
Congrats! You made it to the end of this page.
Hope you enjoyed coming along for the ride, and I truly appreciate you taking the time to check out my work! You can reach me at amyzh425@gmail.com — I'd love to chat with you.