Veränderungsblindheit: Warum Menschen nicht das sehen, was Designer erwarten

Menschen übersehen häufig neue visuelle Details, die einem bestehenden Bild hinzugefügt wurden. Diese Veränderungsblindheit kann wichtige Informationen, wie Fehlermeldungen und Navigationsmenüs betreffen, was Nutzer verwirrt und Aufgaben scheitern lässt.

 

by Kathryn Whitenton (deutsche Übersetzung) - 01.04.2015

 

Unser Verstand agiert bei bestimmten Aufgaben erstaunlich schnell und korrekt, scheitert aber in anderen Situationen regelmässig. Zu verstehen, was die Gründe für Erfolg und Misserfolg sind, ist der Schlüssel zur Erstellung effektiver Nutzeroberflächen. Studien ergaben zum Beispiel, dass Menschen Veränderungen der Details eines Bildes meist nicht bemerken. (Testen Sie es mit diesem Quiz zur Veränderungsblindheit (engl.) selbst.)

• Veränderungsblindheit ist die Tendenz des Menschen, Änderungen in Bildern zu übersehen, vor allem, wenn diese Veränderungen direkt nach einer visuellen Unterbrechung, wie einem Flackern des Bildschirms, erscheinen.

Zwei verschiedene Faktoren spielen eine grosse Rolle, was die Wahrscheinlichkeit des Auftretens von Veränderungsblindheit betrifft:

1. Störungen der visuellen Wahrnehmung, welche auftreten können, während eine Seite neu lädt, wenn wir blinzeln, während unsere Augen schnell von einem Fixierungspunkt zum nächsten springen oder wenn sich ein Bildschirm bewegt, während ein Gerät vom vertikalen zum horizontalen Modus wechselt.

2. Geschwindigkeit: Momentane Veränderungen der visuellen Details werden mit grösserer Wahrscheinlichkeit bereits durch kurze Unterbrechungen verschleiert. Ein Zwinkern dauert normalerweise 300-400 Millisekunden - Veränderungsblindheit kann bereits auftreten, wenn ein Bild für nur 67 Millisekunden (engl.) unterbrochen wird.

Diese beiden Faktoren treten häufig in digitalen Anwendungsbereichen auf, in denen regelmässig visuelle Elemente erscheinen und praktisch sofort wieder verschwinden. Andere Faktoren, wie die Aufmerksamkeit und visuelle Übersättigung, spielen ebenfalls eine Rolle, was die Veränderungsblindheit betrifft. Immer, wenn einer Darstellung ein neues visuelles Element hinzugefügt wird, besteht das Risiko, dass es übersehen wird. Wenn ein Besucher auf der mobilen Website von Vans.com eine Grösse auswählt, die nicht verfügbar ist, verändert sich der Text des Buttons In den Warenkorb in Nicht auf Lager. Diese winzige Veränderung des Texts fällt allerdings nicht auf, da der Rest der Darstellung gleich bleibt.

Vans.com: Die Nicht auf Lager Nachricht wird leicht übersehen, da sie dem In den Warenkorb Button zu stark ähnelt und zu weit von der Stelle entfernt ist, die der Nutzer in diesem Moment betrachtet (die Felder Grösse und Menge).

Auch wenn Nutzer das neue Detail irgendwann finden, wird die Verzögerung die gesamten Interaktionskosten (engl.) erhöhen. Es gibt bestimmte Designelemente, die besonders anfällig für Veränderungsblindheit sind und die unter Berücksichtigung dieses Phänomens erstellt werden sollten.

Fehlermeldungen und Statusbenachrichtigungen

Fehlermeldungen (engl.) sind, wenig überraschend, häufig von Veränderungsblindheit betroffen. Der Nutzer übermittelte soeben ein Formular, der Bildschirm zuckt und 99% der Seite sehen genau gleich aus - nur ein einziges neues Element wurde hinzugefügt. Das unten stehende Beispiel von Goodsourcing.com zeigt eine Fehlermeldung, die sehr wichtig ist: die Meldung Datenübertragungsfehler, welche den Nutzer darüber informiert, dass das Pflichtfeld Job Title nicht ausgefüllt wurde. Diese Information wird aber leicht übersehen, da ihre visuelle Darstellung mit dem Rest der Seite verschwimmt.

Die Benachrichtigung über einen Datenübertragungsfehler wurde dem bestehenden Inhalt dieses GoodSourcing.com Registrierungsformulars nach dem erneuten Laden der Webseite hinzugefügt (direkt über der Überschrift Member Registration) - allerdings kann sie aufgrund von Veränderungsblindheit leicht übersehen werden.

