Direkt zum Inhalt

Website Relaunch Vetrotech Saint-Gobain

Vetrotech Saint-Gobain AG ist Teil der Saint-Gobain-Gruppe und einer der weltweit führenden Hersteller von hochleistungsfähigem Brandschutz- und Sicherheitsglas für die Bau- und Seefahrt-Industrie. Das Unternehmen ist in mehr als 60 Ländern aktiv. Mit der neuen Website soll die zentrale und zukunftsfähige Basis für alle weiteren digitalen Marketingaktivitäten geschaffen werden.

Die Website vetrotech.com soll in mehreren Sprachen zur Verfügung gestellt werden. Die Verfügbarkeit von Produkten ist von Land zu Land unterschiedlich, daher unterscheidet sich auch der Bedarf an Informationen entsprechend. Vetrotech möchte bei der Erstellung der Websites so selbstständig und damit unabhängig wie möglich arbeiten können.

Im Fokus des Relaunchs standen neben einem fortschrittlichen Design im Frontend eine hohe Flexibilität für die Redakteure durch Modularität, ein komplexes Länder-Sprachen-Handling sowie ein effizientes Translation Management. Die Website basiert auf Drupal 8 und wurde in Kooperation mit der Zürcher Kreativagentur Notch Interactive umgesetzt.

Startseite von vetrotech.com

Besonderheiten

Neben der Umsetzung des anspruchsvollen Designs mit zahlreichen verschiedenen Inhaltstypen und -elementen hatte der Kunde die Anforderung, jedes Element selbstständig pflegen und übersetzen zu können. Hierzu zählten nicht nur einfache Inhalte, sondern auch sämtliche Labels der Website, die im Frontend sichtbar sind. Dies ermöglicht den Redakteuren, eine neue Sprachversion der Website vorzubereiten und online zu stellen, ohne auf Drupal Entwickler angewiesen zu sein.

Flexibilität für Redakteure

Der Einsatz von Paragraph Browser erleichtert den Redakteuren die Suche nach dem richtigen Inhaltselement.
Paragraph Browser
Den Redakteuren stehen über 50 Inhaltsbausteine zur freien Gestaltung zur Verfügung. Um bei den zahlreichen Gestaltungsmöglichkeiten eine hohe Usability zu gewährleisten, hat unser Team besonderen Fokus auf die Module Paragraphs, Paragraph Browser und Entity Browser für Inhalte und Medien gelegt. Darüber hinaus wurde sehr viel Wert auf sinnvolle Gruppierung und Beschreibung aller Felder gelegt, um die Redakteure in ihrer täglichen Arbeit zu unterstützen.

Sprachen-Länder-Handling

Um doppelte Contentpflege und zeitraubendes copy and paste zu vermeiden, wurde ein gemeinsames Backend zur zentralen Datenpflege entwickelt. Das gesamte Regionen- und Länder-Handling wurde in Drupal über Taxonomien abgebildet. Zusammenfassung:

  • Automatische Zuordnung des Landes und der Sprache inkl. Fallback.
  • Der Kunde kann pflegen, welche Sprachen in welchem Land verfügbar sind.
  • Die Verfügbarkeit von Produkten ist pro Land unterschiedlich, entsprechend unterscheiden sich auch die relevanten Inhalte pro Land. Um die Pflege dieser Daten schlank zu halten, kann eine Inhaltsseite mehreren Ländern zugefügt werden – anstatt pro Land alle Inhalte neu zuordnen zu müssen.
  • Je nach Verfügbarkeit der Inhalte unterscheiden sich natürlich auch die Menüs. Die Menüs können auch individuell gepflegt und je Land individuell zugewiesen werden. Anschließend werden sie nach der Sprachenerkennung entsprechend ausgeliefert.
  • Neben der Zuordnung von Inhalten zu Ländern können auch Länder zu Regionen (in diesem Fall Kontinente) zusammengefasst werden.
Der Website Besucher kann seine Region und anschließend aus den verfügbaren Sprachen wählen.

Übersetzbarkeit und Translation Management

  • Es wurde das Translation-Management-Tool eingesetzt und auf die individuellen Anforderungen von Vetrotech angepasst. Der Einsatz des Tools spart den Redakteuren viel Zeit und ermöglicht eine komfortable Zusammenarbeit mit externen Übersetzungsdienstleistern, da es außerhalb von Drupal läuft (einfacher Export der zu übersetzenden und Import der übersetzten Datei inkl. Versionsverlauf). Die externen Dienstleister sind frei in der Wahl ihrer Tools.
  • Im Vergleich zu „normalen“ Inhaltsübersetzungen sind zusätzlich viele Elemente pfleg- und übersetzbar, die sonst i.d.R. hart im Code verankert sind und durch Entwickler übersetzt werden müssen.

