Das Leben ist besser mit Cookies. Die meisten Menschen würden zustimmen, dass Cookies das Leben besser machen. Für uns helfen sie, unsere Website und unser Marketing zu verbessern. Aber wenn Sie keine Cookies mögen, ist das kein Problem - Sie können uns das mitteilen, indem Sie auf die Schaltfläche «Ablehnen» klicken! Weitere Informationen finden Sie in unserer Datenschutzrichtlinie.
Let's talk!
Close Menu
let's talk

UX/UI

Lesedauer:
10 Minuten

Erfahrungen gestalten, Design erleben - Sieben UX und UI Trends im Fokus

Veröffentlicht am:
20.6.2024
Erfahrungen gestalten, Design erleben - Sieben UX und UI Trends im Fokus
Autor:innen
Teilen

Newsletter abonnieren

Erhalten Sie exklusive Einblicke und Neuigkeiten direkt in Ihr Postfach.

ABONNIEREN

Check-in

Wann hat euch eine Erfahrung mit einem Produkt oder einem Service das letzte Mal so richtig umgehauen? Bestimmt habt ihr mindestens eine, eher sogar mehrere Apps, die ihr mehrfach täglich nutzt. Welche davon ist euch die Liebste und warum?

Ich bin Fan der Apps von SBB Mobile und swisstopo. Was ich daran schätze, ist der verständliche und intuitiv bedienbare Zugang. Unabhängig vom Bedürfnis, gelange ich mit wenigen Klicks zum Ziel und kann mein spezifisches, im Moment bestehende Bedürfnis lösen. Insbesondere bei der SBB Mobile App fasziniert mich immer wieder aufs Neue die gut durchdachte Struktur bei der dahinter liegenden Komplexität unterschiedlicher User-Szenarios, deren verschieden gewichtete Relevanz auf sehr smarte Art und Weise berücksichtigt wurde. Eine Fahrplan-Abfrage oder ein Ticketkauf ist viel zentraler als beispielsweise eine Entschädigung bei einer Zugverspätung zu beantragen. Zumindest als SBB Fahrgast. Als Fahrgast der Deutschen Bahn verschieben sich mit grosser Wahrscheinlichkeit einige der Prioritäten. Das verdeutlicht die Relevanz des Nutzungskontexts im jeweiligen Mikro-Moment. Wer von euch ab und an auch als Fahrgast der Deutschen Bahn unterwegs ist und den DB Navigator kennt, weiss wovon ich rede. Nicht nur, dass man das Reiseerlebnis als solches sprichwörtlich nehmen sollte und das Verständnis vom Reisen neu austariert, auch die Erfahrung mit der App birgt gänzlich neue Überraschungen und Herausforderungen. Fraglich, ob hier tatsächlich die Nutzer:innen konsequent ins Zentrum der Anwendung gestellt wurden oder sich die Interessen des Anbieters stärker durchsetzen. Kurzum, ein Markenerlebnis mit der Deutschen Bahn berechtigt zur Frage: Einmal oder immer wieder?


Nehmen wir Fahrt auf.

Check-in.

Einleitung

Lasst uns zunächst mit einer kurzen Einordnung von UX und UI beginnen. Wie der Titel bereits verrät, geht es um Erfahrungen. Erfahrungen, die vor, während und nach einer Interaktion mit einem Produkt, einer Dienstleistung oder einem System entstehen. Drei Dimensionen sind an diesen Erfahrungen beteiligt: der Mensch, das Design und der spezifische Nutzungskontext.1 Während sich das UX-Design darauf konzentriert, das warum und was zu analysieren, dreht sich beim UI-Design alles um das visuelle Erscheinungsbild. Also die Ästhetik. Konkret heisst das: Die Probleme und Bedürfnisse der Kund:innen in verschiedenen Nutzungskontexten versus Layout, Farben und Schriften. Hier treffen die Funktionen auf die Form und im Idealfall lautet die Maxime: Form follows function. Erfolgreiche Produkte und Services stellen die Menschen konsequent ins Zentrum, was eine fundierte User Research voraussetzt. Elementar ist hierbei die Abgrenzung zum häufig praktizierten Desk Research. John le Carré brachte es in einer Novelle treffend auf den Punkt: «A desk is a dangerous place from which to watch the world.»2

