Leaf n Cream - Brand + Web Experience
role
website, graphic, ux designer
timeline
02.2024-05.2024
tools
figma, adobe illustrator
Leaf n Cream is a boba store located in Tustin, CA, run by Sam and Teresa. They were looking to refresh the brand of their boba shop in hopes of modernizing their brand. Our goal was to create a consistent brand and website that would better connect their business with their customers.
insights from research
To understand the potential users of the website, I used two different methods to collect user data.
I conducted an observational survey on-site as well as a self-guided questionnaire.
A competitive audit was also created to compare successes in other well-known boba franchise websites.
Students come from the nearby schools to hang out and study.
Most customers are working professionals or regulars
The smallest demographic is newcomers.
researching website structure
Five similar companies were researched as part of a competitive audit to help determine the optimal website infrastructure for Leaf n Cream.
All websites included a home, about, menu, and rewards tab.
A must-have for all company websites is an online ordering system to provide accessibility and increase customer conversion rates.
Depending on the company’s goals, additional tabs were added.
extrapolated pain points
The most common pain points among users were that:
Lack of organization of products creates a frustrating user experience.
Customization of drinks is hard to understand and/or not comprehensive.
The menu is overwhelming and difficult to navigate.
the solution
Based on research insights, goals were reworked to reflect new findings.
Establish a presence with a cohesive brand identity.
Create a website experience specific to the Leaf n Cream customer base.
Rework the menu to increase customer satisfaction with in-store interactions.
outcomes
Menu reorganization:
New sections were added to the menu to help customers make clearer mental connections between similarities and drink categories.
Build Your Own drinks are a unique feature of Leaf n Cream. They were better explained to new customers. Flavors were also grouped in similar categories.
✨ Changes after user testing included adding a key to quickly answer common questions and drink characteristics.
Leaf n Cream’s site map was constructed based on the information gained from research.
You can check out the full Figma file here:
Lastly, based on the owners’ feedback, a cohesive brand was created to bring consistency to the business.
reflection
Creating a website for Leaf n Cream was a huge learning experience for me. I worked with real-world interactions and gained first-hand experience with the people I would be working to help. I learned a lot working with Sam and Teresa to create an experience that suited their tastes as well as find a better solution for their customers. I visited the café in person, changing how my user research was conducted. I interacted with customers and users directly to determine what they thought was important for this brand and gained different perspectives.
💫 Because I was able to communicate with customers firsthand, I received immediate feedback on my questions. The much more open-ended aspect of conversation tested the survey questions I had come up with, and oftentimes, the questions themselves were lacking.
They often lost a purpose as I was required to dig deeper to find an answer that would facilitate my design choices.
I can improve upon my questionnaires by subjecting them to a more rigorous standard, ensuring they answer the questions or problems I want to tackle.
Some parts of this project are private. If you would like to learn more, feel free to reach out!





