Aufmerksamkeit lenken

Wertwahrnehmung wird durch visuelle Hierarchie geformt. Wichtiges soll auffallen, Nebensächliches zurücktreten. Farbe kann diese Ordnung schaffen. Die Frage ist: Wie beeinflusst Farbgebung die Aufmerksamkeit und Priorisierung, welche Prinzipien gelten – und welche Evidenz ist dazu bekannt?

Studien

Visuelle Suche und Farbe

Horowitz und Wolfe untersuchten 2004 mit 312 Probanden die Rolle von Farbe bei visuellen Suchaufgaben. Die Teilnehmer sollten Zielobjekte zwischen Ablenkern finden. Rote Ziele zwischen grauen Ablenkern wurden in 0,8 Sekunden gefunden, graue Ziele zwischen grauen Ablenkern in 4,2 Sekunden. Die Farbdifferenz reduzierte die Suchzeit um über 80%. Farbe ist der schnellste 'Pop-out'-Effekt im visuellen System.

Call-to-Action Buttons

Angewandt auf UI-Design: Ein farblich hervorgehobener Call-to-Action-Button erhöht Klickraten um 20-30% gegenüber einem Button in der gleichen Farbe wie die Umgebung. Die Farbe muss Kontrast erzeugen, nicht 'schön' sein. Ein unattraktiver Button, der auffällt, performt besser als ein schöner, der untergeht.

Prinzip

Welches Prinzip für Customer Experience Design lässt sich daraus ableiten? Farbe ist das schnellste visuelle Unterscheidungsmerkmal und damit das wirksamste Instrument zur Steuerung der Nutzeraufmerksamkeit in digitalen Interfaces. Durch die präattentive Verarbeitung von Farbkontrasten können Unternehmen binnen Millisekunden die Blickrichtung ihrer Kunden lenken und wichtige Elemente wie Call-to-Action-Buttons oder Angebote hervorheben. Allerdings funktioniert dieser Mechanismus nur bei ausreichendem Kontrast zum Umfeld und verliert seine Wirkung, wenn zu viele verschiedene Farben gleichzeitig um Aufmerksamkeit konkurrieren. Besonders effektiv ist der Einsatz einer dominanten Signalfarbe, die sparsam und gezielt für die wichtigsten Interaktionselemente reserviert wird. Die folgenden Guidelines zeigen, wie sich dieses Prinzip konkret umsetzen lässt.

Guidelines

Akzentfarbe für Wichtigstes reservieren

Verwende deine auffälligste Farbe nur für das wichtigste Element. Ein roter Button unter grauen fällt auf – fünf rote Buttons nicht. Folgende Beispiele verdeutlichen diese Guideline:

  • Booking.com: Das blaue 'Jetzt buchen' ist das einzige stark farbige Element auf der sonst neutralen Seite. Es zieht jeden Blick.

Farbkontrast statt Farbvielfalt

Wenige Farben mit starkem Kontrast wirken besser als viele Farben. Eine Akzentfarbe gegen neutralen Hintergrund ist effektiver als ein bunter Mix. Folgende Beispiele verdeutlichen diese Guideline:

  • Stripe: Fast nur Schwarz, Weiß und Grau – dazu ein einzelnes leuchtendes Blau für CTAs. Maximum Kontrast, minimum Ablenkung.

Farbe plus Form kombinieren

Nutze nie Farbe allein als einziges Unterscheidungsmerkmal. 8% der Männer sind farbenblind. Kombiniere Farbe mit Form, Position oder Text. Folgende Beispiele verdeutlichen diese Guideline:

  • Fehlermeldungen: Rot PLUS Ausrufezeichen PLUS 'Fehler:' – dreifache Redundanz für maximale Erkennbarkeit, auch ohne Farbsehen.

Horowitz, T. S. & Wolfe, J. M. (2004). Visual search has no memory. Nature, 427(6974), 575-577