Für Menschen zu gestalten, bedeutet stets auch für Unterschiede zu gestalten. Es ist wichtig, sich zu fragen, für welche Menschen und für welche Unterschiede etwas gestaltet wird. Und es ist wichtig, diese Menschen zu befragen und zu beobachten, um unzählige kognitive Verzerrungen zu vermeiden und Nutzererfahrungen evidenzbasiert abzusichern.

Warum aber wird eine gute UX und UI zunehmend zum entscheidenden Erfolgsfaktor und Differenzierungsmerkmal von Marken und Unternehmen? Eine von Forrester veröffentlichte Studie bringt es auf den Punkt. Die Benutzeroberfläche (UI) kann die Konversionsrate einer Website um 200% erhöhen, während die Benutzerfreundlichkeit (UX) sie auf 400% steigern kann. Wer von euch kennt den Frust mit schlechter Informationsarchitektur nicht? Kann ich einen Kauf mit drei Klicks abschliessen oder wird meine Geduld mit zehn Klicks bis zur Bestellbestätigung überstrapaziert. Erfolgreiche Online-Seller wie Amazon oder Zalando zeigen, wie es geht. Hier wurde die Usability bis ins kleinste Detail auf Conversion getrimmt. Die Devise lautet: Eins-zwei-drei-meins.

Es gibt vielfältige Parameter, welche die Benutzerfreundlichkeit positiv stimulieren, angefangen bei intuitiv bedienbaren Benutzeroberflächen, Personalisierungen, Treueprogrammen und Prämien-Systemen, Sicherheit und Vertrauen, was beispielsweise für Banking-Applikationen das Zünglein an der Waage bedeuten kann. Eine schlechte UX kann hier durchaus dazu führen, dass Kund:innen die Bank wechseln. Denn auch ein neues Bank-Konto ist heutzutage nur drei Klicks entfernt. Ausserdem bietet eine überzeugende Benutzerführung erhebliches Potenzial, die Supportkosten zu reduzieren. Kund:innen schätzen es, autonom und eigenständig durch die digitalen Sphären zu surfen und belohnen positive Nutzer-Erfahrungen mit Loyalität und Treue. Dabei immer im Fokus: Was sind die wichtigsten User-Bedürfnisse, welche gelöst werden sollen? Geht es um Inspirationen, aktuelle Neuheiten oder personalisierte Empfehlungen wie beispielsweise auf Spotify oder Netflix? Oder steht der Kaufabschluss im Fokus und damit die Reduktion potenzieller Hürden, die zu einem Abbruch führen könnten? Hier zeigt sich, dass gut beraten ist, wer sich für die Benutzerführung mehr Zeit lässt und einmal mehr hinterfragt, welches Problem gelöst werden soll.

Schauen wir uns doch an, welche Trends im Bereich UX und UI nützlich sind, diese Ansprüche zu erfüllen!

1. Trend: Minimalistisches Design

Ins Schwarze trifft, wer sich an der Leitidee «Weniger ist mehr» orientiert. Wer die Kunst der Reduktion zu meistern versteht, gewinnt. Das Paradebeispiel: Google. Vor nahezu 26 Jahren hat der Suchmaschinengigant das User Interface revolutioniert. Alle potenziellen Ablenkungsmanöver wurden eliminiert. Übrig bleibt eine klare, unverwechselbare Designsprache. Das ist glaubwürdig gelebte Philosophie: «Focus on the user, and all else will follow.» Die Vorteile liegen auf der Hand: Gelangen User schnell ans Ziel, belohnen sie das mit dem Kostbarsten, was sie geben können: mit ihrer Zeit. Sie kommen also immer wieder und teilen ihre Begeisterung mit anderen. John Maeda brachte es wie folgt auf den Punkt: «Simplicity is about substracting the obvious and adding the meaningful.»

«Für Menschen zu gestalten, bedeutet stets auch, für Unterschiede zu gestalten.»

2. Trend: Dunkelmodus

Auch der Dark-Mode erfreut sich zunehmender Beliebtheit. Auffällig ist, dass zunehmend mehr Unternehmen einen Toggle-Button anbieten, mit den Usern flexibel zwischen Light und Dark Mode wechseln können, wie beispielsweise die Agentur Beech Agency.

