Kontext

Bauma Stone ist ein belgisches Unternehmen, dass qualitativ herausragende Steine von der ganzen Welt in Form von Verblendungen für Wand und Boden anbietet. Inzwischen beinhaltet der Produktkatalog von Bauma Stone zahlreiche einzigartige Natursteine in allen Formen und Farben.

Zielsetzung

Mit einem wachsenden Sortiment fällt Kunden die Auswahl des passenden Verblendsteins natürlich nicht leichter. Um eine Entscheidungshilfe zu geben, sollte ein Konfigurator geschaffen werden, der es Websitebesuchern erlaubt, alle verfügbaren Wandverkleidungen in drei beispielhaften Räumen zu sehen und mit verschiedenen Wandfarben zu kombinieren.

Mit dem Relaunch der Seite wurde auch der Konfigurator live geschaltet. Drei Räume stehen zur Auswahl – eine Küche sowie ein Wohn- und ein Schlafzimmer.

Mit dem Relaunch der Seite wurde auch der Konfigurator live geschaltet. Drei Räume stehen zur Auswahl – eine Küche sowie ein Wohn- und ein Schlafzimmer.

Herangehensweise

Zwei Komponenten dieses Projekts mussten möglichst früh in der Pipeline geklärt werden: Wie sollten die Räume aussehen und wie stellen wir die verschiedenen Verblendsteine dar?
Für Bauma Stone war klar, dass mit einem Wohnzimmer, einem Schlafzimmer und einer Küche gestartet werden sollte.
Hierzu suchten wir Beispielbilder heraus und ordneten sie drei architektonischen Richtungen zu: Klasissch-Zeitgemäß, Moderner Landhausstil und Nordisch Clean – so konnte der Kunde sich schnell ein Bild einiger verschiedener Stirichtungen machen. Das erlaubte es uns, schnell einen geeigneten Look für die einzelnen Räume zu definieren und in der Modellierung der Räume keine Zeit zu verlieren.

Clay-Rendering Architekturvisualisierung

So genannte Clay Render sehen nicht nur fantastisch aus, sie eignen sich auch hervorragend um über Details in der Geometrie und Belichtung zu sprechen, ohne sich von Farben, Texturen und Materialien ablenken zu lassen. Zur Abstimmung der Raumaufteilung eigneten sie sich hervorragend.

Texturen

Natürlich drehte sich alles um die Texturen. Die Fotos, die uns von Bauma Stone zur Verfügung gestellt wurden, mussten natürlich noch für die Verwendung im Konfigurator vorbereitet werden: Selbst unter Studiobedingungen ist es unheimlich schwierig, Texturen so zu fotografieren, dass Lichteinfall und Farbvariation es ohne weiteres erlauben, Bilder nahtlos aneinander zu knüpfen. Daher mussten Farben und Belichtung angepasst und die Steine selbst so modifiziert werden, dass kachelbare Texturen entstanden.

Die Verblendstein-Elemente bestehen aus einigen aneinandergereihten Steinen. Von diesen Elementen wurden jeweils eins bis vier fotografiert und uns zur Verfügung gestellt. Wir haben die Bilder dann so bearbeitet, dass Belichtung und Farben angeglichen wurden und der Inhalt selbst kachelbar gemacht wurde.

Ebenen zu kombinieren statt für jede Kombination eine eigene Grafik zu erzeugen, erlaubte Ressourcenschonende Bildgenerierung und stellt eine hohe Performance des Konfigurators beim Kunden sicher.

Überlagerungen

Nachdem alle Texturen erstellt, Räume modelliert und Grafiken erzeugt waren, erstellten wir den Konfigurator – und zwar so, dass er in jedem aktuellen Webbrowser laufen konnte.
Mit 6 verschiedenen Wandfarben und über 50 unterschiedlichen Steinverblendungen ergaben sich weit über 300 verschiedene Kombinationen – pro Raum.
Allein aus Performancegründen war es keine wirkliche Option, den Konfigurator für jede Kombination eine komplett eigene Grafik laden zu lassen – deshalb erstellen wir Ausschnitte, die dann im Konfigurator live überlagert werden.