8. Feb 2023

Wie Hirmer seinen Oxid-Webshop mit einem Headless-Frontend modernisierte

Der Münchner Händler für Männermode, Hirmer, wollte seinen Online-Shop auf ein moderneres System migrieren. Um das Risiko möglichst gering zu halten, dockten die Entwickler ein modernes Headless-Frontend an ein altes Oxid-Backend an. Obwohl das Projekt komplex war, lautet das Fazit der Projektverantwortlichen: “Wir würden es wieder tun.”

KPIs definieren

Quelle: Dennis Diatel / Shutterstock.com

Das Münchner Familienunternehmen Hirmer gilt mit seinen drei Marken Hirmer, Hirmer Große Größen und Eckerle seit drei Generationen als Deutschlands erste Adresse für Männermode. Im Hirmer Stammhaus mitten in der Münchner Fußgängerzone dreht sich auf 9.000 Quadratmetern und fünf Etagen alles um den Mann – inklusive Hochzeitsservice, Maßkonfektion und Personal Shopping. Für Männer, die Mode in Übergrößen benötigen, betreibt Hirmer 15 Filialen des Ablegers Hirmer Große Größen. Und auch in den neun Filialen von Eckerle finden Herren eine reichhaltige Auswahl an Business- und Casual-Herrenmode in Premium-Qualität.

Aus den Hirmer- und Eckerle-Filialen sind die Kunden einen erstklassigen Kundenservice gewohnt. Diese Customer Experience will der Händler auch in seinen Online-Shops bieten und hat dazu in der Vergangenheit auch schon eine Reihe von digitalen Services entwickelt. So können beispielsweise Kunden, die gerade keine Zeit für einen stationären Einkauf haben, über das Internet eine Beratung mit den Verkäufern vor Ort buchen und sich so die neuesten Kollektionen präsentieren lassen. “Der Online-Shop ist für unsere Stammkunden ein wichtiger Kanal, um zu recherchieren. Und für uns ist der Shop ein wichtiger Umsatzkanal, den wir natürlich weiterentwickeln wollen”, sagt Michael Hobelsberger, Bereichsleiter E-Commerce bei Hirmer.

Ein veraltetes Tech-Stack erlaubt nur wenig Innovation

Dabei gab es allerdings eine Hürde. Der Tech-Stack, auf dem die Online-Shops von Hirmer basieren, lief zwar zuverlässig und stabil. Doch einzelne Systeme und insbesondere das Frontend waren so unflexibel, dass Erweiterungen und neue Features nur noch mit hohem Aufwand zu programmieren waren. “Wir hatten diverse Herausforderungen und unser Wunschkonzept war ursprünglich, alles auszutauschen”, erzählt Frederic Worm, Head of Shop Technology bei Hirmer. “Aber hätten wir das Shop-Backend auch ausgetauscht, hätten wir ab der Warenwirtschaft bis nach vorne eine komplette Baustelle gehabt. Das Risiko erschien uns einfach zu hoch. Daher haben wir uns für einen anderen Weg entschieden.”

Der allerdings war nicht minder mutig: Denn mit Unterstützung seiner Technologiepartner SHOPMACHER und Deutsche Daten Portal- und Plattformlösungen beschloss Hirmer, als ersten Schritt in Richtung Modernisierung sein bestehendes Oxid-Backend zu behalten und das Frontend mit der Frontend-as-a-Service-Lösung von Frontastic (inzwischen: “commercetools Frontend”) in Headless umzubauen. Zusätzlich implementierten die Entwickler ein modernes PIM von ACL und eine neue Order-Management-Lösung von der Firma ACL. „Wir nutzen nicht die neueste Oxid-Version, sondern eine ältere Version. Da bestand durchaus ein gewisses Risiko, dass das Projekt scheitert”, konstatiert Hobelsberger.

Viele Frontends auf einen Streich und mehr Flexibilität für das Marketing-Team

Doch die erhofften Vorteile überwogen die Befürchtungen. Überzeugt hat das Hirmer-Team vor allem, dass die Entwickler mit einer Headless-Lösung nicht nur das Frontend für den Shop neu bauen können, sondern auch andere digitale Kunden-Touchpoints. Und genau das plant der Herrenmodehändler: “Ein Frontend für unsere Kundenkartenbesitzer muss anders aussehen und funktionieren als das Shop-Frontend, auch wenn es mit derselben Technologie gebaut ist und dieselben Schnittstellen bedient”, sagt Hobelsberger. Und auch über App-Technologie und PWAs denkt der E-Commerce-Chef bereits nach.

Frederic Worm erhofft sich von der Umstellung darüber hinaus, dass das Marketing künftig stärker content-getrieben arbeiten und Inhalte flexibler spielen kann: “Eines der großen Probleme der bestehenden Lösung war beispielsweise, dass die Art und Weise, wie Seitentypen aufgebaut werden, sehr starr ist. Da gibt es die Detailseite, die Kategorieseite und die Markenseite. Und auf allen ist man festgelegt, wo Content gespielt werden kann”, schildert der Head of Technology. Mit Frontastic könne man zusätzlich zu den Standards auch mal Landing-Pages bauen, auf der zum Beispiel Listen ganz anders zusammenspielen, ohne dass dafür ein hoher neuer Entwicklungsaufwand entsteht.