Das entlastet die Augen und kann das Lesen und Arbeiten am Bildschirm angenehmer machen. Insbesondere bei schwachem Umgebungslicht bietet ein dunkler Hintergrund mit heller Schrift mehr Komfort. Der Dunkelmodus bietet vielen Nutzer:innen aber auch ästhetische Vorteile. So empfinden sie den Dunkelmodus als eleganter und stilvoller. Aber auch praktische Gründe sprechen dafür. Denn der Dunkelmodus kann auch positive Effekte auf die Energiebilanz vorweisen, weil schwarze Pixel weniger Energie benötigen und damit den Akkuverbrauch (insbesondere von Mobilgeräten) schont. Auch eine verbesserte Konzentrationsfähigkeit wird dem Dark Mode nachgesagt. Aufgrund weniger heller Flächen und Kontraste wird das visuelle Rauschen reduziert. Und schliesslich können wir noch den Bogen schlagen vom Dunkelmodus zur dunklen Seite des Mondes. Denn auch die Schlafqualität profitiert davon. Weniger Blaulicht-Reize unterstützen die Melatoninproduktion und fördern damit einen natürlichen Schlaf-Wach-Rhythmus. Ein Selbstexperiment lohnt sich.

3. Trend: Mikro-Interaktionen

Oft werden Mikro-Interaktionen gleichgesetzt mit Mikro-Animationen. Daher soll für zunächst der Unterschied verdeutlicht werden. Dan Saffer packte die Bedeutung von Mikro-Interaktionen in folgenden Satz: «Der Unterschied zwischen einem Produkt, das du liebst, und einem Produkt, das du tolerierst, liegt oft in den Mikro-Interaktionen, die du mit ihm durchlebst.»3

Das beginnt beispielsweise oftmals schon mit der Installation einer neuen App. Ob sie unser Herz im Sturm erobert, oder die Liebe direkt zerbricht, entscheidet sich sehr schnell. Je nachdem, wie gut es gelingt, den Bogen zu schlagen zwischen handlungsauslösenden Triggern und dem Feedback, das auf eine ausgeführte Handlung resultiert. Auf eine User-Aktion folgt also eine Reaktion, die sich, nebenbei bemerkt, nicht nur auf digitale Anwendungen beziehen muss. Je nach Anwendung verbessern Mikro-Interaktionen die Interaktivität und unterstützen Nutzer:innen bei der Bedienung. Im digitalen Kontext handelt es sich um folgende Beispiele: der Fortschrittsbalken beim Laden einer Seite, die Anzeige einer Passwortstärke während der Passwort-Eingabe, die Statusanzeige bei einem Dokument-Upload oder -Download, der Login bei einem passwortgeschützten Zugang, der Versand eines Formulars oder auch die Anmeldung zu einem Newsletter. Wo liegen die Grenzen von Mikro-Interaktionen? Der Einsatz sollte abhängig vom Kontext gut abgewogen werden. Dabei gilt es stets zu berücksichtigen, wie oft eine Mikro-Interaktion potenziell sichtbar sein könnte. Der Grat ist schmal und zu häufige Wiederholungen können statt dem gewünschten positiven Effekt schnell das Gegenteil bewirken. Wer von euch mit der Duolingo-App vertraut ist, weiss vielleicht, wovon ich rede.

Was uns zu einem weiteren, wichtigen Aspekt bringt: Die Regeln und Bedingungen, welche für die einzelnen Rückmeldungen definiert werden sollten. Dazu zählen auch die Wiederholungsschleifen, die festlegen, was wann wie oft eingeblendet wird. So bieten sich beispielsweise Möglichkeiten zwischen neuen und fortgeschrittenen Anwender:innen zu unterscheiden. Gut überlegt und wohl dosiert eingesetzt, bieten Mikro-Interaktionen die Chance für kleine Resonanz-Geschenke. Es sind auch hier die kleinen Momente der Aufmerksamkeit, die grosses Potenzial bieten, uns ein Lächeln ins Gesicht zu zaubern. Möglicherweise lädt euch folgende Website dazu ein: https://ambientweaving2.lab.zozo.jp/en/

