In the current generation of ecommerce and CMS systems, there’s a clear trend towards “headless solutions”. In this blog post, Shopware partner Exconcept uses practical use cases to explain what the term means, the benefits of the approach for online store operators and the key headless features of Shopware 6.
The first “headless” CMS had already hit the market several years ago. Soon after, they also began to influence system architectures in ecommerce with a new headless approach. Here, you’ll find out what makes headless commerce so special and how it solves a wide range of challenges for businesses.
What is headless commerce?
The term “headless” first appeared in the 2010s as part of headless CMS and refers to the separation of content and its presentation layer: content and data objects are accessible via a display interface.
On that basis, the term headless commerce is used in online retail if a store system separates the provision of ecommerce functions and their display in the sales channel. Communication between the sales channel (front end) and back end providing the ecommerce functions only takes place via APIs. This allows the online store’s functions to be integrated into preferred user interfaces, as we will show later using practical examples.
Diagram of a store system’s headless architecture
Headless classification as system architecture
System architecture can be roughly broken down into the following categories: monolithic, headless store systems, and store frameworks. Traditional store systems are known as “monolithic” if the backend and frontend form a cohesive (monolithic) block together. The processes in the online store are usually predefined and the user experience is also predetermined due to the close links between backend and frontend. Headless store architecture is a system in which the store functions in the backend are still closely interlinked but the integration of various frontends via API can be arranged in a flexible way. The frontend and associated user navigation can be freely designed. There is no longer any clearly defined UX. Frameworks, by contrast, replace all shopping processes in the backend and allow even the interplay between the product database, frontend, order management, and promotions to be defined as preferred.
Major benefits and drawbacks of headless store systems in comparison to traditional ecommerce platforms
The key benefits of headless-based store systems can be summed up as follows:
Free interface connection option: Headless solutions allow the necessary frontends to be freely selected and connected – unlike monolithic systems with a template engine.
Integration into an existing system environment: The headless store system offers potential for innovation, as an existing system environment such as a website can be enhanced in many ways using content such as product overviews without having to replace it entirely.
Brand-new usability options: With a headless store system it is no longer necessary, for instance, to display the entire purchase process from the basket to checkout in the frontend. The functions which are actually required can be implemented, allowing order processes to be expanded, truncated or modified as necessary.
Tapping into new sales channels: The API-first approach allows individual store functions to be directly integrated into various user interfaces without requiring a browser as a basis. This lays the foundation for omnichannel sales.
Common integration of various data sources: Headless solutions are capable of organizing data on a decentralized basis and displaying these various data sources together on a single user interface for easier processing.
Of course, there are other advantages which are not highlighted here. However, it’s also important to briefly list the drawbacks of headless store systems – in comparison with monolithic store systems – which we can be all too happy to overlook.
Greater functional responsibility: Instead of enabling display via a template engine, as in monolithic systems, the headless system provides an API. The monolithic system template already includes all functions that the system can handle. However, in the headless system, all the functions that need to be available in the frontend must be implemented using the API. It must also be ensured that they function correctly. The responsibility for ensuring the store functions correctly lies wholly in the implementation of the frontend.
Higher technical responsibility: Fundamentally, more technical expertise is required. Implementing and setting up the frontend for a headless store system is usually only possible with solid software development skills. By contrast, in a template based on CSS, HTML, and a little template logic, adjustments can be made with relatively little expertise. The amount of expertise required to set up an online store skyrockets as a result and the availability of people with the necessary capabilities shrinks.
Higher initial costs: The higher UX flexibility offered by the headless store system requires additional technical efforts and higher costs. In a tailored frontend implementation, these are largely incurred by the two points mentioned initially. Alternatively, costs are generated by a frontend framework, which mitigates the first two points but usually results in licensing or subscription costs.
What are the key headless features in Shopware 6?
In Shopware 6, Shopware has developed a very useful basis for headless commerce. The store software is responsible for central data maintenance and management. In addition, all sections can be connected via interfaces (Sync, Admin, and Store API). Accordingly, Sync API is used to transfer larger product and data quantities to connected systems, such as PIM, ERP and CRM. At the same time, the Store API addresses the relevant sales channels and the user experience can be adapted to the relevant channel. Finally, the Admin API allows the processing interface to be personalized and the business focus to be adapted accordingly. In addition, Shopware 6 has kept the template engine for the creation of simpler online stores at its core.
Practical examples of how to inspire customers on every channel with headless commerce
Here are a few typical examples of how a headless store system can help you – across different sectors.
Example 1: Integrating the online store as a catalog
This simple example is particularly relevant to businesses in the D2C and B2B sectors. For improved proximity to customers, information on the product range should be displayed on their website directly in the form of a catalog. A headless solution makes this easy. The catalog data is transferred from the online store to the website via the API and can be output as a catalog or individual products via a Javascript widget. A key advantage of this solution is that employees do not have to update data in two places.
Shopware 6 handles catalog display on content pages and the online store display with a “headless” approach.
Example 2: Selling special products directly via a “Buy now” option
This headless scenario is the optimum technical solution for a range of use cases in which highly specific products are sold. Overall, the user interface for the scenarios presented is not based on a store system. CMS systems often handle presentation instead. The online store is only integrated into the page with the direct purchase function via Javascript, reducing the presentation of purchasing processes to what is necessary. The key feature of these cases is that these products do not end up in a basket, and are only purchased directly. Due to the size or exclusive nature of the product, purchases of accessories or additional products is not expected and customers will usually wish to buy the product just once.
Use in real estate
One use case is the online sale of real estates such as apartments or houses. These properties are usually sold individually and the purchase process is typical for the industry due to the exclusive products. Unlike in the usual user experience consisting of (previous) B2C shopping experiences, customers will not encounter a basket, there is no payment service provider handling payment processing, and there is no shipping. The customer can often individually kit out their dream home. With the headless solution, the user interface operates separately from the online store. It contains all key information on the product and the customer is offered an entirely different purchase system (and customer experience) triggered here via the “Buy now” option.
You can find an identical situation in the sale of online services such as a subscription or physical newspaper subscription, for instance.
Sell specific products such as subscriptions with the “Buy now” button without requiring a full online store.
Example 3: Native apps as a smart addition to the online store
Specific shopping apps can be successful if they offer actual added value for mobile devices and their users respectively. This means the app can offer useful tools that improve the shopping experience – such as when purchasing colors. Here, functions such as quantity calculators, color selection and comparison tools and a wall color preview on your smartphone are useful tools that help customers select a product. And of course, the customer is then able to purchase the suggested or selected product directly via the native shopping app thanks to the headless integration of the online store.
Example 4: Headless commerce in B2B sector with customer service portals
You’ll also find a variety of use cases in the B2B sector. Customer service portals are a good example of the use of headless commerce. The aim is to simplify the processing of services, such as spare parts orders, for custom-made products (such as heavy construction equipment) for customers and manufacturers. The information from various systems, such as CRM, PIM or ERP systems, are presented together in a user interface in headless form.
Once they have logged in, the customer is therefore able to access all key information and functions directly: from lists of own data and previous purchases and suggestions for suitable spare parts orders to the option to place to new orders.
The scope of a standardized online store is no longer sufficient to depict these processes in the front end. The solution for this is a headless store system which allows the relevant processes to be grouped and displayed together across the interfaces.
How future-proofed is headless commerce in online retail?
As we’ve illustrated in this post, headless solutions are versatile and used in B2C, D2C, and B2B commerce. The many different areas of use are made possible by separating the user interface from the backend and the ability to flexibly design the entire system environment through interface connections (API-first).
Accordingly, the store system’s headless approach makes the ideal tool for technical implementation of more complex challenges – such as the illustration of catalogs on the website or the presentation of very specific products such as subscription models. The necessity of combining the backend with a frontend first of all, however, makes creating headless commerce solutions more technically complex. Additional technical effort is also required if you simply wish to set up a simple online store.
However, this is the great benefit of Shopware 6, which offers a template engine, in contrast to other store systems. This allows it to combine the benefits of headless architecture with the ability to implement a simple online store with a template.
Find out everything about the headless commerce approach and for whom it is useful in our whitepaper!
About EXCONCEPT
EXCONCEPT is here to help you create innovative and future-proof ecommerce solutions in B2C and B2B environments. With a range of consulting, implementation, and technical support services, it’s on hand to help you navigate the entire life cycle of your digital project.
FAQ
What is headless commerce?
Headless commerce is used as a term in online retail for a setup in which the store system separates the provision of ecommerce functions and their display in the sales channel. Sales channel (front end) and store back end only communicate via APIs.
What are the advantages of a headless commerce system?
The main advantages of a headless commerce system are free interface connection options, integration into an existing system and new usability options.
Which company offers a headless commerce solution?
Shopware offers one of the best headless commerce solutions on the market. Thousands of ecommerce businesses around the globe are using the Shopware Headless Commerce product.
