- 5 months after the revamp organic online sales revenue (revenue that excludes paid ads) went up 9% and quantity or products sold increased 18%
- Product checkouts increased 42%
- Average user session (time spent on site) increased 7%
Gr8nola was looking to increase sales. The site was failing to convey all that made the granola unique so the brand was not reaching its full potential.
The objectives of the conversion optimization were focused on content writing and UX redesign to increase conversion and drive up average order value.
Prior to making changes, we heat-mapped gr8nola’s old site with Hotjar and tracked traffic behavior and analytics so we could better inform our decisions.
Here’s a summary of the before and after from this revamp.
The previous header was a busy and used ambiguous language.
To address this, we chose a slider that displays various flavors, focuses on its great ingredients, and brings gr8nola’s vibrant brand to life.
We reduced the navigation options to include only three pages: Shop, Benefits, and Story. The rest of the links were sent to the bottom of the page to keep the header navigation menu focused on pages that convert sales.
Addition of Press Logos
Gr8nola has gotten some great press which was formerly hidden in the Story page. Being featured in Forbes and Business Insider are huge assets for credibility among new customers, so we put them front and center.
We chose to reduce the number of bright colors to make the site look cleaner and to display the bundle offers that would drive up average order value.
Previously, the homepage displayed long customer testimonials that lacked photos of the actual customers.
Since gr8nola has received great influencer love, we decided to give highlight quotes and videos provided by influencers such like Halle Berry, Nigel Barker and others.
“Why Gr8nola?” Section
There used to be 4 icons on the homepage below the customer’s testimonial section that conveyed features about the brand. But these unassociated facts were not directly related to why gr8nola is worth trying.
We identified the key brand differentiators and decided to be more thoughtful in the information hierarchy.
What’s Inside Section → New “Gr8 Benefits” Page
The old “What’s Inside” section was text-heavy and difficult to read.
This valuable information was moved to a new page called “Gr8 Benefits” (found in the main header navigation). It visualizes the same information in a cleaner and more engaging fashion. It also educates customers on why gr8nola is different, which gives gr8nola a competitive advantage and helps consumers understand and recommend the product.
AFTER (New “Gr8 Benefits” Page):
Before, the founder section was text heavy and you couldn’t even see Erica’s face.
We wanted to show her face to increase trust in the product. Secondly, we wanted to place more importance on the consumer. This new section now shows her smiling and the copy is shorter.
It’s also followed by a video which adds a more human and personal touch to the page.
We implemented best practices and made the following changes:
- Larger product image
- Removed colored circle behind the products to make the peach cleaner
- Made more consistent use of color
- The thumbnail gallery of images are on the left instead of the bottom
- Product variations (pack size) are all visible immediately
- Customer now sees an “In Stock” or “Out of Stock”
- As the users scroll down, they now see “Recommended Products” above “Customer Reviews” in order to drive upsell -before they were at the very bottom of the page
While this list isn’t inclusive of every change made, it covers the most significant ones.