«Bereits 2035 wird jede fünfte Person weltweit 65 Jahre oder älter sein.»

4. Trend: Fortgeschrittene Cursor-Interaktionen

Fortgeschrittene Cursor-Animationen grenzen sich, wie der Name bereits impliziert, von den zuvor genannten Mikro-Animationen ab. Hierbei handelt es sich um animierte Hover- und Mouse-over Effekte, welche wirkungsvoll inszeniert werden. Der Cursor verwandelt sich damit in einen visuellen Indikator, der auf verschiedene Benutzeraktionen reagiert und gegebenenfalls auch zusätzliche Informationen bietet. Die Bandbreite an Cursoreffekten veranschaulichen folgende zwei Anwendungsbeispiele auf unterschiedliche Art und Weise. Während bei Purée Maison der Cursor genutzt wird, um visuelle Highlights zu setzen, verwandelt sich der Cursor bei Ultra Noir zu einer Art Joystick mit interaktivem Fokus.

Der Cursor ändert Form und Farbe, sobald dieser über Links, Buttons oder auch Bildern schwebt. Dabei sind auch komplexere Animationen möglich, wie beispielsweise das Zeichnen von Pfaden oder das Hervorheben von spezifischen Bereichen auf der Benutzeroberfläche. Cursor-Animationen bieten das Potenzial, die intuitive Bedienung zu verbessern. Sie geben direktes visuelles Feedback und zeigen Benutzer:innen, was sie als nächstes erwartet. Somit verbessern ausgefeilte Cursor-Interaktionen nicht nur die Ästhetik, sondern erfüllen auch funktionale Anforderungen. Insbesondere bei kreativen und interaktiven digitalen Web- und App-Anwendungen tragen diese Animationen dazu bei, die Aufmerksamkeit der Nutzer zu fesseln und damit die Gesamtwirkung der digitalen Erlebnisse zu verstärken. Allerdings gilt hier gleichermassen, das Mass und den Einsatz bewusst abzuwägen und den Einfluss auf die Geschwindigkeit beim Ladevorgang einer Website zu berücksichtigen. Dies könnte sich sonst unter Umständen mit einem bitteren Beigeschmack auf die Nutzererfahrung auswirken.

5. Trend: Gamification

Wenn spielerische Mittel und Dynamiken genutzt werden, um Menschen bei der Durchführung einer Aktivität, beziehungsweise beim Erreichen eines Ziels zu unterstützen, spricht man von Gamification. Spieltypische Elemente in nicht-spielerischen Kontexten motivieren auf leichtfüssige Art zu Verhaltensänderungen, so dass Alltagsaufgaben und Herausforderungen attraktiver werden. Als gezielt eingesetzte Elemente werden Benutzer:innen animiert, wiederholt und regelmässig mit einer digitalen Anwendung zu interagieren. Bestenfalls einmal und immer wieder. Es gibt verschiedene Ausprägungen, die sich insbesondere am Zweck und Ziel einer digitalen Anwendung orientieren. In Apps beispielsweise wird durch den Einsatz von Mechanismen wie Punktesysteme, Abzeichen, Ranglisten, Herausforderungen und Belohnungen die Motivation der Nutzer:innen gesteigert. Damit erhöht sich die Wahrscheinlichkeit, dass die User:innen regelmässig mit der Anwendung interagieren. Doch wie begründet sich der dahinter liegende Mechanismus?

Spieltypische Elemente senden Reize an unser neuronales Belohnungszentrum und unterstützen uns dadurch bestenfalls, neue Gewohnheiten zu etablieren. Sei es regelmässige Bewegung, das Lernen einer neuen Sprache oder gesündere Ernährung. Das ist die positive Seite eines zweischneidigen Schwerts, die keinesfalls die Risiken dieser Belohnungsreize ausblenden soll: Abhängigkeit und Suchtgefahr, Motivationsverschiebungen (intrinsich wandelt sich zu extrinsisch), sozialer Druck und Stress aufgrund von einem ständigen Vergleich mit anderen oder Manipulation, wenn Nutzer:innen zu bestimmten Verhaltensweisen verleitet werden, die primär den Interessen der Anbieter dienen. Gamification birgt ausserdem auch Risiken hinsichtlich Diskriminierung und Ungleichheit. Keine Bilanz ohne Gegenbilanz. Umso wichtiger ist es, beim Design von spielorientierten Mechaniken besonderes Augenmerk darauf zu richten, dass User:innen aufgrund nicht erfüllter Voraussetzungen (wie beispielsweise spezifische Fähigkeiten) ausgeschlossen werden. Dieser Aspekt spoilert bereits den nächsten Trend: die Barrierefreiheit.

