Group 16.png

Cup of Tea

cup of tea


Roles

Lead Designer

UX/UI Design

Product Design

Tools

Sketch/Figma

inVision

Timeframe

Mar - Jun 2018

INFO 498 Class Project

Rapid Prototyping

 
Frame 9.1.png

about cup of tea

Cup of Tea is a class project for a class titled Rapid Prototyping. The premise of the class was to design an app from the ground up with no restrictions as to the type or subject matter of the app.

My team, aptly named Team Espresso, chose to tackle the problem of online dating in the 21st century. Because of how competitive the space is, we had to come up with plenty of ideas to differentiate ourselves from the rest.

 
 
 

00Problem Statement

The dating app space is a huge market because so many people are looking for the promises of what it claims to offer: love, companionship, intimacy, etc. Current solutions are frustrating and borderline toxic due to a large number of reasons outlined below. We intended to design a solution that combats the negatives of current solutions while still being fun and healthy.

Group 14.png
 
 
 
 

In order to find the more embedded issues with the current dating app experience, we dove deeper into the market and did a competitive analysis of some of the more popular dating apps via research methods like surveys, interviews, and real world use. These include Tinder, OKCupid, Coffee Meets Bagel, and Bumble.

01Competitive Analysis

 
 
 
 
 
 

02Feature Showcase

Cup of Tea is a dating app where users will match with one person every 24 hours based on similarities and differences. During this time, couples will partake in a “virtual date”, where they can interact in fun and engaging ways to foster a strong relationship.

 
 
 
 

03User Personas

Our process started with formulating a couple personas to help guide the content of the app. Because of the nature of our dating app, having two personas intuitively worked out as we framed our user journeys around the two of them interacting as each other's match.

 
 
 
 

04Ideation Sketching

During the early stages of the project, we spent a lot of time nailing the user flow of our app first. Some key takeaways here include:

  • Knowing where and when to have the on-boarding questionnaire

  • Putting the sign-up page after the questionnaire and initial match, and not in front

    • This further incentivizes users to sign up because they see their match

  • Added an initial tour off user feedback to explain the survey and match

 
 
 
 

05User Flow + Lo-fi Designs

Based on the above flow sketches, I crafted a finalized digital flow to map out how our users will go through our app. We ran into some trouble here as a team because we couldn't agree on stylistic choices for the lo-fi designs.

For example, our initial name for the app wasn't Cup of Tea, but Blossom (inspired by the University of Washington's cherry blossoms, which were in peak blossom at the time).

Notice how the Sign-up Page is the very last part of the onboarding phase. We found that delivering a match before sign-up led to higher user retention.

 
 
 
 

06User Testing

We ran a total of 3 usability tests with 5 different people each, totalling 15 different users. The 3 tests were all unique in that we tested different phases of the app, those phases being:

  1. Onboarding phase

  2. Questionnaire phase

  3. Interactions phase

 

Some more risks we found through our usability tests include:

 
 
 
 

07Hi-fi Style

Our biggest stylistic change was in the branding of our app. We went from Blossom, a name we thought was too formal and boring, to Cup of Tea. The following is the style-scape I came up with for our new app.

Group 27.png
 
 
 
 

08Final Screens

My final high fidelity screens with a working prototype below. Designed for the iPhone X to stay up to date with latest tech and design updates.

 

 
 
 
 
 
 
 
 

10Reflection

Cup of Tea has easily been the most rewarding design project I've ever had the pleasure of working on here at the UW. Taught by my now mentor, Brian Fling, a veteran in the mobile design space, he always gave us incredible insights that we all took forward into our young careers. 

The biggest takeaway from this entire project has been the fact that designs are living things. They are constantly changing and iterating, for better or for worse. In our case, the three usability tests we ran with 15 people led to so many drastic changes here and there that bettered the app. Without the insights of our testees, who's backgrounds were all over the place, we wouldn't have been able to see obvious pain points and additional features.

Successful final presentation and group photo! (Dave in the middle :D)