Igo Industries

Enterprise Int.

Zusammenfassung

Informationsseite für die Igo Industries Holding mit Fokus auf Design, Performance und Usability für RedakteurInnen.

Projektbeschreibung

IGO Industries ist ein international agierender und hochspezialisierter Verbund von Technologieunternehmen, führend in der technischen Gebäudeausstattung und im industriellen Anlagenbau.

Für die Kundin wurde eine Informations- und Präsentationsseite konzipiert, gestaltet und aufgebaut, in der alle Inhalte von der Kundin adaptiert und erweitert werden können.

Projektziele und -ergebnisse

Der erste Eindruck zählt. In der Konzeptphase konnten wir die Kundin davon überzeugen, dass ein Mood-Video die beste Wahl für den ersten Eindruck von BesucherInnen ist. Ein ruhiges Video zeigt die Themengebiete und auch die diversen beteiligten Firmen mit langsamen Übergängen. Die Geschichte der Firma sollte übersichtlich präsentiert und die Firmenwerte präsentiert werden. Hierfür wurde ein interaktiver Wertekompass konzipiert, um diese erlebbar zu machen.

Alle Unternehmen sollten repräsentiert werden
Die Unternehmen, Innovationen und Standorte findet man gebündelt auf einer Landingpage. Alle Unternehmen haben auch eine weiterführende Informationsseite und können individuell bespielt und angepasst werden.

Präsentation von Referenzprojekten
Unter dem Menü Referenzen findet man ausgesuchte Projekte, die vom Unternehmensverbund umgesetzt wurden.
Eine externe Referenzdatenbank dient hier als Quelle. Inhalte werden hier automatisch in das Drupal System synchronisiert und Editoren können entscheiden, ob die Inhalte veröffentlicht werden. Auch können importierte Inhalte adaptiert und ergänzt werden, ohne dass die Synchronisation dadurch beeinträchtigt wird. Ganz neue Inhalte können natürlich auch direkt im Drupal System angelegt werden, welche dann von der Synchronisation unberührt bleiben. Damit ist man sehr flexibel.
Die Referenzen können natürlich mit Facets gefiltert und sortiert werden. Eigene Übersichtsseiten pro Firma sind vorhanden.

