Meet people who
inspire you

Who is Coffee Meets Bagel

Coffee Meets Bagel was launched on 2012, our mission was to create the best dating service for women. Since then, we’ve made over 2.5 billion introductions, kicked off 112 million chats and created more than 50,000 happy couples in long-standing relationships. According to Survey Monkey Insights, Coffee Meets Bagel is one of only three dating apps that has more female members than male.

Each day at noon, men will receive up to 21 quality matches – known as “Bagels”. They will either like or pass the Bagels. Then, Coffee Meets Bagel will curate the best potential matches for women among the men who expressed interest. Women will choose who gets to talk to them among quality men who have already liked them. That’s right! This means no more frustrating guessing games.

My Role: Product Designer

Duration of this Project: 4 months

DLS Design Motivation and Goals

  • Goal: New Design that helps Peak Seekers discover others and present them in an inspiring way


  • Extensible design system shared by all CMB designers (Design Debt)

  • Consistency across Material + iOS to enable faster testing

  • Shift Material from follower platform to innovation platform

Female Persona 

Yoga at Home

Eva Tompson

28 years old female

Salary: 50k-70k



Lives in New York

Yoga Instructor


  • Have a meaningful conversation on a dating app

  • Find people who inspire her

  • Share her true-self and empower herself

  • Go on a date


  • Loses motivation to use dating apps

  • None of the conversations go anywhere

  • Does not understand the mechanics of dating app

  • Everything is complicated and not simple to meet others

Male Persona

man 6

Jim Matson

32 years old male

Salary: 50k-60k



Lives in Toronto

Retail Manager


  • Go on a date with a nice woman

  • Get answers when he messages people on the app

  • Increase his connection rate

  • Express his uniqeness and stand out 


  • Does not know how to start a conversation

  • None of the conversations go anywhere

  • Feels like he can not stand out 

  • Scammers/ Fake accounts

Understanding The Problem

IMG_6058 (1).jpg
IMG_5954 (2).jpg
IMG_5953 (1).jpg
Screen Shot 2018-12-13 at 12.03.18

Understanding User Story & Brainstorming on Solutions

Screen Shot 2018-12-13 at 11.56.21
Screen Shot 2018-12-13 at 11.56.11
Screen Shot 2018-12-13 at 11.55.42
Screen Shot 2018-12-13 at 11.56.04

Rapid prototyping and User Interview to Validate Pain Points

  • How would you use this app?

  • What other dating apps do you use and which one is your favorite?

  • What is the most frustrating thing about online dating?

  • How do you define success in dating apps?

  • How do you start a conversation?

  • How do you feel about this design?

  • Where would you click on this design, and what do you expect to happen?

Screen Shot 2018-12-10 at 5.00.24 PM
Screen Shot 2018-12-10 at 4.53.18 PM
Screen Shot 2018-12-10 at 4.55.17 PM
Screen Shot 2018-12-10 at 5.02.00 PM
Screen Shot 2018-12-10 at 4.54.54 PM
Screen Shot 2018-12-10 at 4.52.02 PM
Screen Shot 2018-12-10 at 4.53.37 PM

"I always go back to profile to take a second look at it after the connection/match happens. It helps me to have something to talk about, it is really difficult to stay original"

"Pictures are really important to me, if I do not like how you look like there is no way I would click on that "Like" button, after that I look at the stats for height and religion"

"I feel like there are so many choices out there and I can not simply choose, or maybe online dating has made me picky, and shallow."

"I want to be able to express myself with custom questions or personalized my profile, I think all the profiles look the same and everyone love hiking, I usually do not know what to talk about."

*Highlights of user studies

The Old Design on Andriod and iOS


The Problem Summary

Online dating is hard, time-consuming, and full of distractions. No one stands on a spot light and every dating profile looks the same. It is very difficult to get a connection for an average looking guy and our challenge is to make online dating less busy and more about you.


The Solution

Removing all the unnecessary distractions from the user by a fresh design that makes the product focus on the users only and not the UI. 

Adding a comment overall feature that enable users to start a more meaningful conversation from the start.  

02.18 - All Hands.jpg

Starting With Moodboards 

I have started with moodboards to refine Coffee Meets Bagel's new look. This was great for stakeholders to imagine different possibilities and where we wanna take the visual language. 

Bright & Fresh_ Moodboard.png
Moodboard_breathable and sophisticated.p
Perfectly Imperfect_Moodboard.png

*Competative Landscape of color

Competitive landscape.png


perfectyly imperfect.png

Product Principle

  • Be Simple

    • this is a love story between our members – our UI should be clear and
      Dating can be messy. Our app shouldn’t be. We minimize visual noise to maximize focus on people. At the end of the understandable, but our members should be the

  • Be Real

    • Our app helps members present their best, most authentic selves because that’s what we believe creates a quality connection. If our design has done its job, first dates will feel like meeting someone you've known for ages.

Color System

Screen Shot 2018-12-13 at 1.55.30 PM.png
Screen Shot 2018-12-13 at 1.58.46 PM.png

Redesigned Onboarding

Screen Shot 2018-12-13 at 2.01.26 PM.png
phone number.png
gender selected.png
7 Day attendance.png
7 Day attendance Copy.png

Profiles That Stands Out

Suggested Copy 4_2x.png
  • More context to see in the new profile

  • Less focus on colors/ header and more focus on the profile picture

  • Consistent pattern between iOS and Android design

  • The floating action buttons will communicate to the user that the profile is scrollable

  • During the heat test the users who sent the message were 25% more likely to connect

Receive Side of Comment Overall

suggested-Recieve  _2x.png
  • Having a consistent system to communicate matches

  • If a person already liked you the icon turns into a mesasge instead of the heart

  • During the heat test, users who have received the message were 15% more likely to connect

Discover What Matters

  • After our research we brought back discover filters that the users needed on this page

  • We have designed a new color system for discover page to lower the confusion between Taking in Discover and Liking in Suggested

  • During the user survery we have collected the filters that users cared the most about