Vorher aber noch schnell eine Anmerkung zur Anwendung von Gamification-Elementen im Kontext einer Webseite. Denn auch hier erfreut sich der Trend zunehmender Beliebtheit. Auf Webseiten werden verschieden gelagerte Bedürfnisse wie Funktionalität und Information an unterhaltsame Aspekte gekoppelt. Das wertet die User-Erfahrung emotional auf und zahlt damit auch auf das gesamte Markenerlebnis ein. Ergo erhöht sich die Nutzerloyalität und damit auch die Kundenbindung. Lust auf einen Selbsttest? Werft einen Blick auf folgendes Anwendungsbeispiel: Slosh Selzer. Nun beantwortet anschliessend folgende Fragen.

6. Trend: Barrierefreiheit

Gemäss der letzten Erhebung und Schätzung des BfS Sektion Gesundheitsversorgung leben in der Schweiz ca. 18 Prozent der Menschen mit Behinderungen, davon gelten 29 Prozent als stark beeinträchtigt.4 Aber auch die zunehmende Alterung der Bevölkerung verdeutlicht die stärker werdende Relevanz des Trends Barrierefreiheit. Bereits 2035 wird jede fünfte Person weltweit 65 Jahre oder älter sein. In der Schweiz ist das schon jetzt die Realität.5

Barrierefreiheit im UX-Kontext bedeutet, digitale Inhalte und Services allen Menschen zugänglich zu machen, unabhängig von ihren physischen oder kognitiven Fähigkeiten. Screenreader sind bereits ein länger etabliertes, praktisches Anwendungsbeispiel, ebenso wie Untertitel in Videos, welche sich längst als Standard durchgesetzt haben. Von der Barrierefreiheit profitieren nicht nur die Unternehmen durch eine vergrösserte Anwenderbasis und ein stärkeres Markenimage. Barrierefreiheit führt oft zu einer optimierten Nutzererfahrung für alle Adressaten, aufgrund klarer Navigation, guter Lesbarkeit und einfacher Bedienung. Eine grosse Herausforderung ist oftmals der Spagat zwischen besonders kreativen Designs, die gleichzeitig aber auch alle Anforderungen an die Barrierefreiheit erfüllen. Es gibt mittlerweile viele Lösungen, welche über eine sogenannte Accessability Toolbar individualisierte Darstellungsformen erlauben, je nach Präferenz der jeweiligen User:innen. Diese gehen aber einher mit zusätzlichen Lizenzgebühren.

Apropos Gebühren. Das ist ein weiterer herausfordernder Aspekt, denn grundsätzlich erfordert die Implementierung der Barrierefreiheit zusätzliche finanzielle wie auch zeitliche Ressourcen. Auch rechtliche Aspekte sind relevant. Im Juni 2025 tritt das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Dieses bildet die rechtliche Grundlage zur Umsetzung der europäischen Richtlinie zur Barrierefreiheit (European Accessability Act, kurz: EAA), mit dem Ziel, allen Menschen die Teilhabe am Wirtschaftsleben zu ermöglichen. Die veröffentlichten Guidelines geben einen Überblick über die Anforderungen an barrierefreie Web-Inhalte. Machen Sie sich am besten noch heute damit vertraut.

Abschliessend soll betont werden, dass die Bemühungen um Barrierefreiheit als teamübergreifende Disziplin gelebt und in einem frühen Projektstadium angesiedelt sein sollten. Messen Sie der Barrierefreiheit Priorität bei, damit diese in jeder Disziplin (UX, UI, Development) auf der Roadmap berücksichtigt wird.

7. Trend: Personalisierung und adaptive Interfaces

