UI und UX: Konsistenz an allen digitalen Touchpoints

    UI und UX machen den Ton des Unternehmens sichtbar und erlebbar. Aber wie trifft man ihn an allen digitalen Touchpoints gleichermaßen?

    ABONNIEREN SIE UNSEREN BLOG

    Das Narrativ einer Marke allein über Texte und geschickt platzierte Bilder transportieren? Das ist Geschichte. Was heute zählt, ist vor allem auch die individuelle Ansprache der Kunden. Die Herausforderung: Das Unternehmen soll überall mit derselben Stimme sprechen – aber das Marketing kann längst nicht mehr jede einzelne Kommunikation kontrollieren.  

    1. Wie lässt sich dieses Dilemma lösen? Nur von Grund auf. In diesem Beitrag erfahren Sie, was damit gemeint ist – und wie Sie das Problem am besten angehen. 

    1. Single Source of Truth – eine zentrale Datenquelle 

    Das Hauptproblem: Oft wird jeder Touchpoint (Website, Terminal, digitale Apps …) als ein eigenes, separates Projekt betrachtet. Und aufgrund unterschiedlicher Codes ist das visuelle Ergebnis am Ende unterschiedlich. Ein kostspieliger Ansatz: Ändert sich das Design, muss jede Änderung in jedem Projekt einzeln eingepflegt werden.  

    Die Inkonsistenz der digitalen Kanäle ist dabei im wahrsten Sinne vorprogrammiert, sei es aus dieser Silo-Mentalität heraus – oder weil man es mit der Pflege und Abstimmung nicht so genau nimmt. Es wird auch nicht dadurch besser, dass dann und wann eine Abteilung beschließt, es sei Zeit für eine „neue Online-Identität“ des Unternehmens. 

    Man muss an die Ursache gehen: Designer und Entwickler brauchen eine sogenannte Single Source of Truth, an die sie sich halten können. Und die sie nicht selbst pflegen müssen! Eine solche zentrale Datenquelle ist kosteneffizient, schließlich ist der Programmieraufwand geringer: Jede Änderung erfolgt nur einmal – und wird dann zentral an alle Teams weitergeleitet.  

    Einige grundsätzliche Eckpunkte gilt es dabei zu beachten:

     

    Der UI-Code muss zentral zugänglich und technologieunabhängig sein. 

    Es muss ein Team geben, das Updates auf Anfrage zügig durchführt.  

    Alle UI-Elemente müssen klar dokumentiert sein – insbesondere in Bezug auf die Frage, wann, wo und in welcher Variante sie eingesetzt werden dürfen.

    Ein Lenkungsteam entscheidet darüber, in welchem Kontext welche Elemente zulässig sind.  

    Ein Tool wie  ​Storybook: UI Component Explorer for Frontend Developers​ leistet hier wertvolle Unterstützung. 

    2. Das Wichtigste zuerst: Elemente der Nutzerinteraktion  

    Alle Elemente für die digitalen Kanäle sollte ein Digital-Governance-Team zentral erstellen – vom einfachen Link bis zum konkreten, sorgfältig definierten Hauptmenü.  

    Es kann Varianten geben, etwa kontextabhängig (zum Beispiel: Externer oder interner Link?), oder je nach Element (Link im Standardtext versus im Hauptmenü).  

    Atomic DesignAtomic Design - vom Kleinen zum Großen  (wie Vorlagen und ganze Seiten)

    Elemente ausgehend vom kleinsten Bestandteil hin zu Vorlagen und ganzen Seiten zu gestalten (und nicht umgekehrt), ist ein ziemlich abstrakter Prozess. Er bietet jedoch viele Vorteile:  

    - Konsistenz in der Gestaltung und Nutzer-Interaktion, da sich jede gestalterische Entscheidung auf alle Ebenen fortpflanzt

    - Bessere Kontrolle über Änderungen: Jede Änderung an einem Atom überträgt sich auf die Moleküle 

    - „Mobile First“-Ansatz auf allen Ebenen (vom Atom bis zur ganzen Seite), um bestimmte Gestaltungsgrundsätze festzulegen

    - Barrierefreier Nutzerzugang, leicht gemacht: Einmal richtig, überall richtig

    - Keine Dubletten für eine ähnliche Verwendung an anderer Stelle: Varianten lassen sich entweder kontextabhängig oder nach dem Vererbungsprinzip definieren, direkt auf der Atom-Ebene 

    - Kann man auch für einzelne Elemente starten, und zwar projektunabhängig

    - Transparenz gegenüber Stakeholdern: Anfragen und Wünsche von Stakeholdern, die zu einer widersprüchlichen oder falsch duplizierten Interaktion führen könnten, lassen sich auf der richtigen Entwicklungsebene abhandeln 

    - Zeit- und ressourcensparend: Designer können Elemente wiederverwenden und müssen das Rad nicht jedes Mal neu erfinden. 

    Dieses Prinzip setzt sich immer mehr durch. Das Designsystem von Gov.uk ist in dieser Hinsicht vorbildlich. Es hat anderen Regierungen, etwa von Australien und Neuseeland, bereits als Vorlage gedient. Auch im privaten Sektor sehen wir Beispiele für Unternehmen, deren Designsysteme sogar Open-Source-basiert sind: Audi, Mailchimp, IBM und AXA, um nur einige zu nennen. 

    Fazit 

    Ob Marketing-Experte, Kreativer oder Designer: Wenn Sie sichergehen wollen, dass jede Interaktion mit Ihrer Marke, Ihrem Produkt, der Website oder App den Nutzern eine konsistente Erfahrung mit hohem Wiedererkennungswert bietet, müssen Sie zunächst Grundlagenarbeit leisten − bevor Sie sich ans „echte“ Ausgestalten machen. Aber sobald Sie das System einmal von Grund auf richtig eingerichtet haben, wie beschrieben, sind die Vorteile unübertroffen.

     

    Brauchen Sie Profi-Unterstützung – für UI-Konsistenz an allen Ihren digitalen Touchpoints? Unsere Experten sind für Sie da!

    Veröffentlicht auf    Zuletzt aktualisiert am 19/08/2020

    #Customer Experience, #Digitales Marketing, #Content Management

    Über den Autor

    Niki Lin is a Functional Analyst at Amplexor Belgium. Since 2017, he has been overseeing product development according to specifications, building bridges between the digital platforms’ end users and the technical teams. Niki is passionate about achieving the right balance of human-centered design approaches and agile development methodologies.

    SUBSCRIBE TO OUR BLOG