Vibe Check

Problem Space

We all know that dating apps have a lot of problems. It’s difficult to come up with a good set of photos, writing a bio is often harder than writing an essay, and there can be some pretty creepy people on these platforms. 

But one of the most important functions that dating apps have is to help people go on first dates.

Unfortunately, swipe-based dating apps are not very good at this. Dater profiles rarely have enough information to convey personality and signal romantic compatibility. This lack of information also makes it difficult to start a conversation with a match. So most of the matches on these apps just stay as matches, never to develop into something more. 

So we have a problem here. We know that these apps are now the most popular method of dating, according to a recent study from Stanford. We also know how important it is to get to know someone in person through body language and non-verbal communication. Yet dating apps are not able to get more people to connect in person. 

‍
‍Research Insights

Our team interviewed 10 online daters within our social circle between the ages of 18-30 and learned about their experiences with online dating. Here are some early insights that we gathered:

• Most online dating matches don’t turn into first dates
• It’s hard to know what other people are people are looking for
• Values, goals, and personal interests are important information to know before a first date
• Engaging conversations are rare on dating apps
• Some dating app users want to know a lot about their matches, while others just want to meet up in person
  ‍

These insights helped us validate our original hypothesis. We now knew how difficult and frustrating it can be to get on a first date with someone using an online dating app, and we learned about some specific pain points and needs that dating app users have. 

‍
‍Landing on the Solution

Problem Statement: “How might we increase the match to date ratio for dating app users so that they can go on more first dates?”

Explanation of the Solution

Our team decided to take a different approach and pretend that we’re actually a team within one of the major dating app companies. We were really curious about how we could solve this problem within an existing app ecosystem that is used by billions of people around the world across several different dating apps. 

Based on our early research, we knew that we had to somehow gather more information from dating app users. But the problem is that no one wants to add more information to their profile. Both bios and prompts are already frustrating to fill out.

Eventually we landed on the idea of adding a fun personality quiz format to a generic swipe-based dating app. The hook here is that personality quizzes are fun and engaging. But the purpose behind this quiz is to gather important information from users that can then be shared with matches. 

Here is the Vibe Check flow:

1. The dating app user answers 10 questions to discover their unique dater type. 

             a. The first 5 questions help matches gage romantic compatibility. 
             b. The last 5 questions are fun conversation starters.
             c. The quiz generates one of the following four dater types:
‍
                        i. Serious 
                        ii. Casual 
                        iii. “Go with the flow” 
                        iv. “Working on myself”

2. After getting a dater type result, users can select which questions they want to add to their profile. Matches can then see this Vibe Check result section. This is where the name of this feature comes from! Your match performs a vibe check on you to see if you two might be a good match. 

3. New matches are prompted to answer one of the user’s conversation starter questions. This helps spark a new conversation between the match which is an essential ingredient for getting a first date. 

‍

Low-Fidelity Design Mockups

Initial Quiz Design

‍High-Fidelity Design

‍Usability Testing

We tested both our online mock quiz and high-fidelity design prototype with around 10-15 users. Overall, we learned that this quiz format is very engaging and all of our participants were either likely or very likely to use this feature within their favourite dating app. The following insights really helped us iterate on the Vibe Check flow and make it better:

• The quiz format was fun and engaging for most users
• The results page flow could be more clear
• The result description was too short
• The "View Vibe Check Results" button was confusing to most participants.
• All participants saw some value in adding their Vibe Check results to their profile AND seeing their match's results.
• The "opener" question match screen was regarded as fun and was preferred over a static chat page that displayed how compatible a match is to the user.
• Every user is a bit different. Some want more questions, some want less.
• The overall flow of the prototype was intuitive to most users, minus the Figma-related prototype issues.

‍
‍Implementation Details

Technical Implementation
‍
‍Vibe Check is a single page application built with React. We used React Router to handle client-side routing, React Context to handle state management, and Sass as our CSS preprocessor. It is deployed and hosted on Netlify. 

Given that Vibe Check is a new feature that is designed to be integrated into any popular swipe-based dating app, we wanted to build a prototype that would be easily accessible without the need to download a native mobile application. This consideration heavily influenced our decision to build a web-based application. 

Challenges

The biggest challenge when developing this app was the short timeframe, which often meant sacrificing features or writing code that was “quick and dirty” in order to ship an MVP on time.

Working across a vast time zone difference meant that there wasn’t a lot of time for synchronous work. Ensuring that both developers have a shared understanding and matching expectations for how to leverage GitHub for collaboration was extremely important. 

Scalability

Since Vibe Check was built as a demo prototype, many changes to the app’s architecture and implementation would have to be made to make it a full-scale usable application. 

Some considerations to make if the app became more complex might be:

• A state management library such as Redux
• A database to store user data
• Authentication to allow for separate user accounts

Key Takeaways‍

• In the future, taking the time to plan out component structure before beginning to code will lead to a more organized codebase that is easier to work with and clearer to understand.
• Establish your Git and GitHub workflow with your team. 
• Sometimes you just have to write code that works and be satisfied with improving it later.

‍
Future Steps

Vibe Check was never meant to be a standalone application. It is a targeted solution that addresses an important problem within the dating app space. For this reason (and given how busy our team member schedules are) we will not continue working on this project. However, we had a wonderful experience working together on this and learned a lot about our individual disciplines and how to build a product as a team.
‍