During my time as a store manager at Kung Fu Tea, I gained firsthand insight into the company's app and website. My experience as both a barista and manager involved handling customer issues, repeatedly seeing complaints and frustrations among our customers. This led me to believe there was something fundamentally wrong with Kung Fu Tea’s platforms.
Where my UX journey all started
My favorite drink was the Jasmine milk tea half sugar!
Turns out, the app had a poor 3.1-star rating in the App Store. After digging into reviews and speaking with customers in-person, it became clear that there were several major issues that needed to be addressed.
Kung Fu Tea’s outdated digital experience created in-store inefficiencies
Given boba as the core product and the critical role of design in driving customer engagement, a complete UX/UI overhaul was needed.
As users shared their experiences with the app, I conducted market research to compare the key issues they faced. Alongside this I analyzed App Store reviews and synthesized the complaints into four documented areas of opportunity.
Inefficient Ordering Process
Users find it difficult to customize their drinks, including sugar levels and toppings. The design and layout made the ordering process unintuitive and caused friction.
Clunky Menu Navigation
Users struggle to find their desired drinks due to a cluttered and inefficient layout that doesn’t align with the in-store menu.
Onboarding Issues
Users felt the onboarding process was too long and cluttered with unnecessary steps before accessing the app.
Confusing Rewards & Payment System
Users felt that the rewards system was difficult to track, have trouble redeeming points, and navigate the checkout process smoothly.
After identifying key issues, it became clear that the current design needed a usability overhaul. While it offers baseline functionality for customers, several key elements required reworking.
Homepage
Users' main complaint about the homepage is that it lacks sufficient useful information and cohesive usability, resulting in a poor user flow.
✅ Can access basic features of the app like location, rewards, and menu.
❌ Unable to view current location and cart.
❌ UI makes navigation more confusing and not obvious to users.
❌ Inefficient use of space for promotions, advertising, etc.
Menu
Kung Fu Tea's current menu is a clunky experience that makes navigation take longer and more frustrating.
✅ Drinks are categorized based off their type
❌ Unable to view full menu at a glance
❌ User flow takes unnecessary steps
❌ Lack of customizable features like filters and search.
Locations
Users' find that finding other locations is difficult and cannot view them at a glance.
✅ Can change locations
❌ Unable to view other locations quickly.
❌ Doesn't show locations intuitively like nearby or recent.
❌ No map view
Rewards System
Users found that rewards were confusing to redeem in-store and hard to track.
✅ Basic reward tracking
❌ Unable to view earned rewards
❌ No direct way to apply coupon, happens automatically
❌ Lacking visual indicators of reward progression
With our users' challenges in mind, I conceptualized my designs through real use cases and user flows, focusing on typical in-app customer tasks.
Introducing a user-friendly interface that loyal and new Kung Fu Tea customers can use to quickly order their favorite drinks.
One Step Onboarding Proces
New users can join Kung Fu Tea's rewards program by simply creating an account in just one screen. Giving them instant access to the app's deals, menu, and ordering.
Overcoming limited information
The redesigned homepage presents essential details at a glance with a more cohesive layout, improving the display of rewards, offers, ads, and key features.
Optimized Vertical Sorting
A vertical list layout allows users to effortlessly scroll through drinks and view descriptions at a glance.
Categorical Tabs
Organizing drinks by category helps users quickly find their desired options with ease.
Targeted Discovery
Allowing users to search for drinks and apply filters creates a more targeted and efficient experience.
Layered Step-By-Step Ordering
Guiding users through simple choices at each step ensures easy customization and minimizes mistakes.
Checkout Confirmation
A dedicated checkout screen displays the user's selected drinks with full details, allowing them to review their order.
Visual Progression System
Simple progress bar now lets users track their points in real time, showing exactly where they stand and how close they are to the next reward level.
In-Store QR Code
Seamless QR code payment system lets users pay in-store instantly, deducting funds from the app while automatically applying rewards points.
Designing for a company where I was also a barista, manager, and shift lead provided a unique opportunity to bridge both the UX and business perspectives. Managing a team, interacting with customers, and handling operations gave me firsthand insight into daily customer behaviors in relation to their use of our digital platforms. This experience allowed me to integrate real-world problem-solving into my designs, shaping my UX career by applying hands-on knowledge to create more effective solutions.
