illwerke vkw Digitales Design System
%2Ff%2F97870%2F2480x1530%2F191e379035%2Fillwerke-vkw__screen_02.jpg&w=3840&q=75)
Eine Designsprache für alle interaktiven Plattformen
In den letzten Jahren und Jahrzehnten hielt die Digitalisierung Einzug in die Abteilungen und Divisionen der illwerke vkw. Zahlreiche Plattformen und Apps entstanden dabei und nur wenig Zusammenhalt war für Anwenderinnen und Anwender erkennbar. Der Wunsch nach einem zentral definierten Regelwerk für interaktive Plattformen wuchs immer mehr.
Unser digitales Designsystem für die illwerke vkw bringt Ordnung und Konsequenz in die interaktiven Plattformen des Vorarlberger Energieproviders. Interne Applikationen, öffentliche Websites und Sel-Service-Portale von Photovoltaik bis Elektromobilität fügen sich zu einer konsistenten Nutzererfahrung.
%2Ff%2F97870%2F2480x1530%2F0f06908320%2Fillwerke-vkw__screen_03.jpg&w=3840&q=75)
Die zugrundeliegenden Definitionen von Typografie, Farbe, Raster und Interaktionselementen ist in einer zentralen Bibliothek hinterlegt, die eine Adaptierung für verschiedene Absendermarken in der Unternehmensgruppe einfach macht.
%2Ff%2F97870%2F2480x1530%2F0093e2e88d%2Fillwerke-vkw__screen_04.jpg&w=3840&q=75)
Das Design System folgt dem Atomic Design Ansatz. Dadurch erreichen wir eine hohe Flexibilität in der Evolution des Systems. So können auch grundlegende Anpassungen umgehend und flächendeckend umgesetzt werden. Beispielweise wird ein Icon oder ein Buttondesign an einer Stelle angepasst und damit automatisch über alle Plattformen und Designs verbreitet.
%2Ff%2F97870%2F2480x1530%2F91119e630d%2Fillwerke-vkw__screen_05.jpg&w=3840&q=75)
Der zentrale Katalog von UI-Komponenten ermöglicht eine strukturierte Möglichkeit zur Einführung und Verbreitung neuer Elemente. Wird eine UI-Komponente wie beispielsweise eine filterbare Liste verbessert, so steht die neue Version allen Designern und Entwicklern zur Verfügung.
%2Ff%2F97870%2F2480x1530%2F7f3fafdd4d%2Fillwerke-vkw__screen_06.jpg&w=3840&q=75)
Das responsive Layout-Raster für Desktop und Mobile ermöglicht eine konsistente und adäquate Darstellung von Inhalten.
%2Ff%2F97870%2F2480x1530%2F4e8031cefa%2Fillwerke-vkw__screen_07.jpg&w=3840&q=75)
%2Ff%2F97870%2F2480x1530%2F5d3a46f6b0%2Fillwerke-vkw__screen_08.jpg&w=3840&q=75)
%3Afocal(1533x18%3A1534x19)%2Ff%2F97870%2F2480x1530%2Fa203660c47%2Fillwerke-vkw__screen_11.jpg&w=3840&q=75)
Die Bildsprache der illwerke vkw unterstützt mit den kühlen Farbstimmungen den einheitlichen Look des Designsystems.
%2Ff%2F97870%2F2480x1530%2Fa830b3db0a%2Fillwerke-vkw__screen_09.jpg&w=3840&q=75)
Das Layout Grid ermöglicht eine lebendige und abwechslungsreiche Gestaltung von Websites und Applikationen.
%2Ff%2F97870%2F2480x1530%2Fe657f1dfa6%2Fillwerke-vkw__screen_10.jpg&w=3840&q=75)
Im täglichen Einsatz
Das mehrköpfige UI-Team der illwerke vkw arbeitet täglich mit dem Digital Design System. Sie entwerfen neue Webseiten, Applikationen und Services direkt und eigenständig. Wir unterstützen das Team dann, wenn es um die Neukonzeption oder Evolution von UI-Komponenten oder Erweiterungen der Style-Bibliothek geht. Die zunehemnd dynamische und zugleich interaktiv/digitale Informations- und Servicelandschaft der illwerke vkw gedeiht auf einem solidem Fundament.
%2Ff%2F97870%2F746x856%2Fe613533e27%2Foliver-credit.png&w=128&q=75)
%2Ff%2F97870%2F954x954%2Fc0d418626c%2Fcorinna-wurth-thumbnail.jpg&w=128&q=75)
%2Ff%2F97870%2F694x730%2Fabb7169866%2Fselina-credit.png&w=128&q=75)
%2Ff%2F97870%2F6693x4462%2Fc0a06a0ab0%2Fmesse-dornbirn-website-relaunch-heroshot.jpg&w=3840&q=75)
Fairytale
Neuentwicklung der Informations- und Navigationsarchitektur mit Schwerpunkt auf Flexiblität in der Umsetzung und langfristigen Weiterentwicklungen.
Zum Projekt