Headless experience management — part 1
Retail headless commerce projects will fail without headless experience management tools for merchants and marketers.
In 2019, the Amplience platform serviced just over 1.5 trillion content requests, of which over 65% came from mobile devices (excluding tablets).
With the advent of the new decade the mobile-first age has truly arrived. But this huge shift to mobile has hit retail ecommerce hard.
Conversion is falling and costs are rising. Solving for mobile performance is now a key priority. But can existing technologies provide a solution? In a word, no.
First, a little bit of context as to how we got here.
The market leading ecommerce platforms have been successful because they are ‘whole products’ (albeit with a fair amount of system integration) that satisfy the needs of developers, marketers, merchants and ops teams in the creation, operation and management of a storefront.
But they evolved in a time before the iPhone, widespread cloud computing and new architectural approaches like microservices. They were built for the web: required large scale engineering projects to deploy or upgrade; are complex to maintain and operate; and are updated infrequently.
As the shopping experience was web based and had a similar structure to a website the ecommerce vendors built web CMS capability (a presentation tier) into their ecommerce monolith.
This provided the bare minimum of site management capability to enable the creation of a functioning storefront including navigation, template creation and page authoring as well as access to functional components like search, basket and checkout.
In a web CMS, including the cut down one that lives in the ecommerce platform, the page template (built by developers) is where the experience really comes together.
Templates are powerful because they configure and control a lot of key pieces:
- Page structure and layout
- Front-end interactions
- The mix of content (and media) modules
- Product display and other widgets
- Search results including product listers
- Other functional components (basket, account management etc.)
However the template model is flawed because templates combine back-end functional components with front-end user interface behaviours. This mixing of presentation and application tiers makes templates fragile. Any changes to the front-end experience require template development and may also need corresponding changes in functionality and the data model.
With page templates, as the name implies, the experience is denominated at the level of whole pages (which are themselves mini-applications) and as such the complete template must execute server side every time a page is refreshed or requested, to generate HTML for the browser.
For an ecommerce storefront, templates will be created for landing pages, category pages, product listers and, most complex of all, product detail pages. These templates, particularly ones that are functional and interactive, can become very sophisticated indeed.
This combination of server side complexity, which increases request latency (the time taken to run the template and return the HTML markup) and the fact that the experience comes in units of whole pages results in page load speeds of many seconds, and that kills mobile conversions.
Performance is not the only problem
Retailers have responded to the fragmentation of the customer interface by procuring new systems to address each new content type or channel, but given the high cost of integration these systems are often standalone, or partially integrated. The result is that ecommerce teams are wrestling with many siloed systems, broken processes, high change complexity and long development cycles to make even simple changes.
The cracks are beginning to show. Voice of Customer (VoC) surveys (in-channel questionnaires generated by SAP Qualtrics or Foresee) reveal a startling similarity in customer feedback on the quality of their ecommerce experience, consistently highlighting challenges with incomprehensible navigation, missing or inconsistent information around products and services, poor performance and sub-standard functionality.
These issues are particularly damaging for mobile commerce where conversion languishes at 50% of desktop or less. And as mobile interactions continue on their inexorable rise, overall ecommerce conversion continues to fall.
For retailers this situation is no longer tenable and the search is on for a better way that will improve competitiveness by delivering better, faster and cheaper outcomes.
‘Headless’ commerce to the rescue?
To solve for these challenges ecommerce teams are evaluating new classes of software, that are better suited to the fast-evolving requirements of marketing and ecommerce teams as they seek to take control of their digital experiences.
On the front-end commerce teams are migrating the experience into Progressive Web Apps (PWAs), which use front-end JavaScript technologies along with Accelerated Mobile Pages (AMP) to support lighting fast mobile (and desktop) storefronts. PWAs load faster, perform better and have the sophisticated feel of native iOS and Android applications, but without the proprietary costs. However, PWAs built using JavaScript frameworks are designed to consume content and data using a mobile efficient format called JSON, and not HTML.
On the back-end, technology teams are upgrading their legacy content and commerce monoliths. This means either removing the ‘head’ from their existing stack to expose the APIs, or replacing it completely with Microservices, API-first, Cloud and Headless (MACH) software that is better suited to driving a modern, mobile-first and multi-headed ecommerce experience.
The key difference between natively ‘headless’ platforms and the legacy web CMS and ecommerce platforms is that they separate (de-couple) the presentation layer entirely. They deliver content and functionality via their API in JSON format (making them ideal for driving PWAs), live in the cloud and are built in a microservices pattern using no-SQL database technologies.
This results in numerous advantages:
1. Flexibility: they seamlessly work with many ‘heads’ simultaneously, including mobile apps, web sites, voice, in-store and other systems.
2. Speed: they deliver content as data via their APIs which can be displayed quickly and efficiently by a PWA, improving the customer experience.
3. Agility: they enable faster and less developer heavy content production and management processes.
4. Scalability and performance: the front-end can be optimised and scaled independently of the back-end.
Software vendors like Amplience have developed products that are specific to a functional area such as content, product information management, search or commerce, as the assumption of the microservices approach is that multiple vendors will be combined together to deliver the complete solution.
In this way the headless and microservices approach breaks down the ecommerce monolith into its component pieces, which can then be replaced wholesale (high risk) or incrementally (a migration pattern known as strangulation).
The result is lower total cost of ownership (TCO), faster time to value and overall improvements to agility and productivity, not to mention significant improvements to front-end performance.
For technologists, the new headless commerce stack seems complete and they are keen to push on and realise the benefits it promises, and yet in my experience marketers, merchandisers and operations teams are reluctant to make the transition.
Why?
One of the key advantages of the web-CMS template model is that presentation and functionality co-exist making it possible to produce an accurate ‘what you see is what you get’ (WYSIWYG) editing experience for content authors, which might also include drag-and-drop UI widgets and content modules, enabling customisation of the page layout and the creation of specific views with non-technical tools.
This puts experience management in the control of business users like merchandisers, who can use this capability to create custom product assortments, or that allow marketers to create sophisticated landing pages that feature marketing promotions, editorial content and live product data and search results.
This capability forms the basis of the experience management tools that feature in the administration consoles of the ecommerce monoliths. So removing the ‘head’ from an existing ecommerce system (or implementing a natively headless commerce platform) means losing the in-built web CMS and associated tools.
In their place developers have been hardcoding the experience into the front-end app, which makes managing the experience a development process, for business users.
And without a way to replace the cross-functional administration consoles that business users interact with daily marketers, merchandisers and operations pros will understandably be reluctant to make the transition to headless.
In short the whole product for headless commerce is incomplete, and the headless and microservices revolution that retailers so urgently need will not happen without new capabilities and tools that close the gap.
The good news is that Amplience has a way to get there and we’ll look at that in Part 2…