Menü: headless mit Angular JS im Frontend

Die komplexe Menüstruktur mit 4 Ebenen und vielen Unterpunkten wurde headless mit Angular JS im Frontend entwickelt.

Die komplexe Menüstruktur mit 4 Ebenen und vielen Unterpunkten wurde headless mit Angular JS im Frontend entwickelt. Um die Anforderungen des Kunden an das Menü abbilden zu können, hat unser Team selbst eine komplexe Taxonomiestruktur mit vielen individuellen Einstellungsmöglichkeiten aufgebaut. Vetrotech hat auch hier zahlreiche Möglichkeiten zur individuellen Gestaltung der einzelnen Elemente.

Download Center: hohe Ladegeschwindigkeit ohne Reload

Ein Download-Center stellt Kunden sowie Vertriebsmitarbeitern einen hohen Umfang an Dokumenten, wie Produktdatenblätter und Broschüren, übersichtlich und einfach filterbar zur Verfügung. Hierfür wurde ein ausgeklügeltes Filtersystem entwickelt, das durch die Redakteure gepflegt und nach ihren Wünschen erweitert werden kann. Die Filter sind aufeinander aufbauend und voneinander abhängig, was den Besuchern die Navigation im Downloadbereich erleichtern soll. Es gibt einen Bereich für anonyme Besucher sowie einen Bereich für eingeloggte User. Auch hier spielt das Sprachen-Länder-Handling inkl. Translation Management eine wichtige Rolle, da jedes Land einen individuellen Bestand an Dokumenten hat.

Das Download Center wurde wie das Menü headless mit Requests an Drupal und Angular JS im Frontend umgesetzt. Die Komplexe Filterung erfolgt über REST Requests, um eine hohe Ladegeschwindigkeit ohne Reload zu erreichen.

Kundenmeinung: 

„Wir sind äußerst zufrieden mit dem Website Relaunch und froh, trotz der massiven Probleme mit der alten Website wieder auf Drupal gesetzt zu haben. Die tägliche Arbeit mit der neuen Seite bestätigt uns immer wieder in der Entscheidung. Die Arbeit mit dem CMS ist sehr angenehm und macht durch die großen Freiheiten in der Gestaltung richtig Spaß. Als Redakteur habe ich nun endlich die Flexibilität, die ich brauche und ein System, das gleichzeitig einfach zu bedienen ist. Die Zeiten von unübersichtlich aufgelisteten Teaserelement-Namen und die lange Suche nach dem richtigen Element sind vorbei. Das eingesetzte Translation Management Tool unterstützt unsere Arbeit und spart uns viel Zeit, da wir komfortabel mit externen Dienstleister zum Übersetzen zusammenarbeiten können. Das Team von Bright Solutions hatte während der Entwicklung stets unsere Anforderungen im Blick und hat uns auf Möglichkeiten hingewiesen, wie das System so gestaltet werden kann, dass es unsere Arbeit noch besser unterstützt.

Mit Release 3 werden wir mehr erreicht haben, als wir initial geplant und uns vom Relaunch erhofft hatten. Wir sind zuversichtlich, nun die zukunftsfähige Basis für unsere online Aktivitäten zu haben, die wir als weltweit aktives Unternehmen benötigen. Wir freuen uns darauf, die Website nun Schritt für Schritt in weiteren Sprachen anbieten zu können.“

Jonas Goetschi, Project Manager – Digital Marketing

Bereit für Ihre eigene Success-Story?
Wir freuen uns auf Ihre Projekt-Idee! Nehmen Sie noch heute Kontakt zu uns auf.

Weitere Referenzen – ein Auszug

Bright Solutions betreute das nationale Rollout von 94 BMW-Händlerseiten im Auftrag der BMW Schweiz AG.

Technische Vorbereitung und Durchführung des nationalen Rollouts von 94 BMW-Händlerseiten im Auftrag der BMW Schweiz AG. Im Fokus: Automatisierung des Rollouts, Aufsetzen von AWS-Hosting mit 10 Instanzen und Optimierung des Backends hinsichtlich der Usability für Redakteure.

Relaunch der Website ARTE creative

Relaunch der Website creative.arte.tv als Drupal Rahmenvertragspartner von ARTE. Bright Solutions war zuständig für die Bereiche Konzeption, Modulentwicklung, Schnittstellenintegration, Responsive Design (HTLM, CSS, JavaScript) und Performanceoptimierung.

DPD App

Umfangreicher Relaunch der DPD App für iOS und Android inklusive der Entwicklung weiterer zentraler Funktionen. In der Zusammenarbeit konnte unser Team durch Zuverlässigkeit, hohe Qualität der Arbeiten und die ergebnisorientierte Arbeitsweise aller Projektbeteiligten überzeugen, sodass die erfolgreiche Zusammenarbeit fortgesetzt wird.