Projektziel war kein fertiger Online-Shop, sondern kompetente Inhouse-Entwickler

Zusammen mit den Agenturpartnern SHOPMACHER und Deutsche Daten wurde die Migration im Detail geplant. Ein wichtiges Ziel des Projektes war auch, die internen Entwickler von Hirmer dabei zu unterstützen, Stück für Stück selbst Wissen aufzubauen, um den Online-Shop zukünftig kontinuierlich weiterentwickeln zu können. Dass die Zusammenarbeit der drei unterschiedlichen Projektpartner reibungslos funktionierte, sieht Michael Hobelsberger nicht als Selbstverständlichkeit an. “Wir hatten kein Pflichtenheft und sind sehr agil vorgegangen”, sagt er. “Dass alle perfekt zusammengearbeitet haben und sich nicht gegenseitig die Fehler in die Schuhe schoben, obwohl im Projekt eine Menge Sprengstoff war, spricht wirklich sehr für SHOPMACHER und Deutsche Daten.”

Tatsächlich war das ganze Projekt in seinen Abhängigkeiten deutlich komplexer als ursprünglich gedacht. “Wir haben uns alle gründlich verschätzt”, geben Worm und Hobelsberger offen zu. Ein Beispiel: Die Suchlösung Algolia lässt sich zwar einfach mit dem Steuermodul von Frontastic anbinden, aber nur dann, wenn Algolia mit den Standardmodulen von commercetools befüllt wird. Im Falle von Hirmer allerdings passte das Standard-Stack von commercetools überhaupt nicht zu den Anforderungen an Datenformate von Hirmer. Die Standardlösung von Frontastic war für den Händler also gar nicht anwendbar. Stattdessen musste ein komplettes Modul entwickelt werden, das so mit Algolia spricht, wie es die Daten von Hirmer erfordern.

Ein “astreines Ergebnis” war alle Mühe wert

Trotzdem bereuen Hobelsberger und Worm ihre Entscheidung nicht. “Das Ergebnis ist astrein und ich würde es wieder so machen”, sagen beide. Positiv bewerten die Hirmer-Digitalen unter anderem, dass sich die User Experience des Shops quasi wie von selbst verbessert hat, obwohl es ursprünglich keine konkreten Vorgaben gab. Auch da haben die Agentur-Teams von SHOPMACHER und Deutsche Daten und die internen Hirmer-Entwickler mitgedacht und beispielsweise Produktlisten und Filter überarbeitet. Auf Basis des neuen PIM in Kombination mit dem Headless-Frontend können Online-Kunden ihre Wunschprodukte heute nicht mehr nur auf Basis von Farbe, Marke, Preis oder Größe die Sortimente filtern lassen, sondern haben je nach Produktkategorie zahlreiche verschiedene Kriterien wie Kragenform oder Zahl der Knöpfe am Revier zur Verfügung. “Das wäre in der Bedienbarkeit und der Übersichtlichkeit ohne die neue Technologie im Frontend nicht so elegant darstellbar gewesen”, ist Worm überzeugt.

Schlussendlich hofft der Münchner Traditionshändler auch, durch den Umstieg auf moderne Frontend-Technologien schneller geeignete Mitarbeiter zu finden. “Mit den alten monolithischen Technologien bekommt man keine Entwickler mehr”, so Worm. “Die können sich ihren Arbeitsplatz ja aussuchen.”

Der erste Shop mit neuem Frontend, Eckerle.de, ist bereits online. Hirmer und Hirmer Große Größen sollen sukzessive im Februar folgen. Für andere Händler, die auf Altsystemen sitzen und diese nicht auf einen Schlag auswechseln wollen, kann Hirmer als Blaupause gelten. Die Erfahrung zeigt: Man kann an ein altes Backend auch ein modernes Frontend anbinden. Das ist zwar anstrengend und manchmal komplexer als gedacht. Aber die Mühe lohnt sich.

AUCH INTERESSANT

Sieben Tipps für ein nachhaltigeres E-Commerce-Tech-Stack

Sieben Tipps für ein nachhaltigeres E-Commerce-Tech-Stack

Wir haben zusammengefasst, wie ein nachhaltiger E-Commerce-Tech-Stack den CO2-Ausstoß reduziert: Einsatz von Cloud-Lösungen, Auswahl energieeffizienter Server, Nutzung modulbarer Architekturen, Anwendung von Öko-Webdesign, Implementierung effizienter CDNs, Recycling veralteter Hardware und transparente Nachhaltigkeitskommunikation führen zu einem umweltbewussteren Online-Handel.

mehr lesen
Campus Tag mit der WHS Bocholt

Campus Tag mit der WHS Bocholt

Campustag bei SHOPMACHER: Einblick in unsere Arbeit, Austausch mit IT-Studenten und Präsentation unserer globalen Expertise. Lebendige Diskussionen und praktische Beispiele.

mehr lesen
Cookie Consent Banner von Real Cookie Banner