Here's a quick summary of everything we released in Q1 2024.

Komax Group breaks down monolithic setup with Hygraph and builds website 3 times faster

Book a demo
Hygraph customer success story - Komax Group
  • Up to 70%

    Decreased loading time

  • 3

    Times faster to iterate website elements

  • 0.8s

    Largest contentful paint

Since the product will evolve quite fast, we think Hygraph's component approach will help us in the right direction.
Stefan Malär
Managing Partner, oddEVEN

Use case

Composable website and B2B customer portal

Industry

Engineering

Previous stack

Sitecore, Custom-built .Net Portal

The Komax Group story

With its sales and service networks worldwide, Komax is steadily growing and making strategic acquisitions to improve its offerings to customers. 

With Komax Group's business growing, the monolithic infrastructure in place has presented particular challenges for providing a modern digital experience to customers, such as slow time-to-market, inefficient content workflow, and scalability issues. Therefore, Komax Group embarked on the replatforming journey with its digital agency oddEVEN.

As part of the project, Komax Group aimed to develop a new website with a customer portal, in which a CMS would play a central role. Having outgrown its legacy CMS, Komax Group now uses Hygraph to build a modernized architecture and deliver unified customer experiences.

undefined

Project challenges


A deeply coupled system that couldn’t cut it anymore

The legacy architecture of Komax Group was based on a monolithic, on-premise system consisting of Sitecore and .Net applications, which were tightly coupled and slowed development. As a result, whenever something needed to be changed, it would always impact the entire system, and even adding a minor feature was time-consuming. Furthermore, the CMS did not have an optimal cost/benefit ratio.

Poor editorial experience that hinders content velocity

Komax Group had many editorial hiccups using the previous CMS. The Marketing team found the user interface not intuitive enough to locate files, and it wasn't easy to onboard new editors. Formatting was not always consistent when text was copied, requiring HTML code to be edited. As a result, Komax Group had a limited number of team members proficient in using the CMS. Consequently, even basic tasks like video uploads had to be outsourced to their digital agency. In addition, the CMS was not connected to other systems, so a straightforward update in the PIM system had to be copied manually to the CMS. 

When the Marketing team wanted to upload a video, they had to send it to the agency. They would upload it to a platform and send it back with an ID for insertion into the previous CMS. It was very time-consuming.

Natalie Wieser, Digital Services Product Owner at Komax

Project objectives:


Break down monolithic architecture with headless solutions

Komax Group understood the need to take a composable approach with their new architecture, which allowed them to optimize the customer experience through best-of-breed services. It makes more sense for different products to work with each other cohesively than being tightly coupled. Komax Group also had to consider all the dependencies, systems, and departments involved – essentially, they should have an integration layer to connect data to the frontends via APIs. So, instead of consolidating a stack where each system has its own siloed setup, Komax Group decided to adopt a modular and headless architecture that would free them up and allow different parts of the system to intercommunicate via APIs.

Deliver future-ready customer digital experience

As an industry leader, Komax Group must think long-term. The team is now challenged to extend its customer offerings in innovative ways, such as providing more self-services, IoT services, and fully automated services. Komax Group sets itself apart from the competition by taking the first step with an improved customer experience platform. 

Hygraph’s solution: 

Having outlined the architecture for the POC, it became clear that Komax Group will use a headless approach, where data will be retrieved from the CMS, PIM, and CIAM (Customer Identity Access Management) and delivered to the frontend via APIs.

In looking for a headless CMS, it's crucial that it is well-integrated with the system stack. Hygraph's GraphQL-native APIs and flexible components approach set it apart from the shortlisted vendors. Komax Group chose Hygraph, trusting that Hygraph's team of experts would walk alongside them throughout the project and help them iterate solutions quickly.

Komax Group primarily benefited from the following features of Hygraph for this project:

Stellar website performance with GraphQL APIs

