Maximierung von Funktionalität, UX und Performance: Klapsters fotorealistischer 3D-Konfigurator

Mehr Funktionalität und Skalierbarkeit für Klapster mit Shopware 6

Im Jahr 2020 entwickelten Lukas Wagner, Bastian Amberg und Katja Becker – damals tätig beim Interior-Design-Studio raumvonwert in Frankfurt am Main – eine Idee aus eigener Erfahrung: eine Treppe, die sich bei Nichtgebrauch platzsparend an die Wand klappen lässt. Daraus entstand Klapster – ein modulares, vollständig konfigurierbares Treppensystem für vielfältige Einsatzbereiche.

Das innovative Produkt stellte zugleich hohe Anforderungen an Beratung und Individualisierung. Die bestehende Website konnte diesen Bedarf nicht effizient abbilden. Ziel war es daher, Beratung und Angebotsprozesse zu automatisieren, die Plattform international skalierbar zu machen und ein intuitives Nutzererlebnis zu schaffen.

Klapster verfolgte dabei klare Prioritäten: die Reduktion manueller Aufwände, die Integration eines fotorealistischen 3D-Konfigurators sowie die Bereitstellung mehrsprachiger Inhalte und regionaler Zahlungs- und Versandoptionen. Shopware 6 bietet die notwendige Flexibilität und Skalierbarkeit, um diese Anforderungen umzusetzen.

Die Herausforderung

Zentral war zunächst die nahtlose Integration des neuen Webshops in die bestehende Systemlandschaft. Geschäftskritische Daten – darunter Bestellungen, Lagerbestände und Kundendaten – mussten systemübergreifend konsistent und in Echtzeit verfügbar sein.

Mit Shopware konnte Klapster zentrale Prozesse automatisieren, darunter:

• die Synchronisation von Bestell- und Kundendaten

• die Verwaltung von Lagerbeständen und Nachbestellungen

• die Pflege von Produktdaten, Kategorien, Bildern und Sendungsinformationen

Parallel dazu erforderte das Geschäftsmodell weiterhin intensive Kundenberatung. Shopware ermöglichte es, auch diese Prozesse zu strukturieren und zu automatisieren – von der Bearbeitung von Anfragen über die Terminplanung bis hin zu individuellen Produktempfehlungen.

Ein weiterer Fokus lag auf der Nutzerautonomie. Kunden sollten in die Lage versetzt werden, eigenständig Konfigurationen zu erstellen. Dafür wurden folgende Funktionen notwendig:

• ein integrierter 3D-Treppenkonfigurator mit hoher visueller Qualität

• verständliche und zugängliche Installationsanleitungen

• präzise technische Zeichnungen mit exakten Maßangaben

Die Lösung

Kernstück der neuen Plattform ist ein fotorealistischer 3D-Konfigurator auf Basis von Vue.js. Dank des API-first- und Headless-Ansatzes von Shopware ließ sich dieser nahtlos und performant in den Webshop integrieren.

Darüber hinaus konnte Klapster:

• die Content-Erstellung mit Shopping Experiences deutlich vereinfachen

• über 40 individuelle CMS-Blöcke implementieren

• ein maßgeschneidertes FAQ-Modul integrieren

• mehrsprachige Inhalte bereitstellen

• regionale Zahlungs- und Versandmethoden über Mollie anbieten

• Xentral ERP und Klaviyo vollständig anbinden

• zentrale Prozesse durch die Integration von Klaviyo und cal.com automatisieren

Die Plattform ist damit in der Lage, komplexe Konfigurationen und hohe Zugriffszahlen zuverlässig zu verarbeiten.

„Shopware war für Klapster die klare Wahl, da es eine flexible Headless-Architektur mit leistungsstarken B2C- und B2B-Funktionalitäten kombiniert. Die nahtlose Integration mit unserem 3D-Konfigurator, Xentral und Klaviyo ermöglicht es uns, manuelle Prozesse zu automatisieren, fotorealistische Konfigurationen in Echtzeit bereitzustellen und international mit regionalisierten Checkouts zu skalieren.“ – Tobias Nottebohm, raumvonwert GmbH

Zusammenarbeit als Erfolgsfaktor

Die Grundlage des Projekts wurde früh gelegt: Die Teams von raumvonwert, Schaltwerk und Entwickler Leon Vogler arbeiteten von Beginn an eng zusammen. Ziel war es, eine konsistente und leistungsfähige Verbindung zwischen Konfigurator und Commerce-Plattform zu schaffen.

Die Entscheidung für eine Vue-basierte Frontend-Architektur im Headless-Setup ermöglichte maximale Flexibilität und Performance. Kontinuierliche Abstimmungen zwischen UX, Entwicklung, Testing und Projektmanagement stellten sicher, dass alle Komponenten optimal ineinandergreifen.

Das Ergebnis ist eine integrierte Lösung, bei der technologische Exzellenz und Nutzerzentrierung konsequent zusammengedacht wurden.

Die Ergebnisse

Klapster hat seine Positionierung als innovative, designorientierte Lifestyle-Marke deutlich gestärkt.

Die Zusammenarbeit zwischen Klapster und Shopware zeigt exemplarisch, wie sich Innovationskraft und technologische Leistungsfähigkeit verbinden lassen, um differenzierte Kundenerlebnisse zu schaffen.

„In Zukunft werden wir unseren composable Stack um zusätzliche Konfigurator-Funktionen erweitern, die Personalisierung durch Klaviyo weiter vertiefen und Augmented-Reality-Features einführen.“ – Tobias Nottebohm, raumvonwert GmbH