Evidenzbewertung

Effekt-Score (E): 4/5 Beleglage für das zugrunde liegende Prinzip bzw. die Messmethode.

Transfer-Score (T): 3/5 Belege für zuverlässige Ergebnisse in der digitalen Produktpraxis.

Evidenz-Level: Hoch

[Plausibel durch UX-Forschung] Vermutete Affordanzen nicht allein aus visuellen Konventionen ableiten; Verständlichkeit am konkreten Interface testen.

Skala und Bewertungsregeln

Effekt-Score: 5 gesichert · 4 belastbar · 3 kontextabhängig · 2 schwach · 1 vorläufig.

Transfer-Score: 5 praxisbelegt · 4 feldbelegt · 3 teilweise belegt · 2 plausibel · 1 Hypothese.

Ohne fundierte wissenschaftliche oder normative Quelle ist E auf 3 begrenzt. Blog- und Agenturmeinungen begründen höchstens T=2. Bei nicht aufgelösten Konflikten gilt der konservativere Wert.

Evidenz-Level: Hoch = E ≥ 4 und T ≥ 3; Moderat = E ≥ 3; Vorläufig = E ≤ 2 oder T ≤ 1.

Wahrnehmung und Affordanz

Nutzende erschließen Interaktionsmöglichkeiten aus den Eigenschaften eines Interfaces und den Hinweisen, die es bietet. Gestaltung kann Erwartungen unterstützen; ob Hinweise verständlich sind, hängt auch von Person und Kontext ab.

Definition Affordanz

Eine Affordanz ist eine Handlungsmöglichkeit, die sich aus der Beziehung zwischen den Eigenschaften einer Umgebung und den Fähigkeiten einer handelnden Person ergibt. Eine wahrgenommene Affordanz ist eine Handlungsmöglichkeit, die die Person erkennt; beide können auseinanderfallen.

Affordanzen in der Mensch-Computer-Interaktion

Digitale Interfaces haben Eigenschaften, die Handlungsmöglichkeiten ermöglichen oder begrenzen; zusätzlich vermitteln sichtbare Hinweise, welche Handlungen möglich sein könnten. Affordanzen und ihre Wahrnehmung sind daher zu unterscheiden. Gestaltungshinweise können beispielsweise sein:

Form: Ein Button mit Tiefe oder Schatten lädt zum Klicken ein.
Symbolik: Ein Papierkorb steht für Löschen – auch ohne Erklärung.
Position: Schließen-Symbole in der Ecke folgen konventionellen Mustern.
Bewegung: Hover-Effekte oder Animationen deuten auf Reaktion hin.

Eine Gestaltung sollte wichtige Handlungsmöglichkeiten erkennbar machen, ohne vorauszusetzen, dass ein einzelner visueller Stil von allen Nutzenden gleich verstanden wird.

Affordanz und Wahrnehmung

Technische Interaktionsmöglichkeit und wahrgenommene Handlungsmöglichkeit sind nicht dasselbe. Hinweise sollten mit Nutzenden im jeweiligen Kontext überprüft werden.

Wahrnehmung im UX-Kontext

Das menschliche Gehirn strukturiert visuelle Informationen nach bekannten Mustern. Diese Gestaltprinzipien helfen beim UX-Design:

Nähe: Stehen Elemente eng beieinander, werden sie als zusammengehörig interpretiert.
Ähnlichkeit: Gleiche Farben oder Formen signalisieren gleiche Funktion.
Geschlossenheit: Unvollständige Formen (z. B. Umrandungen) werden als ganze Flächen wahrgenommen.
Kontinuität: Linien oder Reihen führen visuell durch die Oberfläche.

Diese Prinzipien bilden die Grundlage für visuelle Hierarchie, Orientierung und Navigierbarkeit.

Gestaltung überzeugender Affordanzen

Statt Bulletpoints eine narrative Darstellung:

Ein gutes Interface nutzt etablierte visuelle Konventionen. Ein Link ist in der Regel blau und unterstrichen – und sollte auch so erscheinen. Wird diese Konvention gebrochen, etwa durch grauen Text ohne Unterstreichung, bleibt die Affordanz verborgen. Nutzer:innen müssen raten, was interaktiv ist. Das erhöht die kognitive Belastung und senkt die Usability.

Auch Rückmeldung spielt eine wichtige Rolle: Ein Button, der beim Klicken keine visuelle oder auditive Reaktion zeigt, wird als unzuverlässig wahrgenommen – selbst wenn er technisch funktioniert.