Einer Studie vom LawnStarter zufolge erwarten 90 Prozent der Verbraucher:innen massgeschneiderte Produkte und Dienstleistungen entsprechend ihrer individuellen Bedürfnisse und Erwartungen.6 Werden diese Erwartungen nicht erfüllt, sind 76 Prozent davon frustriert. Die Herausforderung liegt darin, dem Bedürfnis nach Personalisierung in einer Cookie-freien Realität gerecht zu werden, ohne die Privatsphäre der User:innen zu verletzen.

 

Folgende Ansätze stellen potenzielle Lösungsansätze dar:

  • Personalisierte Empfehlungen und Angebote basierend auf produkt- und serviceorientierten Gewinnspielen
  • Personalisierte Angebote und Aktionen basierend auf dem Kaufverhalten
  • Personalisierte (mobile) Benachrichtigungen basierend auf Kundendaten
  • Kuratierte Abonnements, basierend auf den Präferenzen der Nutzer:innen

Von den Vorzügen der Personalisierung profitieren Unternehmen nicht nur monetär, auch die Kundenloyalität und das Engagement werden gefördert. So helfen individuell angepasste Interaktionen Unternehmen, sich in einem wettbewerbsintensiven Markt zu differenzieren. Doch wie sieht eine Personalisierung aus, welche die Privatsphäre der User:innen wahrt? Ein möglicher Lösungsansatz sind dynamische Look-alike-Audiences. Ohne Cookies wird jeder wiederkehrende Besuch als neue:r Nutzer:in erfasst. Damit wird die historische digitale Customer Journey obsolet und mit jedem Besuch wird eine neue Echtzeit-Customer-Journey erstellt. Daher können nur die Echtzeitdaten aus der laufenden Sitzung Bezugspunkte für personalisierte Angebote schaffen. Die User:innen werden in Look-alike-Audiences mit jedem Klick zu einem Segment mit einem ähnlichen Nutzerverhalten zugeordnet. In Echtzeit.

Stimmen User:innen hingegen den Cookies zu oder sind bestenfalls mit einem Account eingeloggt, dann steht der Personalisierung basierend auf personenbezogenen Nutzerdaten nichts im Weg. Ein herausragendes Beispiel für Personalisierung liefert Spotify mit algorithmusbasierten Playlists, die auf den Geschmack der Nutzer:innen zugeschnitten sind. Auch Google setzt mittels adaptiver Interfaces auf personalisierte Suchergebnisse und Empfehlungen. Bei all den Vorteilen, welche die Personalisierung mit sich bringt, sind Unternehmen aber mit den Voraussetzungen einer robusten Infrastruktur und kontinuierlichen Wartung stark gefordert. Zudem muss sichergestellt werden, dass die zugrundeliegenden Algorithmen frei von Voreingenommenheit sind. Eine übertriebene Personalisierung basierend auf bisherigen Präferenzen läuft ausserdem Gefahr, dass das Entdecken neuer, vielfältiger Inhalte eingeschränkt wird. Somit geht es darum ein moderates Mass auszuloten zwischen Personalisierung und Datenschutz, so dass die Technologie den User:innen echten Mehrwert bietet.

Fazit und Check-out

Die beschriebenen Trends verdeutlichen, dass die Komplexität der technologischen Lösungen, die uns umgibt, mehr und mehr zunimmt. Alles zielt auf Komfort für die User:innen ab. Wenn mein geschätzter Arbeitskollege Phil beispielsweise von WeChat ins Schwärmen gerät, spiegelt sich seine überbordende Begeisterung im intensiven Leuchten seiner Augen wider. Das ist Brand Experience pur.

Dennoch lohnt es sich bei all den Annehmlichkeiten, auch offen und kritisch zu bleiben. Denn wie heisst es doch so treffend: There are always two sides to a story. Es gilt also bei allen Trends, das eingesetzte Mass abzuwägen. Denn das Ziel lässt sich in zweierlei Richtungen verfehlen: Entweder geht man zu weit oder aber nicht weit genug.


Check-out.

Gewappnet für die digitale Barrierefreiheit bis 2025?

Zeit für was Neues?

Lisa Apolloni

Group Account Director / Team Leader

+41 61 286 99 24
Jetzt Termin buchen