The founders of The Cereal School had a revolutionary idea: produce a delicious cereal that brings out customers’ nostalgia for Saturday morning cartoons with a sugary bowl of cereal, minus the sugar. Industry experts they approached thought their dream was unrealistic, but in their kitchen, the founders were able to create a low carb, high protein cereal with no sugar (ever). Old school cereal made the new way.
The Cereal School had two flavors sold direct to consumer (D2C) through their website, but with the rate they were growing and the third flavor they were adding to their line up, they decided to call in outside help to make their website reach its conversion potential, both for desktop and mobile.
The Challenge
Sellry was called in to help The Cereal School revamp its product detail page (PDP). They have a single PDP, which is unique. Instead of a standard product catalog, they set-up a one-page shop all option. One page for all of their cereal flavors and bundles.
The PDP was already highly converting when The Cereal School approached Sellry. The major challenge was to modernize the PDP, add a new flavor, and make the page more mobile-friendly – all without dropping the existing conversion rate in the transition.
Because of the wider range of flavor options now available, The Cereal School wanted to give its customers the option to bundle multiple flavors in one purchase. This added another layer of complication to the PDP design.
Prior to the engagement, The Cereal School had drop-down menus on the page for customers to easily select between different purchasing options. The menus worked for desktop users but were not mobile-friendly.
Since mobile sites can be displayed on various device operating systems, screen sizes, and mobile browser types, dropdowns can experience a wide range of differences in format and ease of use that prevents them from being intuitive or friendly. The drop-down menus also condensed content that would ideally be visible when customers first viewed the page. Reducing friction for mobile purchases by reducing the number of clicks on the PDP was one of the primary objectives of this engagement.
Lastly, the PDP redesign came simultaneously with a site migration to Shopify Plus – a move initiated because of the platform’s increased flexibility and more advanced features.
Solution
In a three-week time frame, Sellry was able to migrate the site to Shopify Plus, redesign the PDP page, add the new flavor, add the option to bundle, remove dropdowns, and increase the mobile-friendliness of the site overall.
Sellry and The Cereal School teams recognized that a single page for purchasing was more conducive to mobile purchases when drop-down menus were eliminated. The drop-down menus on the PDP were replaced with swatches for flavor selection and flavor mix.
The swatches were also a great solution for bundling products on the same page as the products themselves, a unique set up that was not available by default. Currently, there are no robust options for easily displaying product bundles on a single page within Shopify, but The Cereal School and Sellry showed that the unique, single page shopping option contributes to a more efficient conversion funnel with fewer steps and less friction.
On the operator side, the page layout also allowed The Cereal School to have all of the bundles displayed on the PDP page directly and avoid some of the traditional hassles of dealing with independent products or “dummy” bundles. The solution used for The Cereal School is a strong option for D2C companies who want to provide product bundle options on a single PDP or otherwise.
In order to make the page even more user-friendly, Sellry’s developers helped Cereal School move away from their page builder app to native inline use of metafields. This shift helped improve page load speeds and allow for easier and better image rendering. This strategy also made it so site operators don’t have to toggle between a webpage admin and an app to build the page.
Results
After completing the PDP refresh, both the overall conversion rate and mobile conversion rate increased by 51%. The Cereal School also saw a 93% jump in revenue after only one week.
Using a data-first approach to UX design allowed Sellry to create a higher converting PDP that still matched the branding and shopping experience The Cereal School wanted to show its customers. The mobile-friendliness of the site allows customers to engage with their cereal in a new way. The more efficient organization of products, a shift to native inline use of metafields, and the migration to Shopify Plus also increased the site’s ease of use on the back end and provided a solid foundation for the company’s growth.
The Cereal School is a D2C food company that is doing exceptionally well, having gone from zero to hero in a very short period of time, leveraging a very minimal site layout. The team at Sellry plans to continue working with them and continue to help 10x their business over time.