GraphQL is Komax Group's API of choice across its stack for its flexibility to support different consumers, minimize over-fetching of data, and it can be easily evolved and is self-documenting. There is also a lot of related data for the Komax Group digital service, which is easy to query with GraphQL. It was vital that the CMS had performant and comprehensive GraphQL APIs to integrate into the system easily. 

Being a GraphQL-native CMS, Hygraph can adequately support the API requirements for Komax’s project. Hygraph provides powerful GraphQL APIs and supports them with one of the industry's most advanced high-performance endpoints. Hygraph serves all content via GraphQL APIs, with no frontend, tooling, or platform restrictions, ensuring that data remains accurate and manual entry mistakes are eliminated. 

A general GraphQL approach also offers more possibilities to connect the CMS with other third-party applications later. In addition, Hygraph's unique Content Federation approach offers future possibilities for federating content from external sources. 

Essentially, this means that developers can optimize performance by delivering content via APIs, which reduces page load times and provides a faster, more responsive user experience.

Agile editing with modular components

Komax Group is not only a mechanical engineering company but also offers a wide range of services for wire processing. Therefore, Hygraph's modular components are crucial in enabling Komax Group to build pages to present offerings along the value chain flexibly.

When setting up the schema, Komax Group defined a series of components that can be reused across multiple content models, such as banners, buttons, and download cards, to name a few. Then, they used the modular component field inside Hygraph to host those components. This has enabled Komax Group to build their pages in a modular way, where they can easily add, remove, and compose a fine selection of components in a content entry and reuse them on other content models as they want. 

This means editors can experiment with content based on business insights without having to involve developers. Since a modular component model offers no limitations on how many components can be added, developers can now easily modify and extend the model as per editors' request.

undefined

Easy onboarding with an efficient workflow

Hygraph’s clean UI, granular user roles, and permissions made the editorial process easier for content editors. Komax Group created several custom role types, each with unique permissions to handle content and projects in Hygraph. Any CMS user can now add, fix, and change content without involving developers or worrying about changing data the wrong way.

In addition to the product feature, Komax Group appreciated the Hygraph team's efficiency in responding to their requests and guiding them through using the product. Behind a powerful stack, it is a professional team that makes Hygraph clients happy with the product.

The tech stack

To break down the overall monolithic architecture, Komax Group started by replacing some on-premise solutions with cloud solutions as a first step. Later, with the adoption of Hygraph and many other headless solutions, Komax Group launched an entirely new architecture for their website last year. Currently, they are building a login area on the website that will be the new customer portal. They plan to incorporate all digital services step by step.

Previously, the Komax Group website and its customer portal had separate frontends built on top of Sitecore. With the new architecture, Komax Group uses the Nuxt 3 app on the frontend that connects to several APIs and fetches data accordingly. In addition to Hygraph, it also connects to a GraphQL integration layer to get information like PIM data. Instead of tightly integrating frontend components from various systems, Komax Group now has a decoupled frontend that consumes APIs. 

undefined

The result and key benefits

By using Hygraph, Komax Group is able to create a website with an extendable system and develop new use cases easily. Now, the headless setup is flexible enough that Komax Group developers can integrate not-before-known requirements without changing many things, and content editors can spin up new pages quickly with modular page components.

Komax Group is now at the beginning of their new portal modernization process. Their pilot solution consists of several digital services, which they will step by step integrate into the customer portal and build up new services. Ultimately, Komax Group will offer customers a combination of digital services and value-added services.

When it comes to measurable results:

  • The elements on the website can now be added much faster than ever before to meet evolving customer expectations, which is a 2 or 3 times speed acceleration over the past.

  • Overall loading times have been drastically reduced. Depending on the locale, the reduction can reach 70%.

  • There is an overall uplift for all core web vital metrics, including the largest contentful paint, which decreased from 5.0s to 0.8s.

undefined

Sign up for our newsletter!

Be the first to know about releases and industry news and insights.