Fortschrittsanzeigen oder andere Statusbenachrichtigungen, die Nutzern dabei helfen, zu verstehen, was in einem System passiert, werden ebenfalls häufig übersehen, da sie kleine visuelle Elemente sind, die einem existierenden Bildschirm hinzugefügt werden. Sogar animierte Fortschrittsanzeigen, wie der weisse Kreis in der Mitte der Southwest Airlines App, können übersehen werden, falls sie sich nicht vom Rest des Bildschirms unterscheiden.

Links: Die weisse animierte Fortschrittsanzeige in der Southwest Airlines App ist fast unmöglich zu erkennen, obwohl sie sich genau in der Mitte des Bildschirms befindet. Recht: Eine ähnliche Fortschrittsanzeige auf Kayak.com fällt auf, da sie über ein kontrastfarbenes Hintergrundelement verfügt, das sich von der App abhebt.

Navigationsleisten und Menüs

Navigationsleisten sind ebenfalls häufig Opfer der Veränderungsblindheit. Diese Links sind zwar wichtig, sie werden aber häufig am Rand eines Designs platziert, um es Nutzern zu ermöglichen, sich auf den Inhalt der Hauptseite zu konzentrieren. Kleine Veränderungen am Rand des Sichtfeldes fallen Menschen allerdings weniger auf. Das unten stehende Beispiel zeigt eine einheitliche visuelle Darstellung der lokalen Navigation, allerdings mit verschiedenen Linktexten in unterschiedlichen Bereichen der Webseite. Einen einheitlichen visuellen Navigationsstil mit verschiedenen Links in unterschiedlichen Bereichen zu verwenden, ist ein häufiges und bekanntes Designmuster. Doch in diesem bestimmten Fall haben die ungewöhnliche Platzierung auf der rechten Seite und die visuelle Übersättigung des Designs zur Folge, dass Besucher die Navigation überhaupt nicht bemerken. Zu bemerken, dass sich die Links veränderten, während zu einer anderen Seite gewechselt wurde, ist noch unwahrscheinlicher.

Die lokale Navigation in der rechten Spalte verändert sich auf jeder Unterseite der Webseite, was aber leicht übersehen werden kann.

Gefilterte Resultate

Wenn Nutzer eine grosse Anzahl von Resultaten eingrenzen müssen, sind Filter sehr nützlich - allerdings sind sie auch schwer zu implementieren. Menschen bevorzugen ein System, das schnell antwortet, um die Wartezeit zu reduzieren. Falls das System die Resultate allerdings sofort ändert, könnten Nutzer nicht bemerken, dass ein Filter angewandt wurde und jetzt weniger Resultate angezeigt werden.

Die Healthcare.gov Webseite geht erfolgreich mit diesen gegensätzlichen Bedürfnissen um: Filter werden angewandt, sobald darauf geklickt wird (ohne dass der Nutzer einen zweiten Schritt, nämlich den Klick auf "Filter anwenden", absolvieren muss). Um sicherzustellen, dass Nutzer die Veränderung der Resultate bemerken, erscheint kurz ein auffälliger visueller Indikator, während der Filter angewandt wird: die Bitte warten Nachricht und ein grauer Bildschirm-Overlay.

Die Healthcare.gov Webseite stellt sicher, dass Nutzer die Veränderung der Resultate bemerken, indem eine auffällige "Bitte warten" Nachricht angezeigt wird, während die Filter angewandt werden.

Veränderungsblindheit bekämpfen:

Die Umstände, die zu Veränderungsblindheit beitragen, treten so häufig auf, dass alle Designer Techniken kennen sollten, um das Problem zu minimieren. Verschiedene Techniken können in unterschiedlichen Situationen angewandt werden. Sie inkludieren:

Visuelle Unterbrechungen minimieren, indem (falls möglich) vermieden wird, dass Seiten neu geladen werden.

Verwendung angemessener optischer Akzente für wichtige neue Elemente (wie Kontrast, Grösse und Hintergrundfarbe), um sicherzustellen, dass sie bemerkt werden. (Machen Sie den "Blinzeltest": fällt das neue Element auf, wenn Sie sich zurücklehnen und Ihre Augen zusammenkneifen?)

Strategische Platzierung wichtiger, neuer visueller Elemente an einem Ort, der in Nähe der Stelle liegt, die sich bereits im Sichtfeld des Nutzers befindet.

Denken Sie über animierte Übergänge nach, um schnelle Veränderungen zu vermeiden, die wegen einer Unterbrechung übersehen werden könnten: Animationen können effektive Instrumente sein, um Änderungen einer Nutzeroberfläche zu erklären.

Die Veränderungsblindheit ist nur eines von vielen psychologischen Phänomenen, die das Nutzererlebnis beeinflussen. In unseren ganztägigen Trainingskursen über Nutzerverhalten (engl.) und die Mensch-Computer-Interaktion (engl.) erfahren Sie mehr darüber, wie Wahrnehmung und Auffassung die UX beeinflussen.

 

© Deutsche Version. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.