BobaStraw
01
Research
02
Strategy
03
Graphic Design
04
UI/UX Design
A Refreshing Take on UI/UX Design
BobaStraw, a thriving local bubble tea café, recognized the need for an online presence to complement its growing success. Eager to enhance customer engagement, the company was seeking to create a website that showcased its diverse range of bubble tea flavors and beverages and integrated a newly introduced rewards program and point system. ArtVersion worked with the growing company to design and develop a bubbling user experience that would help elevate their business objectives, but also provide the company with a website as lively as their drinks.
A Vibrant Design Language
To embody BobaStraw's vibrant aesthetic, ArtVersion created a language that popped with lively colors and dynamic shapes.
This strategy was purposefully chosen to captivate users, instilling excitement and a welcoming feel from the moment they land on the website. The design's rounded elements and user-friendly navigation echoed the brand's lively personality, creating a cohesive visual narrative.
ArtVersion developed the website with WordPress CMS that included custom HTML coding for animations along with CSS for other pertaining stylistic choices. Prioritizing both aesthetics and functionality, image optimization was key to showcasing the drinks' tantalizing appeal through vivid imagery, while ensuring accessibility through embedded alt-tag implementation. Additionally, the website's navigation was methodically structured to guide users smoothly toward online ordering or beverage customization, optimizing the digital user journey to mirror the inviting and lively atmosphere of BobaStraw's physical café.
UI Screen Designs for Mobile Applications
ArtVersion extended its collaboration with BobaStraw to include the development of a mobile app, working closely with BobaStraw's internal development team.
The focus was on creating a user-friendly experience, simplifying the process of navigating the menu, placing orders for pickup or delivery, and processing payments. ArtVersion crafted the UI screens and design elements, precisely certifying they were prepared for seamless integration into the app by BobaStraw's developers.
While the design language of the website was carried over to maintain brand consistency, it was adapted to a more streamlined version suitable for mobile use. The simplified design approach allowed users to easily interact with the app, enhancing their overall experience with BobaStraw. The collaboration resulted in a mobile app that was an intuitive and efficient tool for engaging with the brand.
Logo Redesign
Building on a simple logo, ArtVersion refreshed BobaStraw’s logo design to align seamlessly with their refreshed brand ecosystem. The design team repurposed the star motif from the previous logo, embedding it within the company name and enhancing the star's design for a more pronounced effect. Specifically, the graphic design team positioned the star on the "o" to evoke the image of tapioca pearls, a nod to the famous chewy beads found at the bottom of their bubble teas. The star was further reimagined to appear fuller and plumper, emulating the texture and form of tapioca. This logo redesign, with its charming aesthetic better resonated with BobaStraw’s diverse yet predominantly young customer base. It played a pivotal role in strengthening brand recognition across all touchpoints.
The Outcome
The website development and logo redesign transformed BobaStraw from a local bubble tea café into a brand with the appeal and sophistication of a franchise.
The vibrant, energetic core of the brand attained a playful yet polished logo, which extended this cohesive design language across all platforms—website, mobile app, and physical branding materials—ArtVersion elevated BobaStraw's market presence. The successful designs allowed the local bubble tea to cater to their ever-growing customer base.