An exercise in creating a bespoke solution for a niche market.

Phone mockups with various screens from the app

The problem

Teahouse customers have few opportunities to get suggestions about drinks + customizations.

My solution

Suggest drinks + customizations based on other customers with similar tastes.

Contents

brief

Context

Capstone project for my Bachelor’s. No subject or process constraints.

Deliverable

UI mockup

My role

Sole UI/UX designer

Time frame

September to December 2021

process

Discovery

I conducted an ethnographic study of teahouse (boba/bubble tea) customers ordering drinks, mapping the current state of a typical customer journey.

Current state of customer journey

Current state of customer journey.

User empathy

I centered my problem space on the high friction parts of the journey (yellow dotted outline).

Diagram of the problem space

Primary problem space. Red = high friction.

Customers trying a teahouse for the first-time experience friction because they are unfamiliar with how this teahouse compares to other teahouses they’re familiar with.

The current solution is inadequate. Increasingly, the typical key touchpoint, the order taker, has barriers to recommending drinks:

  • They don’t know the customer’s unique tastes

  • They might be busy

  • They might have a self-ordering kiosk

Distilling a pain point

Customers are unsure which drink to try, and have few opportunities to help them inform their choice.

Goals

  • Customers want to ensure they’re getting a drink they’ll like.

  • Teahouses want to maximize customer satisfaction and retention.

Limitations

Since this is a UI/UX exercise, technical and business constraints weren’t considered. From a more holistic product design perspective, I overlook these limitations during this project.

Product/market fit

Industry leaders of the space, like Square, are generalized and have massive scale to reduce costs. Limiting potential clients to teahouses result in a tiny market.

Client onboarding

Given the deeper integration of this product with a teahouse (vs. other point of sales services), the product requires effective and scalable client support infrastructure and processes.

Network effect

Using data from other client teahouses to provide normalized recommendations requires a certain scale that would be difficult to achieve at first.

Privacy concerns

Customers may be concerned about the privacy of the data about them this service would produce.

solution

Reconciling pain points

I envisioned how a typical customer journey could look if avoidable friction were removed.

Ideal state of customer journey

Ideal state of customer journey.

Showing lower friction of ideal state

Comparison of problem space of customer journey.

Solution 1

Personalized recommendations

"What would I like?"

Teaprint is a database (of teahouse drinks) and recommendation engine (similar to horizontal competitor TrueFit).

It recommends drinks + customizations that a customer would like based on their preferences.

Recommendations are shown whenever a customer has a choice to make.

Solution 2

Recommendations onboarding

"I want something similar to what I like"

First-time Teaprint users can answer questions about drinks they’ve previously enjoyed to be recommended drinks + customizations.

Solution 3

Feedback collection

"I liked x and didn't like y."

Following a purchase, customers are prompted to rate various aspects of their order to inform Teaprint.

They can be incentivized to leave feedback with more accurate recommendations next time and by the business.

Visual design

Selection of UI components

Selected UI components.

Usability testing

I conducted remote moderated testing using Maze with six friends.

Hypotheses

Customers understand algorithmic suggestions

Customers can customize their drinks

Teaprint onboarding educates customers about cross-business recommendations

Key findings

Flows were easy to understand and follow

Customers expect the graph part of the graph selector to be tappable

Teaprint onboarding didn’t do a good enough job at explaining what Teaprint does

Opportunity to provide more crowd-driven reviews + recommendations to help customers make decisions

Iteration

Made graph in the graph selector tappable

Made copy for Teaprint onboarding more concise and clear

Rich reviews + recommendations were not a usability flaw. It would make a more well-rounded solution, but it was out of scope.

results

This project was successful in its objectives: to showcase my end-to-end product design skills for my undergrad capstone project.

Reflections

Flawed contexts

The entire problem space stems from my desires, marring it with the false consensus effect (you are not your user).

I attempt to disclaim this bias by acknowledging the assumptions I make, and ultimately chose to overlook this bias for the opportunity to tackle a problem that I love for my first end-to-end "self-briefed" project.

Usability testing could have provided more precise results if I instructed testers not to “look around the app” (and that they could have the opportunity to do so after the study). ※

Top ↑

Banner graphic background photo by Waranont (Joe)