Role: UX Designer
Timeline: 2 months
Tools: Figma, Squarespace
Juiced Up
The Juiciest Brand on the Block
Juiced Up, a newly established juice cafe nestled in the heart of Austin, Texas, embarked on a journey to transition from a temporary online presence to a fully-fledged digital hub. With a vision to attract customers and establish a solid online presence, Juiced Up sought a comprehensive branding redesign.
Overview
Juiced Up, a new and promising juice cafe in Austin, Texas, faced the critical challenge of relying on a website that hindered its ability to attract and engage customers effectively. Amid its expansion with the opening of a second location, they recognized the urgency for a website overhaul.
The existing site grappled with a high bounce rate and poor analytics, prompting the need for a strategic redesign. The lack of a comprehensive online platform hampered the cafe's potential for online orders and brand visibility, necessitating a strategic redesign to establish a credible and compelling digital presence.
In addition to the website redesign, there was a parallel initiative to redefine the brand identity, including a logo redesign and an amplified presence on social media platforms, such as Instagram.
Business Goal
Increase Online Orders:
-
The primary objective is to boost the number of online orders placed through the website.
Establish Credibility and Trust:
-
Building a credible online presence is crucial for attracting and retaining customers, as they are expanding onto their second location.
Enhance Brand Visibility:
-
The redesigned website and enhanced social media should be bold, young, and vibrant and serve as a powerful marketing tool to increase Juiced Up's visibility among potential customers.
Constraints
-
Lack of high-quality product pictures for all the products they offer.
-
Limited ordering platform for both their two locations: Downtown and BeeCave.
-
Completion of branding and website redesign in less than 8 weeks.
The Question
How might we create a seamless and visually engaging online presence that effectively showcases Juiced Up's diverse juice and food offerings, considering the absence of high-quality product pictures, and ensures a user-friendly experience for ordering?
The Solution
Bold and Vibrant Design
Craft a visually striking and vibrant website design that resonates with Juiced Up's target customers. Utilize bold color schemes, engaging graphics, and high-quality imagery to create an appealing and energetic online environment that aligns with the fresh and health-conscious identity of the brand.
Clear Information Architecture
Develop a clear and intuitive information architecture, enabling users at each location to explore the full Juiced Up menu conveniently. Utilize a tab-based system with distinct tabs for smoothies, acai bowls, toast, and drinks, each featuring categorized groups for easy navigation. Implement a cohesive design strategy that compensates for the lack of high-quality product pictures: the creative use of graphics, icons, and alternative visual elements to maintain an appealing aesthetic.
✷ Discovery
In the initial Discovery Phase, comprehensive research was conducted through stakeholder interviews, competitor analysis, and user surveys. Conversations with Juiced Up owners unveiled business goals, such as increasing online orders, while competitor analysis identified design trends and functional features. User surveys provided valuable insights into customer preferences and pain points, leading to the creation of detailed user personas.
Stakeholders Interviews
Conducted in-depth interviews with Juiced Up owners to uncover key insights:
-
Business Goals: Explored the desire to increase revenue through online orders.
-
Target Audience: Identified primary customer segments, including local residents, tourists, and fitness enthusiasts.
-
Pain Points: Discussed challenges in the current website, such as lack of logo, outdated branding, no distinction of two available locations, and a nonexistent ordering process, among others.
User Interviews
Collected feedback from existing customers through surveys to understand their preferences and pain points.
-
Preferences: Discovered popular juice choices and açaí bowls and preferred ordering methods.
* 85% of users said they prefer ordering online than in-store using DoorDash or UberEats.
-
Pain Points: Identified challenges users faced in navigating the current website.
* Users were unaware of Juiced Up's current website.
* Their first impressions were that it was outdated and doesn't have the option to order online.
Competitor Analysis
Analyzed websites of competitors to identify industry trends and areas for improvement.
-
Design Trends: Explored modern and visually appealing design elements.
-
Functionality: Identified features enhancing user experience, such as direct online delivery and loyalty programs.
Analysis
Juiced Up's original website presented a significant challenge as it existed as a single-page platform with all information cramped onto the homepage. Lacking the ability to facilitate online orders, the website also lacked a distinct branding identity.
The absence of an effective call to action tailored to the business goals of increasing orders transformed the site into more of an informational space rather than a functional platform that could drive customer engagement and transactions. This deficiency underscored the need for a comprehensive redesign to align the website with strategic business objectives.
Juiced Up's One-Page Original Website
Juiced Up Original Website
✷ Planning
With a clear understanding of goals and user needs, the Planning Phase defined specific objectives, aiming for a 30% increase in online orders that aligned with user goals focused on streamlining the ordering process.
The meticulous outlining of features included: detailed nutritional information display, a responsive design for cross-device compatibility, a user-friendly online ordering system, and an aesthetically pleasing website.
Key Features for Juiced Up
Detailed nutritional information display
.png)
A user-friendly online ordering system
.png)
Responsive design across devices
.png)
Aesthetically pleasing website
✷ Design
The Design Phase delved into the visual and structural aspects of the website. Information architecture was refined to ensure clear navigation, and intuitive categories were created for a seamless browsing experience. Wireframes were developed for key pages like the homepage and menu pages, emphasizing featured products, promotions, high-quality images available, and customization options. Prototyping involved user flows and interactive prototypes, facilitating user testing for iterative improvements.
Sitemap
Brand Style Guide
.png)
I create a brand that radiates youthful energy through a vibrant color palette and dynamic tone of voice that resonates with the target youth demographic.
The goal was to create an engaging and relatable connection with its audience, capturing attention and fostering an exciting brand experience.
Wireframes
Juiced Up Sitemap
Wireframes for Menu, Homepage, and Locations
In the initial stages of the project, the stakeholders expressed a preference for users to place orders through ChowNow, leveraging the platform where they already had their products listed, particularly for the downtown location. However, a crucial question arose during discussions: "How will customers from the BeeCave location place their orders?" This prompted a strategic shift, leading to the decision to add the menu for the BeeCave location as well.
I also pointed out that during user interviews, the majority of users expressed a preference towards UberEats. Notably, the ordering platform transitioned from ChowNow to Uber Eats for both locations, ensuring a unified and streamlined online ordering experience across all their outlets. This adjustment addressed the need for inclusivity and accessibility for customers from both the downtown and BeeCave locations, emphasizing a consistent and convenient ordering process.
Picture Dilemma
The initial wireframes included menu pictures; however, the stakeholder-provided images posed challenges—low resolution, off-brand, and aesthetically inconsistent due to varying lighting and angles.
Recognizing the importance of maintaining a cohesive visual identity, I recommended the strategic decision to omit pictures from the design. This approach ensures a unified and professional appearance until high-quality, on-brand images become available.
✷ Testing
Usability Testing
Usability testing played a crucial role in refining the design. I conducted user testing with a select group of users that allowed for feedback on usability, leading to bug fixes and improvements. A/B testing focused on elements like button placement and color schemes to optimize for conversions, ensuring the final design resonated well with the target audience.
Stakeholder's Feedback
Overall, the stakeholder feedback reflected a sense of achievement in meeting the project goals and fostering a positive brand perception. The stakeholders expressed satisfaction with the vibrant and cohesive design of the website, emphasizing its alignment with Juiced Up's fresh and health-conscious brand image. They particularly appreciated the strategic decision to omit product images for cohesiveness, as it contributed to a clean and modern aesthetic.
✷ Final Juiced Up Design
The Redesign
The redesign of Juiced Up's website marks a substantial improvement from its original single-page format. The new design introduces a multi-page structure, allowing for a more organized and intuitive navigation experience. The implementation of an efficient online ordering system significantly enhances user convenience, fostering increased engagement and potential revenue growth.
The incorporation of a vibrant and cohesive brand identity elevates the overall aesthetic, aligning with Juiced Up's fresh and health-conscious image. The redesign not only rectifies the limitations of the original website but also establishes a dynamic and visually appealing online platform that reflects the essence of Juiced Up's offerings and is responsive across all devices.
Juiced Up Final Redesign
✷ Takeaways
✦ Putting the user first helps business goals — When I looked at Juiced Up's original website, it became apparent that challenges in user experience were hindering its potential. The redesign became a solution to these issues, putting a strong emphasis on creating a smooth ordering process, establishing a cohesive brand identity, and enhancing the overall user interface. In UX design, it's not just about making things look good; it's about creating a platform that enhances user experience while strategically contributing to organizational goals.