Ein durchgängiges Markenerlebnis über alle Touchpoints hinweg ist ein wesentlicher Bestandteil jeder Omni-Channel-Strategie. Für die Mobilitätsanbieterin Amag Group wird es zunehmend wichtiger, sich auch auf den digitalen Kanälen erfolgreich zu positionieren und ihre unterschiedlichsten Produkte und Services professionell und einheitlich zu präsentieren. Standardisierte Web-Bausteine und begleitende Anwendungsrichtlinien, die unternehmensweit in allen Digitalprojekten eingesetzt werden, sind ein zentraler Erfolgsfaktor dafür, wie es in einer Mitteilung heisst.
Nach einer strategischen Neupositionierung der Marke Amag und der Überarbeitung des CI/CD im Jahr 2013 gilt es, das neue Erscheinungsbild des Unternehmens in alle Kanäle, insbesondere in die verschiedensten Online-Auftritte, zu übertragen. Mit der «Pattern Library», einer Browser-basierten Bibliothek aller gängigen Web-Bausteine (wie Buttons, Formularfelder, Bild-Galerien, etc.), wurde eine wichtige Grundlage dafür geschaffen. Im Unterschied zu einem klassischen Styleguide sind die Bausteine in einer «Pattern Library» funktionsfähig ausprogrammiert und können als fix-fertige Frontend-Komponenten exportiert und in allen Digitalprojekten der Amag wiederverwendet werden.
Neben dem primären Ziel – der Schaffung eines einheitlichen Kundenerlebnisses in allen digitalen Kanälen –, sind Effizienzsteigerung in der Projektabwicklung und verbesserte Code-Qualität weitere Vorteile des Einsatzes einer «Pattern Library».
Projektumsetzung durch ein interdisziplinäres Team
Konzeption, Design sowie technische Umsetzung der «Pattern Library» erfolgten durch ein interdisziplinäres, firmenübergreifendes Team. Die Branding-Agentur Heads Corporate Branding, langjähriger Partner der Amag, entwickelte die übergeordnete Design-Sprache und gestaltete die einzelnen Web-Bausteine. Die Digitalagentur Nexum führte das Vorhaben, beriet die Amag im User Experience Design und zeichnete für die Konzeption und technische Umsetzung verantwortlich. Ein agiles und iteratives Vorgehen, regelmässige Reviews aller Lieferobjekte sowie der enge Einbezug der Amag-Units Group Communication, User Experience Design und IT, ermöglichten eine effiziente und zielorientierte Projektumsetzung in nur drei Monaten, wie es weiter heisst.
Die «Pattern Library» wurde basierend auf dem Konzept des Atomic Design von Brad Frost konzipiert und mit dem React Styleguidist Framework umgesetzt.
Verantwortlich bei der Amag Group AG: Dino Graf (Gesamtverantwortung), Michelle Widmer (Projektleitung); verantwortlich bei Nexum Agency Switzerland AG: Nicola Schlup (Gesamtverantwortung), Peter John (Consulting / User Experience), Michael Draws, Steffen Meyer (Entwicklung), Thomas Isch (Projektleitung); verantwortlich bei Heads Corporate Branding AG: Ralph Hermann (Gesamtverantwortung), Marco Simonetti (Creative Director), Marc Gooch (Projektleitung). (pd/cbe)