Gesetze der UX (Laws of UX)
Ein Arbeits-Toolkit mit 30 Prinzipien darüber, wie Menschen sehen, erinnern, entscheiden und handeln – alle übersetzt in Entscheidungen, die Sie in einer echten Benutzeroberfläche treffen können. Dies sind keine Stilmeinungen. Sie basieren auf der Wahrnehmungs- und Kognitionsforschung und gelten plattform-, epochen- und visuellen Trend-übergreifend.
Nutzen Sie diesen Skill, um neue Benutzeroberflächen zu entwerfen, zu diagnostizieren, warum ein bestehender Bildschirm sich falsch anfühlt, oder eine Designentscheidung mit einem Grund statt einer Vorliebe zu untermauern.
So führen Sie einen UX-Durchgang durch
- Benennen Sie das Symptom. "Zu viele Knöpfe", "fühlt sich langsam an", "Leute brechen das Formular ab", "Niemand bemerkt den CTA (Call-to-Action)". Symptome lassen sich Prinzipien zuordnen – der Index unten ist entsprechend organisiert.
- Ziehen Sie die 1–3 relevanten Prinzipien heran und lesen Sie deren vollständigen Eintrag in
reference/laws.md. Lesen Sie den Mechanismus und die Fallstricke, nicht nur die Definition – dort liegt die nützliche Nuance. - Schlagen Sie eine konkrete Änderung für diesen Bildschirm vor und nennen Sie das Prinzip beim Namen, damit die Begründung nachvollziehbar ist. Nicht "mehr Kontrast hinzufügen" – stattdessen: "Von-Restorff-Effekt: Machen Sie die primäre Aktion zum einzigen gefüllten Button, damit sie nicht mehr mit den drei Geister-Buttons um sie herum konkurriert."
- Prüfen Sie auf Konflikte. Prinzipien wirken gegeneinander. Mehr Weißraum (Prägnanz) vs. mehr sichtbare Optionen (Auffindbarkeit). Einfachheit (Occam) hat eine Untergrenze (Tesler). Lösen Sie Konflikte bewusst; wenden Sie kein Gesetz blind an.
- Verifizieren Sie mit Benutzern, wenn die Einsätze real sind. Diese Prinzipien sagen Verhalten gut voraus, ersetzen aber keine Tests – der Aesthetic-Usability-Effekt warnt speziell davor, dass ein gut aussehendes Design kaputte Aufgaben verbergen kann.
Die 30 Prinzipien, nach ihrem Wirkungsbereich geordnet
Wahrnehmung & visuelle Gruppierung (Gestalt) – wie das Auge einen Bildschirm organisiert, bevor jemand ein Wort liest.
- Gesetz der Nähe (Law of Proximity) · Gesetz der gemeinsamen Region (Law of Common Region) · Gesetz der Ähnlichkeit (Law of Similarity) · Gesetz der einheitlichen Verbundenheit (Law of Uniform Connectedness) · Gesetz der Prägnanz (Law of Prägnanz) · Von-Restorff-Effekt · Selektive Aufmerksamkeit (Selective Attention) · Aesthetic-Usability-Effekt
Gedächtnis & Aufmerksamkeit – was Menschen im Kopf behalten können, während sie Ihre Benutzeroberfläche nutzen.
- Millers Gesetz (Miller's Law) · Arbeitsgedächtnis (Working Memory) · Chunking · Serieller Positionseffekt (Serial Position Effect) · Kognitive Belastung (Cognitive Load) · Zeigarnik-Effekt · Peak-End-Regel (Peak-End Rule)
Entscheidungsfindung – wie Entscheidungen getroffen werden und wo sie ins Stocken geraten.
- Hicks Gesetz (Hick's Law) · Wahlüberforderung (Choice Overload) · Kognitive Verzerrung (Cognitive Bias) · Occams Rasiermesser (Occam's Razor) · Pareto-Prinzip (Pareto Principle)
Interaktion & Leistung – Geschwindigkeit, Aufwand, Bewegung, Dynamik.
- Fitts'sches Gesetz (Fitts's Law) · Doherty-Schwelle (Doherty Threshold) · Flow · Zielgradienten-Effekt (Goal-Gradient Effect) · Parkinsons Gesetz (Parkinson's Law)
Erwartungen & mentale Modelle – was Menschen annehmen, bevor sie überhaupt ankommen.
- Jakobs Gesetz (Jakob's Law) · Mentales Modell (Mental Model) · Paradoxon des aktiven Nutzers (Paradox of the Active User) · Postels Gesetz (Postel's Law) · Teslers Gesetz (Tesler's Law)
Index – greifen Sie darauf zu, wenn…
| Prinzip | Greifen Sie darauf zu, wenn… |
|---|---|
| Aesthetic-Usability-Effekt | Sie wissen müssen, warum ein hübscheres Design als "einfacher" getestet wird – und warum das eine Falle ist. |
| Wahlüberforderung (Choice Overload) | Zu viele Optionen Menschen erstarren, schlechter entscheiden oder gehen lassen. |
| Chunking | Dichte Inhalte oder lange Zeichenketten eine Gruppierung benötigen, um überfliegbar zu sein. |
| Kognitive Verzerrung (Cognitive Bias) | Entscheidungen von "rational" abweichen – Framing, Voreinstellungen, Verankerung, Bestätigung. |
| Kognitive Belastung (Cognitive Load) | Die Benutzeroberfläche das Gehirn bittet, zu viel auf einmal zu halten oder zu verarbeiten. |
| Doherty-Schwelle (Doherty Threshold) | Sich etwas langsam anfühlt; Reaktionen ~400 ms überschreiten; Sie Ladezustände benötigen. |
| Fitts'sches Gesetz (Fitts's Law) | Sie Schaltflächen, Links und Touch-Ziele dimensionieren und platzieren. |
| Flow | Sie Menschen in den Flow-Zustand versetzen; Herausforderung an Fähigkeiten anpassen; Reibungspunkte eliminieren. |
| Zielgradienten-Effekt (Goal-Gradient Effect) | Sie Abschluss motivieren; Fortschritt, der sich kurz vor dem Ziel beschleunigt. |
| Hicks Gesetz (Hick's Law) | Die Entscheidungszeit mit der Anzahl und Komplexität der Wahlmöglichkeiten explodiert. |
| Jakobs Gesetz (Jakob's Law) | Benutzer erwarten, dass sich Ihre Benutzeroberfläche so verhält wie jede andere, die sie kennen. |
| Gesetz der gemeinsamen Region (Law of Common Region) | Sie mit Rahmen, Karten, Hintergründen, Containern gruppieren. |
| Gesetz der Nähe (Law of Proximity) | Sie allein durch Abstand gruppieren – was nah ist, wird als zusammengehörig gelesen. |
| Gesetz der Prägnanz (Law of Prägnanz) | Sie visuelle Komplexität reduzieren; das Auge bevorzugt die einfachste Lesart. |
| Gesetz der Ähnlichkeit (Law of Similarity) | Gleiches Aussehen impliziert gleiche Funktion (Links vs. normaler Text). |
| Gesetz der einheitlichen Verbundenheit (Law of Uniform Connectedness) | Sie verwandte Elemente mit Linien, Rahmen, gemeinsamen Containern verbinden. |
| Mentales Modell (Mental Model) | Sie dazu passen, wie Benutzer bereits glauben, dass die Sache funktionieren sollte. |
| Millers Gesetz (Miller's Law) | Das Arbeitsgedächtnis klein ist (~7±2 Chunks); chunk – aber überbegrenzen Sie nicht. |
| Occams Rasiermesser (Occam's Razor) | Sie jedes Element entfernen, das seinen Platz nicht verdient. |
| Paradoxon des aktiven Nutzers (Paradox of the Active User) | Leute keine Dokumentation lesen; lehren Sie im Kontext, inline, genau zum richtigen Zeitpunkt. |
| Pareto-Prinzip (Pareto Principle) | Sie sich auf die ~20% der Funktionen konzentrieren, die ~80% des Wertes ausmachen. |
| Parkinsons Gesetz (Parkinson's Law) | Aufgaben die verfügbare Zeit ausfüllen; verkürzen Sie Schritte, automatisieren Sie Ausfüllfelder, setzen Sie Erwartungen. |
| Peak-End-Regel (Peak-End Rule) | Sie den intensivsten Moment und das Ende bewusst gestalten. |
| Postels Gesetz (Postel's Law) | Sie chaotische Eingaben großzügig akzeptieren; saubere, vorhersagbare Ausgaben senden. |
| Selektive Aufmerksamkeit (Selective Attention) | Leute Dinge ausblenden; vermeiden Sie Bannerblindheit und Änderungsblindheit. |
| Serieller Positionseffekt (Serial Position Effect) | Die ersten und letzten Elemente im Gedächtnis bleiben; platzieren Sie Schlüsselaktionen an den Enden. |
| Teslers Gesetz (Tesler's Law) | Einige Komplexität nicht reduzierbar ist – lassen Sie das System sie tragen, nicht den Benutzer. |
| Von-Restorff-Effekt | Sie das eine wichtige Element sichtbar unterscheidbar machen (ohne eine Anzeige vorzutäuschen). |
| Arbeitsgedächtnis (Working Memory) | Sie Wiedererkennen dem Erinnern vorziehen; Zustand über Bildschirme hinweg beibehalten. |
| Zeigarnik-Effekt | Unerledigte Aufgaben die Aufmerksamkeit fesseln; nutzen Sie Fortschrittsanzeigen, um den Abschluss zu fördern. |
Vorgefertigte Kombinationen
- Einen überladenen Bildschirm entrümpeln → Occams Rasiermesser + Gesetz der Nähe + Millers Gesetz.
- Einen sich langsam anfühlenden Ablauf beschleunigen → Doherty-Schwelle + Zielgradienten-Effekt + optimistische UI.
- Eine verwirrende neue Funktion reparieren → Jakobs Gesetz + Mentales Modell + Paradoxon des aktiven Nutzers.
- Ein verlassenes Formular retten → Hicks Gesetz + Parkinsons Gesetz + Postels Gesetz + Fortschrittshinweise (Zeigarnik / Zielgradienten-Effekt).
- Eine Landing Page schärfen → Von-Restorff-Effekt + Selektive Aufmerksamkeit + Serieller Positionseffekt + Peak-End-Regel.
Vollständige Einträge – Mechanismus, Anwendungsweise, Fallstricke und ein echtes Beispiel für jedes – finden sich in reference/laws.md.