Headless commerce is the “it” architecture of the ecommerce world right now. Depending on what you read, it’s either a must-have to reach customers in today’s fast-paced omnichannel world or a buzzword-bloated trend.
The truth is, it’s probably somewhere in between. Headless commerce isn’t necessary for all ecommerce businesses. But for certain brands that require more customization and creative solutions that can’t be achieved with existing ecommerce software, headless can be a saving grace.
Headless commerce means decoupling the back end ecommerce functionality from the front end customer-facing touchpoints (or “the head”). The front and back ends can then share information seamlessly through APIs.
By going headless, a business might be able to choose a powerful commerce platform that doesn’t perfectly suit their needs and then customize it by using a separate content management system (CMS), digital experience platform, (DXP) or progressive web app (PWA), among many other options.
In this article, we’re sharing 20 businesses who went headless—including what their tech stack is composed of, what problem they were looking to solve, and how it all worked out.
But first, let's explore the benefits and demistify some of the myths surrounding headless.
Table of Contents
- Headless commerce benefits
- Headless commerce myths
- Health & beauty
- Food & beverage
- Home furnishings
- Manufacturing & wholesale
Benefits of headless commerce
There’s a reason so many businesses are considering headless builds. Headless commerce is the decoupling of the front end customer-facing portion of the website from the back end commerce function. Headless commerce can provide a competitive advantage through a number of key benefits.
One of the biggest benefits of headless is the flexibility it offers a business. Need new functionality? A new front end solution can be integrated. Your website needs to offer a better mobile experience for a sudden influx of mobile customers? Try a progressive web app (PWA). Every problem can be solved—not with a major overhaul, but with a tweak.
Headless is a modular approach that allows a business to keep what works and replace or solve for what doesn’t. Adding something new doesn’t require a full replatform.
If the last two years have taught us anything it’s that you have to be ready for the unknown unknowns. Having a tech stack that’s flexible means your business can adapt in the face of new changes—whether that’s your customers changing how they shop, an influx of new competitors, or something entirely different.
Improved customer experience
There are a number of ways headless can improve the customer experience, many of which will depend on your website goals and customer base. For example, if your brand and website are very content-focused and offer a wide variety of different content mediums, going headless and having a dedicated content management system (CMS) as the front end can be the key to presenting content to customers in the most engaging and helpful way possible.
The front end is the part of the website the customer sees and interacts with. As far as they’re concerned, the front end is the only part of the website that exists. By opening up the front end to new possibilities, brands have the power to create unique and dynamic online experiences that exactly suit your customers’ needs. And (as mentioned above) as those needs change, so too can the experience.
Another way headless can provide better customer experiences is through personalization. The back end of the website is a treasure trove of data that a CMS or DXP on the front end can use to create personalized experiences for the customer across touchpoints.
A big part of the customer experience is meeting customers how they shop. And lately, how they shop is a non-linear mass of touchpoints. In other words: omnichannel. Customers want to be able to see your website on their phone or computer, visit your physical store or smart kiosk, or purchase through social or a marketplace while getting the same consistent, personalized experience throughout. If there’s a weak link in the chain somewhere, your conversion rates will suffer.
Headless facilitates omnichannel because content that is created in one place can be seamlessly delivered across channels. Additionally, if you need a new sales channel added it can be done and integrated through APIs. With a traditional commerce model, a business is beholden to the sales channels offered by its platform. With headless, the opportunities for growth and development of new channels are unlimited.
More efficient development
Under a headless model, businesses can make changes to the website much faster because business teams can operate independently. The marketing team can make updates to the site, creating and publishing new content directly in the CMS (or front end of choice) without requiring developer resources. This means changes can happen more frequently, keeping the website fresh and allowing for greater experimentation in honing the perfect customer experience.
From the perspective of the development team, they are no longer bogged down making minor site changes and updates and can focus on bigger, revenue-generating projects to improve the site.
There’s a reason people throw around the term “future proof” when talking about headless. The flexibility the headless model provides means it can easily grow with your business. This goes hand in hand with the benefit of flexibility mentioned above. Because it’s customizable, you can adjust your tech stack over time and make changes as your business and its needs increase.
As headless can provide greater agility, it can be a big advantage as a business grows. Front end changes can happen much faster, so new products, promotions, and more can be added without disruption.
Those are some of the major pros. Now let’s look at some of the assumptions about headless that turn out to be false.
Myths of headless commerce
With so much information free-flowing from various sources, it’s understandable that some of it doesn’t quite represent headless accurately.
Here are a few of the top headless myths.
Myth 1: It’s too costly to implement and maintain.
Total cost of ownership is understandably a huge factor for businesses choosing a new ecommerce tech stack. The budget must cover not only the cost to license the software but also the development costs to actually build the site. And of course, keeping the site secure and performing well requires certain maintenance costs.
With headless, the concern is that these costs will skyrocket. After all, the build and integrations can be complex. You’re dealing with more moving pieces than an all-in-one legacy system. How could things not add up?
The truth is the cost to build your headless website will vary based on your needs, precisely the way the cost to build a traditional website would. However, the modular nature of headless means you can start with the functionality you need (and can afford) now and build over time.
Additionally, with headless there are long-term cost saving benefits when you consider the lower development costs from no longer requiring tech spend for website updates.
Myth 2: I have to go headless to have the customizations I need.
While we’ve so far been touting the benefits of headless, it’s worth noting that it isn’t necessarily the right solution for everyone. Likely, the reason you’re seeking a new website or tweak to your current model is because you have a problem in need of a solution. However, there’s likely more than one way to solve it.
Depending on what the particular problem is, headless may well be the right choice. But it may not be the only choice. Customizing and achieving the flexibility to solve your current business challenges may be doable without using a separate front end, provided your current platform supports it.
For example, Shopify’s Online Store 2.0 offers an opportunity for businesses to reimagine a Shopify store and build new themes and apps through no code, low code, and custom code options.
Consider the customizations you need from every angle before deciding if headless is the right choice or if there may be a simpler solution that doesn’t require decoupling the platform.
Myth 3: A headless architecture is less secure.
As treasure troves of customer financial data, ecommerce websites are obvious targets for hackers. Attacks are frequent, so good security can’t be compromised. The myth that headless is less secure originates from the idea that you now have multiple tools that could be an entry point.
In reality, headless can actually be more secure than traditional platforms at avoiding malicious attacks such as DDoS (distributed denial-of-service) attacks. The headless architecture reduces the internet-facing infrastructure. Having a front end and back end that behave independently and share data through APIs, provides a smaller surface to protect from attacks.
Myth 4: Headless requires a complete replatform of my ecommerce tech stack.
You may choose to replatform completely to start from scratch with your headless site, but it’s absolutely not required. In fact, one of the advantages of headless is that you don’t have to change. You can add, not subtract.
For example, if you already have your store on Shopify Plus, you can integrate it to new front end systems to get any additional functionality you need.
Myth 5: It takes too long to build and launch.
Many worry that the work to build integrations and create a beautiful website with a dynamic customer experience will take too long. This too is a fundamental misunderstanding of how headless can work.
Think of it as like building your dream home, while you’re living in it. And each room is completely self-contained and self-sufficient, so you aren’t bothered by the construction noise at all.
Headless allows you to continue to add new features and adapt as you go. You can launch sooner with what you need to get going and continue to add and refine the customer experience as you go.
Health and Beauty
ILIA is an award-winning beauty brand revolutionizing the clean makeup industry. The business was growing fast and needed a look as flawless as its product.
The challenge: As it grew exponentially, ILIA was happy with how its Shopify Plus store was performing. But it increasingly wanted the flexibility of a headless tech stack to be nimble with different content types as it scaled.
The solution: By using the Shopify Plus engine on the back end and leveraging the Nacelle headless commerce platform to develop a PWA front end, ILIA has been able to improve the customer experience. The site reduced page load speeds by nearly 50%, and thus saw fewer would-be customers bouncing, and an overall 18% decrease in exit rate. On the developer side, there’s been an increased efficiency by switching to headless, with 20% faster deployments.
One of the most well-known and valued brands in the world, Lancôme is a French seller of luxury perfumes and cosmetics that realized it needed to adapt to a changing world.
The challenge: Way back in 2016, Lancôme noticed its traffic was changing—for the first time ever, mobile traffic was eclipsing desktop traffic. The business needed to adapt its site in order to meet the new ways customers were shopping. Lancôme considered building a native app but realized that only made sense for frequent shoppers. Instead it wanted to create a fast, engaging native-app-like experience that would be accessible to all visitors.
The solution: Launching its new site in 2017 (and thus a fairly early adopter of headless), the fragrance giant used a PWA, Mobilfy, to deliver a fast, app-like experience on the mobile web. This resulted in a 17% increase in conversions, 53% increase in mobile sessions on iOS, and 8% increase in conversion rates on recovered carts via push notifications.
For the health-minded consumer looking beyond home scales that only measure weight, Naked Labs offers a product that does full 3D scans to help users better understand their body composition. The scale is able to deliver results to an easy-to-use app.
The challenge: Naturally, the complexities of its product require a fairly customized tech stack. The website needed to be very content-forward and demonstrate what the product is capable of through 3D-animations. Because the product is more expensive, content is also very important to educate the consumer on its value, as they do research prior to purchase.
The solution: Naked Labs uses Shopify as its back end ecommerce platform and a Contentful CMS on the front end. This enables the brand to be highly flexible and update content as needed.
Skin care brand StriVectin offers customers anti-aging creams and serums, and includes helpful content like a skin ID analysis to help them choose products best suited for them.
The challenge: Around 2019, StriVectin was using Magento for its ecommerce store, but was frustrated with stability challenges. The business wanted to move to a new ecommerce platform but needed powerful content management tools to house its blog and information on some of the science behind the products.
The solution: StriVectin migrated to Shopify to power its core product information, inventory management, and checkout experience. It then used Prismic CMS to handle content. StriVectin also utilizes Gatsby to mesh everything together seamlessly. Following launch, it saw an immediate and sustained 20% increase in organic traffic.
The Hodinkee website isn’t just a place to buy watches, it’s where lovers of watches and all things horology go for education, entertainment, and discussion.
The challenge: Hodinkee’s business model is very content-forward. In addition to watches, it offers podcasts, videos, articles, and more that all celebrate horology and demonstrate expertise in fine craftsmanship.
The solution: Another early adopter of headless, Hodinkee rebuilt its website more than seven years ago, based on a decoupled architecture. The business built off of Shopify and designed its own custom CMS. As representatives of Hodinkee explained during the launch: “This new website will allow us to continue to create richer and more in-depth content for our readers, and to present it in a way that is (if we humbly say so ourselves) absolutely stunning.”
Kotn is an ethically and sustainably minded fashion brand whose goal has always been to produce clothing that doesn’t compromise on quality, price, or the integrity of the people making it.
The challenge: While Kotn was initially able to do everything it needed with its Shopify Plus store, over time, as its product offerings grew, certain listings required cumbersome workarounds for ecommerce merchandisers. Additionally, it had two separate Shopify sites served by the same content site. Kotn realized it could solve these issues with a more permanent workaround: a headless build.
The solution: Kotn used the Shopify Storefront API to consolidate two stores into one, powered with a new CMS called Sanity, along with custom product pages and checkout. Kotn’s headless model also allows it to use React, which means its in-house developers can build reusable components that aren’t only consumer facing but also extend throughout the rest of the internal application.
You may have heard of a little shoe and athletic apparel store called Nike—but did you know this sports accessory giant too has gone headless with its site?
The challenge: Nike went headless because it wanted a strategy that was mobile-first to take advantage of the younger market segment that is increasingly shopping on their phones.
A fitting follow-up to Nike above, Under Armor is another well-known brand outfitting athletes of all abilities.
The challenge: Under Armor manages thousands of stores across 30 markets and includes fitness centers and retail. The brand needed a website that could bring all of that together in a cohesive customer journey, so it turned to headless to find it.
The solution: Using Demandware on the back end, Under Armor leveraged Mobilfy to create a PWA on the front end—one of the earliest brands to do so. The result was a faster and more seamless customer journey that makes it easier to navigate from product pages to categories. After launching the new site, Under Armor saw double-digit revenue growth and three times the return rate.
Food & beverage
Blue Diamond sells all things almonds, both in-store and online. With over 100 products and 100 years of history, the business has a lot of content to pack into its website and online store.
The challenge: Redesigning its website for the first time in more than 10 years, Blue Diamond needed an organized, purposeful online store that could serve all its different customer needs. It wanted a brand website that felt cohesive, while also maintaining unique identities for different product lines.
The solution: Blue Diamond partnered with Planetary to build its website with Shopify and React, backed by Contentful for the CMS. This created complete flexibility to display all of the different pages and content types. Additionally the Blue Diamond team can now easily update site content, create pages, and add and update products without developer resources. Blue Diamond utilized the Shopify API to create a seamless integration with the rest of the website. The website has seen an 85% increase in organic traffic and a 15% decrease in bounce rate.
Seedlip produces high-quality, non-alcoholic spirits.
The challenge: Non-alcoholic beverages are having their moment—Fior Markets estimates that the global non-alcoholic beverages market will grow from $923 million in 2020 to more than $1.7 trillion by 2028. But it’s also a very competitive space for digitally native vertical brands. Seedlip needed a website that could produce an exceptional customer experience that would draw in new visitors, convert them to customers, and keep them coming back.
The solution: To achieve the digital experience it wanted, Seedlip was an early adopter of headless. The drinks brand uses Shopify on the back end and built a custom Vue.js front end that enables it to customize and provide incredible detail at every step of the process.
Designed to fit in every home and taste, Burrow offers slick, modern modular furniture that can be modified and easily assembled by the customer.
The challenge: In looking for an ecommerce platform to launch its site, Burrow found that out-of-the-box options weren’t meeting its needs. The business needed a non-standard checkout experience, including the ability to delay orders and require signature on delivery. The brand also needed additional customizations to achieve the shopping experience its customers demanded.
The solution: Burrow used a headless solution with BigCommerce on the back end and a custom CMS on the front end to achieve its site. Content is easy to update and maintain, so the business is able to launch products faster and provide the desired customer experience.
Selling primarily furniture (but also bedding, jewelry appliances, and more), Overstock has risen to become a go-to internet retailer for home goods.
The challenge: The sheer volume of content on Overstock can be overwhelming, so the site needs to be well organized and easy to search in order to help customers find what they want quickly. Other requirements to keep visitors from bouncing to competitors: fast loading time and overall seamless experience.
The solution: Overstock rebuilt its site with a headless approach, turning its product research and product browsing pages into interactive SPA pages. An SPA, or single page application, updates via API calls, resulting in nearly instant page transitions. After updating its site with a headless approach, Overstock saw a 36% increase in conversion rates.
Verishop connects shoppers in the market looking for everything from home goods to clothing with independent designers and brands.
The challenge: Like Overstock, Verishop is a multi-brand retailer that offers a large array of products in different categories that need to be easy to search. Because Verishop offers work from multiple designers, it also needs to be able to offer tailored experiences at brand-specific URLs.
The solution: Verishop leveraged Shopify Plus and Contentful CMS to create its headless ecommerce store. The result is a website that makes it easy to browse and to find specific items.
Complex Networks is a global youth entertainment network across big pop culture categories, including streetwear and style, food, music, sneakers, and sports—known for its much-hyped annual multi-sensory convention, ComplexCon.
The challenge: When the 2020 ComplexCon was canceled due to the COVID-19 pandemic, Complex Networks saw an opportunity to adapt its business model. It wanted to create a virtual version, but one that would be truly immersive, where visitors could not just make purchases but also engage with brands and discover new trends.
The solution: Going headless was necessary for Complex Networks because it was creating something both innovative and complex: a 3D ecommerce-enabled video game where users can freely move, explore, and experience. Building off the Shopify Plus platform, ComplexCon partnered with design and experience agency Jam3 and Shopify Plus Agency Partner Riess Group to create an augmented reality front end experience that could live up to the hype.
Much like Nike before it, LEGO is a brand that needs no introduction, as these colorful toy bricks are a staple for young builders the world over.
The challenge: Back in 2017, the iconic toy brand began facing difficulties with its ecommerce website. It was running on a traditional monolithic ecommerce system and was unable to scale enough to keep up with customer demand. LEGO had begun to invest in React on the front end, but realized its back end system was what was holding it back.
The solution: LEGO launched its new site on commercetools in 2019. The result is a much more reliable site that also provides a better customer experience. LEGO has also found that moving headless has given its teams more independence to make updates, leading to faster product rollouts.
Manufacturing & wholesale
Known for their red movie rental kiosks, Redbox also has a strong ecommerce presence that allows shoppers to rent or buy movies on demand.
The challenge: Because its content is highly visual, Redbox needed a solution that could allow it to display visuals in a highly engaging homepage without losing page speed.
The solution: Redbox opted to launch its storefront using an SPA, like Nike and Overstock, above. The result was a more immersive experience, responsive visual content, and no loss of performance.
With more than 422 stores across the United States, Johnstone Supply is the leading cooperative wholesale distributor in the HVAC industry.
The challenge: Johnstone had two issues: 1) its catalog had an enormous 80,000 SKUs, with 1,200 possible product attributes, and 2) its customer base of contractors increasingly needed fast, easy mobile access to product information while out in the field.
The solution: The wholesaler chose to build its site on Elastic Path to use APIs to share necessary data between stores efficiently. Since adopting its new decoupled and decentralized website, Johnstone has improved customer experience across channels and increased speed to market for new products. It’s also able to handle its increasing volume of product data easier.
Pella is a leading manufacturer and designer of doors and windows for new construction, remodeling, and replacement.
The challenge: Pella has both B2C and B2B use cases and needed a custom-built system that could provide a seamless path to purchase for both.
The solution: Elastic Path Commerce Cloud hosted on Amazon Web Services was the solution Pella opted for. On the new site, customers can easily choose whether they are a homeowner or professional contractor, which personalizes the experience right from the homepage. The headless solution provided the elevated customer journey the company needed and also reduced cart abandonment.
Audi is a luxury German car manufacturer whose products represent high quality and sporty design.
The challenge: Audi needed a website with the flexibility to match its changing customer requirements. It needed a tech stack that could be fast and adaptive.
The solution: The car brand used commercetools as its commerce platform on the back end and integrates with specialized services on the front end. The ecommerce functionality also integrates with the in-car technology, so customers can purchase car upgrades and additional features through an app or in-car settings.
Cazoo buys, reconditions, and resells previously owned vehicles online. Customers can browse thousands of cars in-stock and buy them online to be delivered to their door in as little as 72 hours.
The challenge: Buying a big-ticket item online site unseen is always going to require a superb customer experience to demonstrate trust and reliability. Cazoo’s business model was no exception. Due to the complex logistics of its business, Cazoo opted to launch with a headless platform.
The solution: Cazoo launched its headless site on commercetools in 2020. The site features advanced checkout processes that allow customers to purchase one car with multiple payment options. Another feature that supports Cazoo’s business model is the ability to create custom and adaptable bundled products and auto services.
Does your ecommerce business need to go headless?
The answer is: maybe.
The key is not to approach headless as a cool new thing that can revolutionize your business. Instead, consider the problems you’re currently facing. Can they be solved with your existing system? And if not, would diversifying your tech stack help?
The examples in this article are all businesses that found success with headless because they had specific problems that going headless was able to solve. If that mirrors your journey, check out our guide to learn more about headless commerce.