Kit Coffee
ROLE
PRODUCT DESIGNER
Enhance usability and visual clarity
Users can access past orders with a single click
1
Understand what a user prioritizes when browsing and selecting a product to order
what are a user’s ideal features when it comes browsing online ordering and making a purchase decision
2
Discover common obstacles and pain points that hinders a user’s online ordering experience
users feel challenged when the routine lacks convenience, ease of use, personalization and affects their time
3
Gain insight on how online experiences contribute to a brand’s relationship with users
users are more likely to have positive engagement with reward systems, seasonal items, live tracking, etc.
I decided to pursue user research in the methods of survey and card sorting for this study since Spotify is a widely popular and used platform, creating space to pursue more data-driven results and insights.
Our research participants answered these questions about their online ordering experience
SURVEY RESULTS
"How satisfied are you with the ease of use of online ordering for coffee shops?"
"What online features do you find most valuable when ordering coffee online?"
"What frustrates you the most when ordering coffee online?"
USER INTERVIEW RESULTS
DESIGN GOALS
Through my research, I began to turn my objectives into design goals. I was seeking to integrate methods that would create a cohesive brand experience along with boost website traffic to online ordering.
LOW FIDELITY WIREFRAMES
BRANDING
Utilizing Kit Coffee’s existing branding, I transformed it with a mood board and brand style tile to develop reimagined brand identity of soft colors, organic shapes and inviting imagery.
UI KIT
Utilizing Kit Coffee’s existing branding, I transformed it with a mood board and brand style tile to develop reimagined brand identity of soft colors, organic shapes and inviting imagery.
Usability Testing
A GAP IN VISUAL IDENTITY
PROVIDING DIRECTION
Imagery and Clarity
By including imagery, shapes, icons, and color to serve as contrast, I was able to provide more clarity to a specific shop’s location for online ordering.
This page additionally included a call to action for the menu, giving users an opportunity to explore.
WHAT IS A CATEGORY?
Influencing Choice
I transformed existing features into the new visual layout, prioritizing information architecture and product offerings.
Reviewing the original menu, the organization method could be repetitive, as customizations were offered as their own individual item. For example, there is latte (hot) and a latte (cold) selections. This would extend unnecessary scroll time and choice overload.
A VANILLA LATTE, PLEASE
Meeting User Preferences
Reviewing the original order customization, options were offered to change the original offering. For example, if a user selected “Latte (Iced)”, the customization additionally offered buttons for “No Ice” or “(-) Ice”, changing the order to a hot latte. In addition, there was extra copy to buttons like “(ADD) Vanilla”. These options made customization take more time and create confusion.
I included images of the order along the way, to better visualize the order for the user’s engagement.
ARE WE THERE YET?
Check Out, Order Tracking, and Location
Refining the existing features, I added a call to action for directions for the user to initiate google or apple maps.
When it came to the order pick-up and live tracking, I utilized icons to better communicate the information. For example, there is an icon of a car to demonstrate the user’s drive to the location.