Falsche Affordanzen sind besonders kritisch. Wenn ein Textelement wie ein Link aussieht, aber keiner ist, führt das zu Frustration. Umgekehrt können versteckte Affordanzen – etwa nicht gekennzeichnete Drag-and-Drop-Funktionen – zur Fehlbedienung führen.

Praxisbeispiel: Link-Gestaltung

Ein Textlink, der aussieht wie Fließtext, ohne Farbe, Unterstreichung oder Hover-Effekt, wird häufig übersehen.
Besser: Der Link wird visuell hervorgehoben (z. B. primäre Farbe, Unterstreichung beim Hover, veränderter Cursor) und kontextuell platziert (z. B. innerhalb eines Navigationsmenüs).

Fazit

Affordanzen und Wahrnehmungsmuster sind kein „ästhetisches Extra“, sondern zentral für die Gebrauchstauglichkeit digitaler Produkte.
UX-Design muss gezielt auf visuelle Klarheit, semantische Konsistenz und wahrnehmbare Interaktion setzen – damit Systeme intuitiv und fehlerarm nutzbar werden.

Merksatz

Gute Interfaces müssen nicht erklärt werden – sie zeigen, was sie können.

Häufige Fragen (FAQ)

Was bedeutet Affordanz im UX-Design?

Eine Affordanz ist eine Handlungsmöglichkeit, die sich aus der Beziehung zwischen den Eigenschaften einer Umgebung und den Fähigkeiten einer handelnden Person ergibt. Eine wahrgenommene Affordanz ist eine Handlungsmöglichkeit, die eine Person wahrnimmt; beides kann auseinanderfallen.

Was ist der Unterschied zwischen wahrgenommener und tatsächlicher Affordanz?

Die Affordanz bezeichnet eine Handlungsmöglichkeit in der Beziehung zwischen Person und Umgebung, nicht bloß eine technische Funktion. Die wahrgenommene Affordanz beschreibt, welche Handlungsmöglichkeiten eine Person erkennt. Hinweise und Konventionen können diese Wahrnehmung prägen; fehlende oder irreführende Hinweise können Interaktionen erschweren.

Warum sind Affordanzen wichtig für Usability?

Handlungsmöglichkeiten und ihre wahrnehmbaren Hinweise beeinflussen, welche Interaktionen Nutzende erwarten und ausführen. Ob ein Interface verständlich ist, sollte am konkreten Nutzungskontext überprüft werden.

Welche Gestaltprinzipien beeinflussen die Wahrnehmung?

Prinzipien wie Nähe, Ähnlichkeit, Geschlossenheit und Kontinuität strukturieren visuelle Informationen und helfen, Orientierung und Interaktionsmöglichkeiten schnell zu erfassen.

Wie kann man Affordanzen im Interface-Design verbessern?

Durch Hinweise und Konventionen, die zur jeweiligen Handlung passen, sowie verständliches Feedback. Farbe, Form, Animationen und Symbole sind keine universellen Signale und sollten im Kontext geprüft werden.

Was sind Beispiele für falsche Affordanzen?

Wenn ein Textelement wie ein Link aussieht, aber keiner ist, oder wenn eine Drag-and-Drop-Funktion existiert, aber nicht erkennbar ist. Solche Inkonsistenzen führen zu Frustration.

Science-Corner: Evidenzdaten

Setting

Wahrnehmungspsychologische Forschung und Interaktionsdesign

Replikationsstatus

Gemischte Befundlage

Evidenz-Level

Hoch (E=4, T=3)

Schlüsselquellen (APA)

Gibson, J. J. (1979). The ecological approach to visual perception. Houghton Mifflin.
Norman, D. A. (1999). Affordance, conventions, and design. Interactions, 6(3), 38–43. https://doi.org/10.1145/301153.301168
Gaver, W. W. (1991). Technology affordances. Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, 79–84. https://doi.org/10.1145/108844.108856
Hartson, H. R. (2003). Cognitive, physical, sensory, and functional affordances in interaction design. Behaviour & Information Technology, 22(5), 315–338. https://doi.org/10.1080/01449290310001592587
Wagemans, J., Elder, J. H., Kubovy, M., Palmer, S. E., Peterson, M. A., Singh, M., & von der Heydt, R. (2012). A century of Gestalt psychology in visual perception: I. Perceptual grouping and figure–ground organization. Psychological Bulletin, 138(6), 1172–1217. https://doi.org/10.1037/a0029333

Prüfdatum / Version

2026-11-01 · 1.1

Nächste Prüfung

2027-11-01 (Review-Rhythmus: 12 Monate)

Zuletzt geändert: 1. November 2026