UX Case Study
Shookit's
E-Commerce Redesign
Explore Shookit’s UX case study to see how our redesign dramatically shifted key metrics: reducing the landing page bounce rate from 40% to 13%, increasing the average cart value from ₪150 to ₪250, lowering the CAC from ₪40 to ₪11, and boosting weekly retention rates by 25%.
Context
Shookit, a fresh produce direct-to-consumer grocery startup, initially used Wix and then Shopify for its online platform. As the business expanded, these solutions fell short, prompting a hasty shift to a self-hosted website. Developed quickly by a novice team, the site was functional but problematic. To address these issues, Shookit undertook a strategic overhaul to improve its online user experience and performance, catering to its expanding customer base.
😫
Business goals
Boosting Returning Users
Enhance the online experience to increase customer loyalty and repeat visits.
Expanding New Customer Base
Improve efficiency in attracting new customers to lower CAC and boost LTV.
Problems
Poor UX Design
The current user interface is outdated, overly simplistic, and confusing, hindering user engagement.
Inadequate Mobile Experience
A lack of responsiveness in the website design leads to subpar usability on mobile devices.
Low Average Cart Value
A limited product catalog restricts the potential for higher-value purchases.
High Bounce Rate
The initial onboarding process is cumbersome, leading to early user drop-offs.
Inefficient Analytics Infrastructure
Assessing & Benchmarking UX
To evaluate and enhance our website's user experience, we employed various methods:
USABILITY TESTING ON TOP TASKS
USER SURVEYS AND FOCUS GROUPS
LogRocket Tracking
Key User Feedback
“I need a larger variety of products so I can complete all my grocery shopping in one place.”
“I’d like a feature to quickly reorder my last purchase without adding each item again.”
“A view where I can add items and simultaneously see a summary of my cart would be great.”
“It would be helpful to have the option to buy items in smaller quantities, like 0.5 kilos.”
Areas of Improvement
Home Address Requirement on Landing
Initial requirement for a home address input creates friction and contributes to a high bounce rate.
Constrained Navigation Bar
Current size and location limit the addition of more product categories, restricting online store expansion.
Checkout flow
Lack of clear progression, endless scrolling, and a cluttered layout lead to a poor checkout experience.
Mobile Experience
The current design is cluttered, resulting in a frustrating mobile user experience.
Absence of 'Mini Cart'
Missing Features
Homepage Accessibility
Implemented automatic guest access with a temporary address, enabling users to browse the store before signing up, thereby reducing initial barriers to engagement.
Featured Products on Landing Page
Showcased selected products directly on the landing page, enhancing visibility and encouraging immediate user interaction.
Design Enhancements
- home page -
Homepage Accessibility
Implemented automatic guest access with a temporary address, enabling users to browse the store before signing up, thereby reducing initial barriers to engagement.
Featured Products on Landing Page
Showcased selected products directly on the landing page, enhancing visibility and encouraging immediate user interaction.
Mega Menu
Introduced a comprehensive mega menu for seamless navigation, allowing users to effortlessly explore various categories and products.
Promotional Banner on Homepage
Added a dynamic banner to the homepage for promotions and communications, effectively capturing user attention and conveying key messages or offers.
Responsive Design Overhaul
Achieved a fully responsive design, ensuring a smooth and coherent experience across all devices.
Mini Cart Addition
Integrated a mini cart feature, providing users with instant access to their cart, improving shopping convenience and transparency in costs.
Product Tags/Labels
Introduced tags and labels on the Category Page, enabling marking of new arrivals, sale items, and other special categories, enhancing product discovery and user shopping experience.
Design Enhancements
- Category page -
Responsive Design Overhaul
Achieved a fully responsive design, ensuring a smooth and coherent experience across all devices.
Mini Cart Addition
Integrated a mini cart feature, providing users with instant access to their cart, improving shopping convenience and transparency in costs.
Product Tags/Labels
Introduced tags and labels on the Category Page, enabling marking of new arrivals, sale items, and other special categories, enhancing product discovery and user shopping experience.
Increased Product Display Per Row
Mega Menu
Introduced a comprehensive mega menu for seamless navigation, allowing users to effortlessly explore various categories and products.
Checkout Flow Optimization
Revamped the checkout process with guest checkout options and refined the form using industry-leading practices, significantly streamlining user transactions.
Design Enhancements
- Checkout & Account -
Checkout Flow Optimization
Revamped the checkout process with guest checkout options and refined the form using industry-leading practices, significantly streamlining user transactions.
Revitalized Account Page
Updated the account page to include order history, a ‘wallet’ for rewards and coupons, fostering a more engaging and rewarding user experience.