Einfachste Eingabe der Inhalte und Gestaltung von Landingpages
Eingesetzt wurde dafür Storyengine, eine auf thunder.org basierende Drupal Distribution von acolono, die wir als Starter-Kit für unsere Projekte entwickelt haben. Für Igo Industries wurden einige interaktive Elemente speziell entwickelt. Wertekompass (https://www.igo-industries.com/gruppe#unsere-werte) , Sections, Jumpmenü, csv Tabelle… etc.

Herausforderungen

Tracking und Datenschutz
Der Schutz der persönlichen Daten von Website-BenutzerInnen ist für uns von großer Bedeutung.
Daher verzichten wir so weit wie möglich auf Fremdsysteme. Zum Beispiel wird das Video auf der Startseite direkt vom eigenen Server ausgespielt und nicht via Youtube geladen. Das Spezielle an der Seite ist vor allem, dass wir keinen Consent vorab erfragen. Trotz verbauter Youtube Videos und Google Maps, benötigen wir keine globale Consent-Abfrage, sondern lösen dies mit einem Content Blocker. Dieser wird nur bei den zustimmungspflichtigen Einbettungen angezeigt. Es wurde mit einem Datenschutzexperten/Rechtsanwalt abgeklärt und wir ersparen so den Besuchern der Seite eine allgemeine Consent Abfrage abzunicken. In Zusammenarbeit mit den Betreibern von legalweb.io haben wir hierfür die Drupal Integration erweitert und optimiert und setzen diese auch für dieses Projekt ein: https://www.drupal.org/project/legalweb_cloud

Komprimierung von lokal geladenen Videos (siehe zum Beispiel das Video auf der Startseite).
Hier wurde die Komprimierung optimiert, damit schnelle Ladezeiten erreicht werden können, aber trotzdem großflächig dargestellt werden kann, ohne große Qualitätseinbußen.

Fokus in Bildern behalten trotz Änderung durch UserInnen-Interaktionen
Unter https://www.igo-industries.com/karriere#berufsbilder wurde eine Komponente umgesetzt, die erweiterbare Bilder mit Focal-Point erlaubt. Das Besondere daran ist, dass im Frontend die Bilder immer passend zugeschnitten sind, obwohl man durch einen Klick auf “mehr anzeigen” den Bildausschnitt erweitert. Bei Bildern, in denen der Kopf einer Person ganz oben im Bild ist, funktioniert es genauso wie bei Bildern, bei denen der Fokus eigentlich in der Mitte oder unten gesetzt wurde. In der Media Entität wird hierfür neben dem Fokus auch eine Positionsangabe für den Beschnitt mitgegeben, welcher vom Browser via CSS ausgewertet und verwendet wird.

Intro Bilder/Video-Bereiche sollen maximal flexibel sein
Der sogenannte Hero-Bereich der Webseite (Großes Bild und Infotext darüber oder Video) wurde feingranular adaptierbar umgesetzt. EditorInnen können sich aussuchen, ob einer oder mehrere Elemente in einem Slider angezeigt werden und den Inhalt steuern. Auch kann die Höhe von automatisch, zu 25%, 50%, 75% oder 100% der Höhe des Browsers definiert werden.
Eine “Show More” Info erscheint nur dann, sobald zu wenig Weißraum vorhanden ist, um UserInnen darauf hinzuweisen, dass man scrollen kann/es unterhalb weitergeht.

Synchronisation von Referenzprojekten
Eine Logik und Systematik musste gefunden werden, um sowohl automatisch synchronisierte, von EditorInnen erweiterte oder komplett neuen Referenzprojekten zu ermöglichen.

Darstellung von csv Daten (siehe Community- Beiträge)

Community-Beiträge

Wir glauben an Open Source und tragen seit 2005 aktiv zur Drupal-Community bei. Wir steuern nicht nur Code bei, sondern wir versuchen auch, Drupal in der DACH Region zu fördern und die lokale Community durch die Organisation von Meetups oder Camps zu unterstützen.

Zur Info: Igo Industries hat/möchte keine d.o Organisation und daher können wir contributions nicht direkt zuweisen.

https://www.drupal.org/project/legalweb_cloud
Die Version unseres Moduls wurde während der Umsetzung adaptiert/verbessert und auch auf eine neue Version gehoben

https://www.drupal.org/project/file_rename
EditorInnen wollten Dateinamen nachträglich im System bearbeiten.
Als wir hierfür eine Lösung gesucht haben, ist uns aufgefallen, dass dieser Basic Funktionsumfang in Drupal derzeit nicht vorhanden ist. Wir haben uns daher entschieden ein Contrib Modul zu entwicklen, welches diesen Use Case abdeckt. Wir haben auch einen Patch für das file_replace Modul zur Verfügung gestellt, welches das Ersetzen eines Files auch direkt im Media Item ermöglicht. Dies war bis dato nicht möglich. Die 2 Module komplettieren Funktionen, welche von EditorInnen sehnlichst gewünscht wurden.

Csv_table https://www.drupal.org/project/csv_table
Für die Igo Industries Group haben wir das Modul csv_table erstellt. Primärer Zweck ist, eine csv Datei in einem Block/Field oder Paragraph hochzuladen. Das resultierende Ergebnis ist eine Tabelle, welche im Frontend von UsernInnen konsumierbar, sortierbar und durchsuchbar ist. EditorInnen können so sehr schnell strukturierte Daten publizieren. Es kann neben einer Datei auch ein Speicherort angegeben werden. Dieser wird gecached und automatisch aktualisiert, falls sich die Datei ändert. Alle Funktionen sind von einem/einer SitebuilderIn im Display Mode konfigurierbar.

Entity_reference_media https://www.drupal.org/project/entity_reference_media
Auch eines unserer Module wurde während der Entwicklung der Seite verbessert. Es ermöglicht, global hinterlegte Eigenschaften von Media Entities während der Referenzierung zu überschreiben. Z.b. den Titel oder die Start/Endzeit eines Videos.

Pathauto https://www.drupal.org/project/pathauto
Quick_node_clone https://www.drupal.org/project/quick_node_clone
Wie wir an der Webseite gearbeitet haben, wurde festgestellt, dass die Projekte kein Logo besitzen. Neben einigen anderen Drupal Modulen, haben wir dann auch diesen Modulen ein Logo spendiert :)

Die acolono GmbH ist darüber hinaus unterstützendes Mitglied der österreichischen Drupal-Association und ihre Gründer Christian Ziegler und Nico Grienauer sind im Vorstand des Vereins und eine der treibenden Kräfte von Veranstaltungen wie dem DrupalCamp Vienna, Drupal Austria Roadshow, den Open Minds (Open Source) Award oder dem DrupalCon Vienna Community Day.

Warum sollte dieses Projekt die Splash Awards gewinnen?

Unter vorgehaltener Hand wird oft gesagt, dass Drupal für Corporate Pages zu unflexibel und kompliziert in der Benutzung ist. Wir können mit diesem Projekt zeigen, dass Drupal in vielerlei Hinsicht ein perfektes System auch für diese Art von Projekten ist. EditorInnen, die andere Systeme gewohnt sind, wollen unsere Storyengine Distro nicht mehr missen :)