Ryze Superfoods Mushroom Coffee
Ryze Superfoods, a leader in health-focused mushroom coffee, faced challenges with their e-commerce site. This included high bounce rates, cart abandonment, and usability issues. A redesign of the home page and purchase flow was undertaken to address these challenges and maintain their competitive edge in the market.
Tools Used:
PROJECT OVERVIEW
This project focused on improving Ryze Superfoods’ e-commerce website to improve user experience, increase conversion rates, and establish trust with customers. By analyzing key metrics, conducting SWOT and competitor analyses, and mapping customer journeys, I identified pain points and devised strategic solutions. Creating buyer personas helped me understand our audience’s needs. With medium-fidelity wireframes and hi-fidelity mockups, I implemented intuitive navigation, clear call-to-action buttons, accessible color schemes, and trust-building elements to optimize the purchase flow.
PROBLEM
Ryze Superfoods’ e-commerce site often struggles with high bounce rates, abandoned carts, and poor usability. Customers often have trouble navigating the site, finding products, and accessing information details like sustainability details. These issues lead to missed sales opportunities and a less satisfying shopping experience.
RESEARCH
of visitors to Ryze Superfoods e-commerce website leave after viewing just one page, indicating a high bounce rate.”
(Semrush, 2023)
Original Ryze Superfoods Website
HOME PAGE REDESIGN - BEFORE & AFTER
Before
After
HOME PAGE REDESIGN - PAIN POINTS AND SOLUTIONS
Navigation Pain Point:
The original design relies on a hamburger menu across all views, which hides important links and requires extra clicks. This reduces visibility and slows navigation.
Navigation Solution:
The revision includes a prominent main menu with clear navigation links (Home, Shop, About, Contact) improving accessibility and making it easier for users to navigate the site efficiently.
Call to Action Pain Point:
The hero image’s “TRY IT” button lacks clarity and urgency, leaving users unsure of next steps.
Call to Action Solution:
The updated “Shop Now” button directly guides users to browse products, boosting clarity and action.
Trust Banner Pain Point:
The “Featured On” section was located further down the page, making less visible to users when first landing on the home page. This potentially reduced the trustworthiness that could be made by showcasing reputable media mentions upon landing.
Trust Banner Solution:
Moved the “Featured On” section higher on the page, above the fold. The enhances trust by immediately showing visitors that Ryze is recognized by reputable media outlets.
Product Visibility Pain Point:
The home page lacked a clear, immediate display of products with purchase options, which could lead to missed sales opportunities and reduce user engagement.
Product Visibility Solution:
Added a three-column section that highlights products with CTAs. This provides users with quick access to products, increasing the likelihood of conversions.
BUYER PERSONA
CUSTOMER JOURNEY MAP
COMPETITIVE ANALYSIS
Purchase Flow Efficiency:
Ryze: User behavior analysis highlights checkout drop-offs, signaling potential cart abandonment issues.
Competitors: Both offer streamlined purchase flows with clear product descriptions and easy checkout processes.
Customer Service Accessibility:
Ryze: Lacks easily accessible contact and FAQ pages, hindering customer support accessibility.
Competitors: Both provide accessible customer service features, including readily available contact and FAQ pages.
Policy Transparency:
Ryze: Policies like Privacy and Returns are available but might not be easily discoverable.
Competitors: Both competitors ensure policy transparency by clearly linking to Privacy and Returns policies on every page or making them easily accessible from the footer.
SWOT ANALYSIS INSIGHTS
Strengths:
Identified strong brand reputation, effective marketing strategies, and commitment to health and wellness.
Weaknesses:
Highlighted limitations in product variety, website usability, and distribution channels.
Opportunities:
Noted opportunities for education, innovation, and building customer loyalty through sustainability efforts.
Threats:
Recognized threats such as market saturation, taste limitations of mushroom coffee, and supply chain disruptions.
APPROACH
To address these challenges, my process focused on refining the navigation, improving visuals, and adding functionality to create a smooth shopping experience. Initially, I started designing in Adobe XD, but I switched to Figma to expand my skills. I built a detailed component library with reusable UI elements, which helped to keep the design consistent and streamlined
SKETCHES
Mobile View
Desktop View
WIREFRAMES (XD) - DESKTOP VIEW
Home page
Shopping Cart
Checkout
Review Order
FIGMA COMPONENT LIBRARY
SOLUTION
The redesigned homepage and purchase flow transformed the site into something much more easier to navigate. Products and call-to-action buttons were made more prominent, and trust building features like secure payment badges were added to build confidence. The navigation menus were simplified, and social media links were improved to encourage connection and engagement. Together, these updates created a more inviting and seamless shopping experience.
HI-FIDELITY MOCKUPS (FIGMA)
Home page
Products
Product Details
Shopping Cart
Checkout
Review Order
Order Confirmation
Share
RESULTS
The visual representations of the redesigned homepage and purchase flow illustrate significant enhancements in user interface and experience. Clearer navigation, prominent call-to-action buttons, and trust-building elements contribute to a streamlined and visually appealing layout. These improvements align with project objectives, suggesting a successful implementation of the redesign project.