Boba Beacon

End-to-End Mobile Application · UX/UI Capstone Project

A boba-first discovery platform that helps users quickly find drinks and shops based on cravings, dietary needs, proximity, and vibe.

PROJECT OVERVIEW

The Problem

Boba drinkers struggle to confidently choose where and what to order. Menus are inconsistent, dietary options are unclear, and discovery often requires bouncing between Yelp, Google Maps, and social media. This creates decision fatigue—especially for users with dietary restrictions, time constraints, or specific cravings.

The Opportunity / Solution

Boba Beacon reframes boba discovery around cravings, transparency, and context. Instead of long reviews, users can filter by flavor, dietary needs, location, and shop vibe, while vendors can clearly showcase menus and ingredients in one centralized platform.

Outcome (Conceptual)

The solution reduces search friction, increases user confidence in ordering decisions, and creates a balanced ecosystem that benefits both boba drinkers and small shop owners.

RESEARCH

Key Insight: Boba choices are emotional and situational, but existing tools prioritize ratings over cravings, dietary clarity, and trust.

Research Goals

• Understand how users currently discover boba shops and drinks

• Identify pain points around dietary transparency and menus

• Learn how mood, context, and aesthetics influence decisions

• Explore vendor challenges around visibility and trust

Secondary Research – Competitive Analysis

I analyzed platforms including Yelp, HappyCow, Eater, and OpenTable. While each excelled in specific areas (reviews, plant-based filtering, editorial content, reservations), none were designed specifically for boba. Dietary filters were inconsistent, menus lacked standardization, and vibe-based discovery was fragmented across social media.

Primary Research – User Interviews & Research Synthesis

I conducted moderated remote interviews with four participants representing frequent boba drinkers, users with dietary restrictions, busy parents, and socially driven explorers. Insights were synthesized using affinity mapping to surface recurring behaviors, frustrations, and needs.

Key Themes

• Cravings change based on mood, weather, and time of day

• Dietary transparency builds trust and reduces anxiety

• Users want fast, low-effort discovery while on the go

• Shop vibe and visuals strongly influence choice

• Vendors want better ways to communicate what makes them unique

DEFINE

Definition Focus: Clarify how to support craving-based discovery while maintaining dietary accuracy and usability for both users and vendors.

Personas

Three primary personas guided design decisions:

• The Social Sipper: Trend-driven, visual, discovery-focused

• The Busy Parent: Health-conscious, time-constrained, clarity-focused

• The Vendor: Small business owner seeking visibility and trust

Problem Framing

Key problem areas included personalized discovery, ingredient transparency, and cultural connection. These were reframed into questions such as:

• How might we help users find drinks that match both cravings and dietary needs?

• How might we reduce search fatigue during on-the-go moments?

• How might we help vendors clearly communicate what they offer?

Key Task Flows

• Customer flow: finding a gluten-free milk tea using filters and drink details

• Vendor flow: adding a new drink with dietary tags and photos

DESIGN

Early Exploration & Mid-Fidelity Work

I explored layout and structure through mid-fidelity screens in Figma, prioritizing filtering clarity, menu transparency, and simple navigation. A sitemap and task flows ensured alignment between customer and vendor experiences.

Usability Testing & High-Fidelity Design

I tested a mid-fidelity prototype with five participants, focusing on:

• Filter discoverability and confidence

• Dietary tag clarity

• Vendor menu creation flow

• Visual hierarchy and accessibility

Iterations

Based on testing, I:

• Added confirmation cues (“Show Results,” “Reset”) to filters

• Simplified and clarified dietary tags (e.g., “No Added Sugar”)

• Removed high-trust claims that were difficult to guarantee

• Improved contrast, spacing, icon sizing, and alignment

• Clarified vendor navigation and profile switching

• Added shop context to menu item previews

FINAL SOLUTION

The final solution centers on:
Helping users make faster, more confident boba decisions through craving-based discovery and transparent menu information.

Key Features

• Flavor and dietary filters (fruity, creamy, gluten-free, dairy-free)

• Clear ingredient and dietary labeling

• Location-based discovery with map integration

• Shop vibe indicators and visual previews

• Vendor tools for menu management and dietary tagging

Screens & Interactions

Users can quickly filter drinks and shops, preview menus with confidence, and decide where to go without endless scrolling. Vendors can easily update menus and highlight what makes their offerings accessible and unique.

IMPACT & REFLECTION

Results & Outcomes

• Reduced decision fatigue by consolidating discovery into one platform

• Increased user confidence through clearer dietary transparency

• Created a scalable system supporting both users and vendors

Key Learnings

• Small clarity cues significantly impact user confidence

• Dietary transparency is emotional as well as functional

• Designing dual-sided platforms requires balancing trust, accuracy, and ease of use

Future Opportunities

• Test customer checkout and ordering flows

• Expand vendor analytics and draft-saving

• Explore social sharing and collections

• Conduct accessibility-focused testing

WHY THIS MATTERS

Boba Beacon demonstrates how a culturally aware, research-driven product can turn everyday decisions into inclusive, confident experiences—supporting users, small businesses, and community connection at the same time.

↑ Back to Top