Leveraging headless to launch a flexible and future-proof eCommerce site

Clean haircare brand Briogeo innovates planet-friendly and plant-based products for all hair types and textures.

Challenge

The Briogeo’s eCommerce site code base could no longer support further optimizations while still allowing for the level of customization the brand wanted for offering a variety of different promotions. When it was time for a brand refresh, the company decided it also was time for a new website. 

| A complete site redesign gave us the opportunity to determine a holistic overarching strategy for how to create an optimal and cohesive customer experience – with headless opening up all kinds of possibilities |

Solution

eHouse Studio, led by an all-female team, provided strategic services to help Briogeo determine it needed a flexible, modular headless eCommerce site to meet its business goals. Although headless solutions are becoming more mainstream, the challenge remained: how to most effectively implement headless to provide the future-proof flexibility and functionality the client wanted, while ensuring the backend wouldn’t be a headache for the client to manage. 

Content management system

To address common headless backend challenges, eHouse Studio partnered with headless platform Pack Digital, which, in addition to a headless infrastructure, provides a CMS-like framework to enable Briogeo to manage content on the new eCommerce site without needing a developer. 

Content modules

Because Briogeo was familiar with Shopify’s admin and modular approach to building pages, eHouse Studio developed content modules for the Pack storefront that Briogeo could add to any page of the eCommerce site – creating a true “content everywhere” experience. To streamline content management and ensure a cohesive look and feel on the site while still allowing for customization, eHouse designed a suite of 12 modules that can be combined and adapted to add different types of content, including brand content, product details, sliders and hot spots, key ingredients, inline video play, scrolling timelines, and more. To determine what content modules were needed, eHouse Studio did an audit of the large number of content module types on the old eCommerce site and worked with the client to develop a roadmap for what to keep and what to add.

| It takes a team: Pack’s content management system (CMS) enabled the client to more easily add and change content on their headless eCommerce site. eHouse Studio’s strategists and designers helped Briogeo strike the right balance between customization and usability, and our developers ensured all the third-party apps the client wanted were seamlessly integrated |

UI/UX best practices for consumer-friendly design

eHouse brought its design expertise and UI/UX best practices to inform the site design, making it more intuitive for customers to navigate the different sections of the website and shop for products. 

For example, for the product detail page (PDP), eHouse started with Briogeo’s proposed design and collaborated closely with the client to modify it to ensure it included the information and functionality – especially in the Buy Box – needed to convert customers to purchase.

Mobile-first design

Because most of Briogeo’s customers shop on mobile, eHouse Studio worked to ensure that the mobile shopping experience was easy, with clear navigation, product recommendations and subscription upgrades in the Cart, and Express Checkout options for convenient payment. 

eHouse Studio, working with Pack, launched a headless eCommerce site for Briogeo that is flexible, modular, user-friendly and will support additional functionality into the future while maintaining speed and performance.