Jump to...
BobaQuiz
In a semester-long senior-level design course ↗, my team collaborated with Pearl Fever Tea House to identify areas for improvement. Through in-depth research and concept development, we designed a self-guided exploration quiz to assist both regular and new customers in making decisions, with the goal of discovering and trying a variety of drink options while ensuring a quick and seamless ordering process.
SKIP TO PROTOTYPE ↗Timeline
13 Weeks (May - August 2022)
Contribution Role
UI design
UX reserach
Wireframes and user flows
Interactive prototyping
Tools
Figma
Miro
Google Forms
Adobe Photoshop
Team Members
Raymond Co
Min Kang
Vincent Zhang
001
Context
Problem Discovery
No one ever knows what a UFO is even though it's on the top 10 banner.
- Pearl Fever Staff, from an interview.
Finding a Client
The team secured an opportunity to work with Pearl Fever Tea House ↗, a local bubble tea company with six locations across the ower mainland of British Columbia. Valuing a personalized experience, they are committed to serving high-quality beverages with over 100 drink options and numerous customization possibilities, while striving for consistent and tailored service.
Mapping User Research
Our first step was to understand the client’s audience. The team employed various user research methods to gather qualitative data, with each member documenting findings through notes and photography.
Research Methods
- Ethnography Observation – The team made site visits to conduct participant observations of customers and staff. One researcher also conducted fieldwork as a staff member.
- Interview – We conducted 2 interviews with customers, 3 with staff members, and 1 with the corporate manager.
- Online Survey – A questionnaire consisting of 12 questions about customers' overall experience at Pearl Fever.
- Online Reviews – Gathered user reviews of Pearl Fever to identify areas of concern, including their mobile app experience.
002
Insights
Problem Statement
Lack of menu visibility and readability at Pearl Fever increases customer frustration, causing them to rely on staff and miss personalized experiences.
Early Identifications and Narrowing the Findings
Through research, we identified two key issues: the Pearl Fever mobile app lacked features like payment options, and the in-store menus were difficult to access, causing indirect selections. Although the app was a valuable area for intervention, discussions with the corporate manager highlighted uncertainty about its redevelopment feasibility. Consequently, the team focused on improving in-store menu accessibility as a more immediate and impactful way to streamline the ordering experience.
Understanding the Needs and Pain Points
Customers would back away or tilt their heads up high to read [the menu].
– Pearl Fever staff, from an interview.
Based on my observation, the menu screen above the order counter was positioned nearly perpendicular to the floor, making it difficult for customers to view. We confirmed this finding by asking Pearl Fever staff about how customers typically interact with the menu while ordering.
Customers are often unsure of what to order, ask for recommendations, and sometimes this causes delays when it's busy.
- Pearl Fever staff, from an interview.
Another key finding from staff interviews was that there are frequent requests for menu assistance, due to uncertainty in the menus.
Sometimes, it’s overwhelming to order since there aren't any pictures or descriptions [on the menu].
- Pearl Fever Customer, from an interview.
The in-store menu lacked pictures and featured small text, causing customers to express frustration with the ordering experience due to these issues.
003
Design Process
Framing the Problem Space
How might we enhance the accessibility of Pearl Fever’s menu, providing clearer information and a more efficient ordering experience?
Identifying Potential Users and Their Touchpoints
Drawing from our research findings, the team developed user personas and journey maps to better understand potential users' pain points. This process helped us to identify specific emotions and challenges customers may face during their experience at Pearl Fever.
Uncovering Gaps in the Customer Journey
To further validate our research and explore new findings, a virtual workshop was organized using Miro ↗ and Discord. The session lasted about an hour and 15 minutes, featuring seven activities with three Pearl Fever employees and six customers. The workshop revealed two key findings: first, recurring challenges with menu selections and the ordering process; second, a deeper cause of these challenges, where customers miss out on the client’s core value of offering a personalized experience due to a lack of menu explanations and overwhelming options, which hinder exploration and customization.
Reframing the Problem Space
How might we streamline the ordering process and encourage customers to explore unfamiliar drink options, creating a seamless and personalized in-store experience?
Crafting Design Solutions
The workshop guided us to enhance Pearl Fever's drink selection experience, simplifying the process for those struggling with decision-making or unfamiliar with the options. To explore creative solutions, we engaged in brainstorming activities, avoiding conventional approaches like redesigning the menu or creating physical menus. Several concepts were developed and presented in storyboards I created above.
Converging on the Final Concept
Following a meeting with Pearl Fever's corporate manager, the decision to proceed with the quiz concept was finalized. The manager expressed interest in its low cost, potential benefits for staff training, and ability to simplify the ordering process, while enhancing the overall customer experience.
004
Solution
FOR INTERACTIVE WEB PLATFORM
A self-driven exploration quiz, BobaQuiz, assists in the decision-making process for both regular and new Pearl Fever customers by guiding them through the menu and encouraging the exploration of unfamiliar drink options.
005
Reflection
Final Takeaway and Learnings
This project deepened my UX/UI skills as I designed the entire quiz flow and prototyped everything from the landing page to the results. Working with a real client allowed me to tackle real-world challenges, such as introducing ‘Weekly Special recommendations’ to address the needs of second-time or time-constrained customers, enhancing my ability to balance user needs with practical considerations.
Throughout the process, our team adapted as needed, transitioning from an app to enhancing the menu and creating a quiz. While feasibility constraints, like integrating the online ordering system, presented challenges, I learned to identify unmet needs by trusting the process and pursuing effective solutions. This experience strengthened my collaboration and design skills while honing my ability to create thoughtful solutions that address both user and business needs.