- Zur Lesezeichenliste hinzufügen
-
0LesezeichenLesezeichen hinzugefügt. Lesezeichen entfernt.
- Schnelleinstieg
Eine Pattern Library ist eine Art digitaler Baukasten für Design-Elemente. Alle digitalen Produkte eines Unternehmens, die mittels HTML-Code erstellt werden, können mit diesem Baukasten entwickelt werden. Bei Liebherr wurde die Library bereits in allen Auflösungen für redaktionelle Websites, Portale und Web-Apps entwickelt. Wie alle Kontaktpunkte gehören diese Formate (intern wie extern) zum Branding der Firmengruppe und müssen CD-konform gestaltet und entwickelt werden. Sollte eine Fremd-Software genutzt werden, muss geprüft werden, welche Branding-Elemente zum Einsatz kommen können bzw., in welchem Umfang ein Branding möglich ist. Dies wird im Einzelfall beschlossen und umgesetzt. Sprechen Sie uns gerne an!
Was ist die Liebherr-Pattern Library?
Die Liebherr-Pattern Library ist das Bindeglied zwischen Designern und Entwicklern und besteht aus zwei Teilen: dem Repository und der Dokumentation.
Das Repository ist ein zentraler digitaler Speicherort, an dem die UI-Komponenten des Designsystems als HTML-Code-Schnipsel organisiert und verwaltet werden. Es ermöglicht eine strukturierte Verwaltung von Code und Daten, erleichtert die Zusammenarbeit zwischen Entwicklern und bietet Mechanismen zur Nachverfolgung von Änderungen im Laufe der Zeit.
Die Open-Source-Oberfläche „Storybook” dient als Dokumentations-Tool, um die verfügbaren Komponenten und deren Verwendung klar darzustellen und die visuelle Identität der Marke Liebherr auf Web-Oberflächen zu gewährleisten. Es hilft Entwicklern, UI-Komponenten für Webanwendungen in einer isolierten Umgebung zu erstellen und zu testen und fördert die Wiederverwendbarkeit und Sichtprüfung von Komponenten.
Die Pattern Library ist ein wertvolles Werkzeug für UI-Entwickler und Design-Teams, um die Qualität und Effizienz der Entwicklungsarbeit zu verbessern.
Einblick in die Dokumentation der Pattern Library auf Storybook: Möglichkeiten für die Darstellung eines Buttons
Welche Vorteile hat der Einsatz der Liebherr-Pattern Library?
1. Einheitliches Erscheinungsbild für die Marke Liebherr
Die Liebherr-Pattern Library stellt sicher, dass die Markenvorgaben in der gesamten Firmengruppe korrekt umgesetzt werden können.
2. Verbesserte User Experience
Der Einsatz wiederkehrender, standardisierter Interaktionsmuster und Komponenten ermöglicht eine einfache und intuitive Bedienbarkeit aller Produkte und digitalen Services von Liebherr. Dies trägt dazu bei, die Zufriedenheit und Loyalität der Kunden sowie Mitarbeiter von Liebherr zu steigern und damit den CLTV (Customer-Lifetime-Value) zu verbessern.
3. Schnelle Erstellung von Produkten und Dienstleistungen
Aufgrund der zentralen Dokumentation auf Storybook ist es auch für neue Projektmitglieder möglich, sich zügig einzuarbeiten. Designer werden befähigt, schnell Prototypen neuer Seiten und Elemente aufzubauen. Entwickler haben die Möglichkeit, diese Informationen einzusehen und die Codes dafür direkt aus dem System zu entnehmen. So können digitale Produkte von Liebherr effizient erstellt und kontinuierlich weiterentwickelt werden.
4. Bessere Zusammenarbeit der Teams
Indem wir die wichtigsten Designelemente klar definieren und zeigen, wie sie auf Benutzeroberflächen eingesetzt werden, stellen wir sicher, dass alle ein einheitliches Verständnis des Design-Zielbildes erlangen können. Teams aus unterschiedlichen Disziplinen (z.B. verschiedene Dienstleister) sind somit in der Lage, nicht nur reibungslos zusammenzuarbeiten, sondern auch neue Komponenten mühelos gemeinsam zu entwickeln.
Die Liebherr-Pattern Library wird laufend weiterentwickelt und überarbeitet. Unter diesem Link können Sie sich die bereits vorhandenen Elemente ansehen:
Wie und wo entstehen die einzelnen Komponenten der Pattern Library?
Als übergreifende Design- und Prototyping-Software setzen wir seit September 2021 die Software Figma in der Unternehmenslizenz ein. In Figma werden die Design-Komponenten und Prototypen von Portalen und Webseiten erstellt. Die Code-Komponenten wiederum finden Sie in der oben beschriebenen Pattern Library. Jede Komponente, die im Design-System in Figma zu finden ist, wird als Code-Komponente in die Pattern Library übernommen.
Zugang zu den Systemen
Über unser Ticketsystem können Sie bei Bedarf Zugänge zu den Systemen beantragen oder Anforderungen für neue Komponenten einsteuern.
Kontakt
Für weitere Fragen stehen wir Ihnen gerne zur Verfügung. Bitte nutzen Sie hierzu das vorliegende Kontaktformular oder besuchen unseren LHO Service Desk (nur für Liebherr-Mitarbeitende).