Produktkonfigurator für führenden Leuchtenhersteller
Erstellung eines Produktkonfigurators für Beleuchtungssysteme zur Erleichterung der Arbeit für Kund:innen, Lichtplaner:innen und Monteur:innen.
Die Regent Beleuchtungskörper AG ist ein 1908 gegründetes Familienunternehmen mit Firmensitz im schweizerischen Basel.
Seit 1945 vertreibt Regent ausschließlich Beleuchtungskörper. Mit rund 600 Mitarbeiter:innen in sechs Ländern und 35 Partner weltweit ist Regent mittlerweile einer der führenden Leuchtenhersteller in Europa und hat sich zum Ziel gemacht, Arbeits- und Lebensräume von Menschen zu verbessern.
Herausforderung
Regent ist auf der Suche nach „erhellenden und inspirierenden Lösungen“. Um dieses Ziel zu erreichen, sind interne und externe Lichtplaner:innen darauf angewiesen, die Leuchten für ihre jeweiligen Zwecke zu konfigurieren. Speziell bei Lichtkanalsystemen gibt es unzählige Ausführungen und Kombinationsmöglichkeiten. Bei den Produktlinien „Channel S“ und „Purelite Slim“ lief der Prozess bisher über interne Excel-Tools.
Über die vergangenen Jahre hinweg wuchs die Datenmenge so stark an, dass das bisherige System an seine Grenzen stieß und lediglich Leuchten in i-Form, also in gerader Form, geplant werden konnten. Die Erstellung des Plans eines Leuchtensystems in einer S- oder Z-Form dauerte mehrere Stunden. Die Datenpflege und das Arbeiten mit den komplexen Excel-Listen kosteten viel Zeit.
Ziel von Regent war deshalb eine Prozessoptimierung. Der neue Konfigurator soll aber nicht nur für die interne Planung genutzt werden, sondern potenziellen Kund:innen die Möglichkeit geben, Leuchtensysteme in verschiedensten Konfigurationen zu erstellen. So sollen Planungsbüros und Lichtplaner:innen angesprochen werden und auch Nutzer:innen ohne detaillierte Kenntnisse Planungen vornehmen können.
Je nach Architektur gibt es verschiedene Anforderungen, die über Lichtfarbe und Leuchtenform gelöst werden können. Ein Konfigurator muss deshalb jedes Detail beachten. Wichtig war Regent außerdem die Bearbeitung und Berechnung der Leuchten in Echtzeit. Am Ende der Konfiguration soll ein Plan des Leuchtensystems stehen, der Lichtplaner:innen und Monteur:innen alle nötigen Daten an die Hand gibt und zugleich ein erstes Angebot erstellt.
Herangehensweise
Die Verantwortlichen von Regent hatten zum Start des Projekts klare Vorstellungen. In einem Anforderungsworkshop wurden diese Vorstellungen im Hinblick auf das Projekt definiert und in Rücksprache mit unseren Berater:innen und Entwickler:innen angepasst.
Im Anschluss fand ein Treffen am Unternehmenssitz in Basel statt. Durch das Ambiente, das bereits in der Empfangshalle zu spüren war, wurde der hohe Anspruch des Kunden immer klarer. In Gesprächen mit internen Lichtplaner:innen wurde der Weg hin zum fertigen Konfigurator diskutiert und skizziert.
Nach dem Austausch ging es direkt in die Umsetzung. Die Entwickler:innen konnten auch abseits des Designs direkt mit ihrer Arbeit beginnen. Nach mehreren Iterationsschleifen im Design wurde die Technik sukzessive erweitert, ehe später diese beide Aspekte zusammengeführt werden konnten.
Zeitersparnis durch Prozessoptimierung
Der größte Wunsch des Unternehmens hat gleichzeitig den größten Vorteil nach sich gezogen. Durch die Prozessoptimierung können die Konfigurationen in S- und Z-Form statt in mehreren Stunden nun in wenigen Minuten erstellt werden. Die Mitarbeiter:innen können sich statt der Planung nun wesentlich schneller anderen Aufgaben zuwenden und haben mehr Zeit für die tatsächliche Beratung ihrer Kund:innen.
„Die manuelle Planung von Lichtlinien erfordert ein detailliertes Produktwissen und eine sorgsame Arbeitsweise, um Fehler zu vermeiden. Der Online-Konfigurator ermöglicht nun auch neuen Mitarbeiter:innen eine sofortige fehlerfreie Planung.“
Klare Anleitungen für alle Arbeitsprozesse
Bei der Planung der Leuchtensystem durch den Konfigurator profitieren alle Beteiligten. Für die Kund:innen sind schnell mögliche Kosten einsehbar. Die Mitarbeiter:innen von Regent können neben der eigenen Planung auch auf die Konfigurationen der Kund:innen zugreifen und so beraten, ob das Angebot wirklich für den Zweck der Kund:innen geeignet ist.
Lichtplaner:innen und Ingenieurbüros erhalten durch den Konfigurator detaillierte Informationen über die Leuchten und können so für ihre Zwecke planen. Außerdem stehen am Endes des Prozesses auch Anleitungen für Monteur:innen bereit, die je nach Art der Leuchte schnell sehen, wie diese montiert werden sollen.
Alle Daten auf einen Blick
Die Informationen und Daten, die Lichtplaner:innen und Büros erhalten, werden durch den Konfigurator auf einen Blick zur Verfügung gestellt. So stehen neben einer ausführlichen Installationsmappe auch alle wichtigen Downloads zur Verfügung.
Lichtplaner:innen profitieren außerdem davon, dass vom Konfigurator auch die passenden und gängigsten Austauschformate wie ROLFZ oder Dialux ausgegeben werden. So können sie direkt in ihrer gewohnten Planungssoftware weiterarbeiten und sparen sich so Zeit.
Mit Call-to-Action zu neuen Kund:innen
Am Ende der Planung mit dem Konfigurator kommen die Kund:innen durch einen Call-to-Action mit Regent in Kontakt. Mögliche Konfigurationen können mit Berater:innen von Regent besprochen werden und durch den Abschluss der Konfigurationen wird den Kund:innen ein Angebot vorgelegt.
Konfigurationen gemeinsam einsehen und beraten
Für jede Konfiguration erstellt das System einen einzigartigen Code, durch den die Nutzer:innen die Planungen zu einem späteren Zeitpunkt wieder einsehen können. Außerdem speichert das System den Code und ermöglicht es, dass Kund:in und Mitarbeiter:in gemeinsam Planungen einsehen können. So ist die Beratung zielgerichtet und beide Seiten haben den gleichen Wissensstand.
„Der Konfigurator reduziert unseren Planungsaufwand auf ein Minimum. Gleichzeitig ermöglicht er unseren Kund:innen eine selbstständige Konfiguration. Neben den lichttechnischen Daten erhalten sie auch einen Angebotspreis, damit die Planung vervollständigt werden kann.“
Nutzerfreundliches Benutzerinterface dank React
Für die Ausgabe des Konfigurators im Frontend der Website wird die Java Script Bibliothek „React“ genutzt. Diese ermöglicht es, die Konfiguration schnell umzusetzen. Im Gegensatz zu anderen Lösungen bleiben die Nutzer:innen auf nur einer Seite.
Das ist möglich, da durch React nicht die komplette Seite neu geladen werden muss, sondern lediglich einige Inhaltselemente ausgetauscht werden. Das ermöglicht die schnelle Reaktionsgeschwindigkeit und Echtzeitberechnung des Konfigurators.
„Von der Idee zur Bestellung in wenigen Klicks war unsere Vision. Mit dem Konfigurator kann jede:r in wenigen Sekunden auch komplexe Formen erstellen. Für alle ist er ein riesiger Prozessbeschleuniger und steigert neben der Effizienz auch die Product Experience. Ein großer Dank an das Team von medienreaktor für die tolle Umsetzung.“
Einfache Datenverwaltung im Backend
Auf der anderen Seite stand die einfache Datenpflege für die Mitarbeiter:innen im Fokus. Durch das Content-Management-System (CMS) Statamic werden die Daten des Konfigurators strukturiert und verwahrt. Statamic ist ein Flat-File-CMS und bietet eine übersichtliche Benutzeroberfläche.
In diesem CMS wurden mehrere Sets von Regeln definiert, die je nach Produktlinie im Konfigurator geladen werden und so die valide Konfiguration garantieren.
Erweiterbares Regelwerk
Das Herzstück des Konfigurators ist das erweiterbare Regelwerk. Dieses Regelwerk berücksichtigt alle Abhängigkeiten der gepflegten Leuchtenserien. Das Regelwerk ist über das Backend bearbeitbar und kann so kontinuierlich gepflegt werden. Es existieren Basis-Regeln, es können aber auch individuelle Rule-Sets für einzelne Serien erstellt werden.
Fazit
Mit dem neuen Online-Konfigurator bietet Regent Kund:innen, Lichtplaner:innen und Monteur:innen einen Service, der zu großer Zeit- und Aufwandsersparnis in allen Bereichen führt.
So ändern sich die Prozesse für Regent merklich, die Digitalisierung des Unternehmens schreitet voran. In Zukunft soll der Konfigurator um weitere Produktserien ergänzt werden.
Leistungen
- Beratung, Konzept und Inhaltsworkshop
- Prozessdigitalisierung
- Integration von Schnittstellen und Drittsystemen
- Wireframes und Prototyping
- Moodboards und Screendesign
- UI/UX-Design
- React- und Frontend-Entwicklung
- Datenpflege-Backend mit Statamic
- Weiterentwicklung und Support