Leading the transformation to a Headless eCommerce platform

With a variety of customer touchpoints and journeys, Miele X’s front-end teams are constantly looking at ways to deliver better online customer experiences. To achieve this, the team is migrating Miele’s eCommerce platform from Monolithic to Headless architecture. It’s a move that will speed up developments and deliver added value for the business. Samin Asnaashari, Front End Architect, and Masoud Rezaie, Head of Front End, both joined Miele X in 2022 and are closely involved in this major change. We talked to them about introducing Headless and what it means for the business.

Why Headless?

Masoud explains that there’s a strong business reason why Miele X needed to look at introducing a new architecture for its eCommerce website. “We started out with a challenge – our current Monolithic architecture needed to adapt to a fast-changing market. So, we needed something that would enable us to validate our business value faster. Headless does that because it gives us the possibility to release our, sometimes new, features to the customer quicker.”

From a development point of view, Samin says Headless gives the Miele X engineers more flexibility by allowing the front-end and back-end teams to work independently and launch new releases on demand. Masoud adds that this is one of the main advantages over the existing Monolithic architecture: “At the moment, we have essentially one application. But we have 26 different customer journeys that are integrated into that one application. So, if an engineer changes something on one of those journeys, it might affect other website functions and create unexpected behaviour or bugs. But with Headless, you don’t have code dependencies. You can treat each component on the website as a micro-front end.”

He explains how each journey is about the customer touchpoints. “Say you’re a customer who wants to buy a washing machine. You start online and pick three features you really want, but you want an advisor to help you pick the best product. So, you go to a local Miele experience centre to see the product, make the decision, and then go back online to buy it. We want to make that a seamless journey with Miele, so you get the same experience, no matter where you start and end it.”

He admits that Headless doesn’t have all the answers to this multi-level digitisation but says it’s definitely a way of moving towards that. At the moment, they’re mainly looking at Headless for the web. “But the pure nature of MACH – which is an acronym that stands for Microservices, API-first, Cloud-native, and Headless – is about splitting up all your core systems and using an Application Programming Interface, or API, as a gateway to these different heads.” He explains that this means the Headless architecture will allow his teams to look beyond online and eCommerce in the future, connecting the product to both the online and offline experience so the customer journey is seamless. “So, the washing machine is a head, the eCommerce platform is a head, the experience centre is a head and our mobile app is a head. And we want to get to a situation where we deliver the same experience across all these different heads.”

He explains that the teams are using Headless architecture on a couple of the customer journeys and are already seeing the difference it makes. “With the legacy architecture, we could only release new developments, say every two weeks, or 26 times a year. But with Headless, we’ve seen up to 26 releases a day! And that’s the business value, because you’re not going to potentially break the whole system – you’re supporting the system while incrementally bringing improved journeys to the customer.”

A complex challenge

The full introduction of Headless is due in 2025, so there’s still a lot of work to do. Samin details what the team has introduced so far. “It’s all about our eCommerce website, and we wanted to start with something with a bit of complexity so we could judge what the business value would be. Therefore, we looked at the Product Listing and Product Detail Pages and then we chose areas that were common for all web pages, such as the header and footer. We’ve also started to look at Headless for the login, user management and customer assistant applications.”

She explains that the next big step brings more complexity, because the new Headless architecture needs to be released in the different Miele markets around the world. Masoud expands on this: “It’s a complex challenge, because we have different journeys across the different countries, and they all have different legislation.”

Samin and her team took a deliberate step-by-step approach to validate their new architecture. They began with the header, footer, PDP/PLP, and Login Page in Austria. Later, they extended this rollout to include the header and login components in various countries such as the Netherlands, UK and Italy, and introduced Headless customer assistance. They focused on resolving technical challenges along the way, particularly in automating data processes for different countries, emphasizing website-based configuration, key management, multilingual support, and SEO optimization. “The country-specific rollouts presented a number of challenges,” she says. “Particularly in acquiring the necessary configuration data – and proper translations – to make the right API calls. We needed to devise a dynamic and scalable solution.” She adds that the move to a Headless architecture also required a re-evaluation of their infrastructure, leading to the development of new workflows and automation.

Setting a technical foundation

Masoud says what excites him about Headless is that there are always new puzzles to solve – and engineers love solving puzzles. He adds that Miele X looks at everything that impacts the customer from the start, which gives engineers the chance to get involved in different areas, such as accessibility and SEO. “I think that’s why it’s fun for engineers, because it’s not about shifting a button a little to the left or right. It’s a new technical foundation for us – and that challenges our minds every day.”

He adds that because the scrum teams are cross-functional, the engineers also get to collaborate with people from various parts of the business. “We bring different qualities together, so you have people from all levels working towards the same goal. They include back-end engineers, product engineers, and QA engineers, all working together to deliver value for the customer.”

For Samin, the key to this was introducing new ways of working. “We looked at how things were done, revised them, developed better versions and created a new approach. It was about looking at the development experience for the engineers – how they work, the tools they use and how we can automate that process so they can focus on quality delivery.” She says this relied on working closely with the business so they understood what the engineers needed in order to deliver for the customer. 

Looking to the future

The team plans to deliver Headless in 2025, but Samin says there will be plenty to do after that. “We’re really focused on the web journey at the moment, but we’ll be refining it and bringing it to the level we want after 2025. So, you just visit your app or website once and have the same experience everywhere.”

For Masoud, that’s only the start. “We’re already building next-generation IT. So, it’s exciting to explore the opportunities with AI and visualisation. It could literally be anything – and that’s the cool part of what we’re doing.”

 

Blog posts

What’s next? You decide.

Search jobs

Help to shape the digital future of one of the world’s best-loved brands.

4
open vacancies
Discover jobs