Lollicup Online Order Concept Design

From August to September of 2023, I created an online ordering feature to the current Lollicup site. This allowed Lollicup to compete with other bubble tea shops that also offered online ordering.

I conducted user interviews, competitive analysis, created the personas, mapping the user flow, conducted usability testing, wireframing, prototyping and iterated all designs in this project.

The Challenge

Limited Online Ordering

With Lollicup being a beverage store, you would think that customers would have the option to conveniently order online. However, only a select few Lollicup locations offer online ordering. This forces customers to order their bubble tea in-person or through a food delivery service if their desired location doesn't offer online ordering.

The locations that do offer online ordering have outsourced their online ordering systems to evil third-party food delivery services (e.g., Square, DoorDash and UberEats). When businesses outsource any online ordering system, the third-party vendor takes a portion of the business' profit. These limitations cause Lollicup to not have as much revenue as their competitors in the bubble tea business.

The Solution

A Lollicup Branded Online Ordering Webapp

I created the Online Ordering flow that included the following screens:

Home page with clear CTA
Store Locator
Improved beverage menu
Order Review
Checkout
Order Confirmation

The Final Prototype

Positive Outcomes

✅ Decrease in Questions from Boba Tea Drinkers

At first, test participants had questions about the “signature” tags and lack of dietary/allergen restrictive-related tags. After cutting all confusing UI elements and adding more accessible design elements, participants were able to understand the Ordering flow without any question.

✅ 100% Task Success Rate

After two rounds of usability testing, the final prototype design led to all testing participants being able to successfully order a customized Strawberry Sunrise drink.

View Figma Prototype