Gestaltgesetze, UX Laws und kognitive Bias
Von Jonas Die menschliche Wahrnehmung von Gestaltung und Information kann bewusst gesteuert oder unbewusst fehlgeleitet werden. Für erfolgreiches UX/UI Design ist es daher wichtig, die Gestaltgesetze, UX Laws und kognitiven Bias zu kennen.
Die »Gestaltgesetze« fassen zusammen, wie Menschen bestimmte sichtbare Gestaltungssituationen wahrnehmen. Dieses Wissen ist z. B. im Webdesign notwendig, um die Wirkung eines Layout beurteilen und bewusst steuern zu können. Die sog. »UX Laws« sind vergleichbar, beschreiben aber die Wirkung unsichtbarer gestalterischer Mittel.
Die Wirkung der Gesetze ist tief in der menschlichen Wahrnehmung verankert. Die beschriebenen Effekte treten in aller Regel ein. Viele der als Gesetz formulierten Wirkungen können gar nicht, oder nur mit Training überwunden werden.
Zuletzt gibt es noch den Bereich der sog. »kognitiven Verzerrung«. Damit wird beschrieben, dass Menschen Informationen oder Situationen unterschiedlich wahrnehmen, je nachdem welches Vorwissen sie haben bzw. in welchem Kontext Informationen konsumiert werden. Das Wissen darüber ist höchst entscheidend, damit z.B. eine Website von den Besuchenden auch so genutzt wird, wie es im Design geplant war.
Gestaltgesetze
Die Gestaltgesetze sind Prinzipien aus der Wahrnehmungspsychologie. Sie beschreiben, wie Menschen visuelle Informationen organisieren und wahrnehmen. Diese Gesetze sind auf das sichtbare Design anwendbar, da sie Hinweise darauf geben, wie visuelle Elemente in einer Benutzeroberfläche angeordnet bzw. gestaltet sein sollten, um eine klare und verständliche Wahrnehmung zu ermöglichen. Wichtig ist, dass in vielen Fällen mehrere Gesetze gleichzeitig wirken und sich gegenseitig überlagern.
Gesetz der Ähnlichkeit
Elemente, die sich in Form, Farbe oder anderen visuellen Merkmalen ähneln, werden als zusammengehörig wahrgenommen. Im Webdesign nutzen wir dieses Gesetz beispielsweise bei der Gestaltung von Teasern oder Seitentemplates. Informationen gleicher Art, sehen überall auf der Website auch gleich aus – unterscheiden sich aber deutlich von anderen Informationen.
Gesetz der Nähe
Das Gesetz besagt, dass Elemente, die näher beieinander liegen, als zusammengehörig wahrgenommen werden. Im UX/UI Design gruppieren wir thematisch zusammengehörige Informationen, um genau diese Wirkung zu erreichen.
Gesetz der Prägnanz (Gesetz der guten Gestalt):
In komplexen visuellen Elementen werden eher einfache bzw. bekanntere Formen erkannt. Übertragen auf das Design bedeutet dies, dass eine einfache, klare Gestaltung bevorzugt werden sollte – z. B. bei der Gestaltung eines Logos.
Gesetz der Geschlossenheit
Menschen haben die Tendenz, unvollständige Figuren zu vervollständigen und geschlossene Formen zu bevorzugen. Im Logo Design wird viel mit solchen Effekten gearbeitet, doch auch im UI Design werden z.B. Rahmen unterbrochen um eine interessante, reduzierte aber dennoch verständliche Gestaltung zu erreichen.
Gesetz der Kontinuität
Menschen neigen dazu, eine Linie oder Form fortzusetzen, wenn sie auf eine Unterbrechung oder Kreuzung stoßen. Dies kann in der Gestaltung verwendet werden, um den Fluss von Informationen oder Elementen zu lenken.
Gesetz der gemeinsamen Bewegung / gleiches Schicksal
Elemente, die sich in die gleiche Richtung oder mit gleicher Geschwindigkeit bewegen, werden oft als zusammengehörig wahrgenommen. Dieses Gesetz kann z. B. in Animationen genutzt werden.
Gesetz der gemeinsamen Region
Dieses Gesetz besagt, dass Elemente, die in derselben abgegrenzten Region oder demselben Rahmen liegen, tendenziell als zusammengehörig wahrgenommen werden. Dieses Prinzip kann bei der Gestaltung von Websites verwendet werden, um Informationen oder Elemente zu gruppieren und die Struktur und Organisation der Benutzeroberfläche zu verbessern.
Gesetz der Symmetrie
Das Gesetz der Symmetrie besagt, dass symmetrische Elemente oder Formen als zusammengehörig und harmonisch wahrgenommen werden. In der Gestaltung kann Symmetrie verwendet werden, um Gleichgewicht und Ästhetik zu erzeugen. Menschen neigen dazu, symmetrische Layouts als ansprechender und ordentlicher zu empfinden.
Gesetz der Verbundenheit
Das Gesetz der Verbundenheit besagt, dass Elemente, die visuell miteinander verbunden oder durch Linien oder andere Verbindungselemente in Beziehung stehen, als zusammengehörig wahrgenommen werden. Dieses Gesetz kombiniert das Gesetz der Nähe und das Gesetz der Kontinuität. Es betont, dass selbst wenn Elemente räumlich voneinander entfernt sind, sie immer noch als eine Einheit gesehen werden, wenn sie durch eine Linie miteinander in Verbindung stehen. In der Benutzeroberflächengestaltung können Linien, Pfeile oder andere Verbindungselemente verwendet werden, um zu zeigen, wie verschiedene Elemente miteinander interagieren oder in Beziehung stehen.
UX Laws
Die UX Laws sind Grundsätze und Regeln, die im Design und bei der Entwicklung von Website und Apps beachtet werden sollten. Diese Gesetze basieren oft auf Forschung oder etablierten Praktiken und beziehen sich auf stärker auf die unsichtbaren Aspekte eines Designs bzw. auf abgebildete Informationen.
Hick’s Law
Dieses Gesetz besagt, dass die Zeit, die benötigt wird, um eine Entscheidung zu treffen, mit der Anzahl der verfügbaren Optionen exponentiell steigt. Das bedeutet, dass eine einfachere Benutzeroberfläche mit weniger Optionen in der Regel zu einer schnelleren Entscheidungsfindung führt.
Fitts‘ Law
Dieses Gesetz besagt, dass größere und näher gelegene Ziele schneller und genauer getroffen werden können als kleinere und weiter entfernte. Übertragen auf UX/UI Design kann damit z.B. ein Call-to-Action-Bereich gestaltet werden: Je näher und größer der Button ist, desto leichter kann er geklickt werden.
Jakob’s Law
Dieses Gesetz besagt, dass Benutzer erwarten, dass eine Benutzeroberfläche konsistent mit anderen Benutzeroberflächen ist, die sie bereits kennen. Daher sollten Designer bewährte Konventionen und Muster befolgen, um die Erwartungen zu erfüllen.
Miller’s Law
Unter der »Millerschen Zahl« versteht man die Tatsache, dass ein Mensch nur 7 (+/- 2) Informationen gleichzeitig in seinem Kurzzeitgedächtnis abspeichern kann. Da die Größe des Kurzzeitgedächtnisses genetisch bedingt ist, kann die Zahl durch Training auch nicht gesteigert werden. Der Name stammt von George A. Miller, der 1956 diese Tatsache beschrieben hat.
Im Webdesign sollte die Regel u.a. bei der Anzahl der verwendeten Menüpunkte berücksichtigt werden.
Zeigarnik-Effekt
Dieser Effekt beschreibt die Tendenz der Menschen, sich besser an unvollendete Aufgaben zu erinnern und sie eher abzuschließen, da das Gehirn dazu neigt, unvollständige Aufgaben im Kurzzeitgedächtnis zu behalten. Übertragen auf Webdesign bedeutet dies, dass z. B. ein durch technische Probleme abgebrochener Kaufprozess im Shop sehr lange und negativ in Erinnerung bleibt.
Von Restorff-Effekt (Isolationseffekt)
Dieser Effekt besagt, dass Objekte oder Elemente, die sich von ihrer Umgebung durch eine bestimmte Eigenschaft unterscheiden (z. B. Farbe, Größe oder Form), besser erinnert werden als ähnliche Elemente. Der Effekt ist vergleichbar mit dem Gestaltgesetz der ähnlichen Form und wird u.a. für sog. »Störer« oder »Eyecatcher« genutzt.
Tesler’s Law
Das Gesetz besagt, dass die minimal notwendige Komplexität in einem System nicht verringert werden kann, sondern dann lediglich auf verschiedene Teile des Systems verschoben wird. Im UX-Design bedeutet dies, dass das Reduzieren von Komplexität in einem Bereich oft dazu führt, dass diese Komplexität anderswo im System erscheint.
Serial Position-Effekt
Dieses Prinzip besagt, dass Menschen sich eher an die ersten und letzten Elemente einer Liste oder eines Inhalts erinnern als an die Elemente in der Mitte. Dies hat u.a. Auswirkungen auf die Anordnung von Inhalten und Navigationselementen in Benutzeroberflächen: Logo zuerst, Kontakt am Ende
Postel’s Law
Dieses Prinzip besagt, dass ein System so tolerant wie möglich sein sollte, wenn es Informationen empfängt, und so restriktiv wie möglich, wenn es Informationen sendet. Bei einer Website kann dies bedeuten, dass sie tolerant gegenüber Benutzereingaben sein sollte.
Parkinson’s Law
Dieses Prinzip besagt, dass Arbeit sich soweit ausdehnt, wie Zeit für die Fertigstellung zur Verfügung steht. Es betont die Bedeutung von Fristen und Zeitmanagement.
Pareto-Prinzip (80/20-Regel)
Dieses Prinzip besagt, dass 80% der Ergebnisse oft durch 20% der Anstrengungen erzielt werden. In der UX-Designwelt könnte dies bedeuten, dass 20% der Funktionen oder Elemente einer Benutzeroberfläche den Großteil des Nutzens für die Benutzer bieten.
Occam’s Razor
Dieses Prinzip besagt, dass unter mehreren möglichen Erklärungen oder Lösungen die einfachste in der Regel die beste ist. Im UX-Design bedeutet dies, unnötige Komplexität zu vermeiden und einfache, leicht verständliche Lösungen anzustreben.
Hofstadter’s Law
Dieses Gesetz besagt: »Es dauert immer länger als erwartet«. Es unterstreicht die Tendenz von Menschen, die Zeit, die für eine Aufgabe benötigt wird, zu unterschätzen.
Aesthetic-Usability Effect
Dieser Effekt beschreibt die Tendenz der Menschen, eine Benutzeroberfläche oder ein Produkt als einfach bedienbar wahrzunehmen, wenn sie es ästhetisch ansprechend finden. Ein attraktives Design kann also die wahrgenommene Benutzerfreundlichkeit steigern.
Doherty Threshold
Dieses Prinzip besagt, dass es eine optimale Geschwindigkeit für die Interaktion mit einer Benutzeroberfläche gibt, die weder zu schnell noch zu langsam ist. Wenn die Interaktion zu schnell erfolgt, kann dies zu Fehlern führen, während eine zu langsame Interaktion die Benutzerfrustration erhöhen kann.
Goal-Gradient Effect
Dieser Effekt beschreibt die Tendenz der Menschen, schneller auf ein Ziel zuzusteuern, wenn sie sich diesem Ziel bereits näher fühlen. In UX-Design kann dies durch Fortschrittsanzeigen oder Belohnungssysteme genutzt werden, um die Motivation der Benutzer zu steigern.
Kognitive Verzerrung
Kognitive Verzerrungen (auch kognitive Bias – verzerrte Wahrnehmung), beeinflussen wie wir Informationen und Benutzeroberflächen wahrnehmen. Je nachdem in welchem Kontext oder mit welchen individuellen Vorkenntnissen eine Information wahrgenommen wird, kann sie sehr unterschiedlich interpretiert werden. Kognitive Bias werden bei der Gestaltung von Produkten und Dienstleistungen bewusst eingesetzt, um eine positive UX sicherzustellen. Sie werden auch manipulativ verwendet – z. B. sog. Dark Patterns.
Anchoring
Menschen lassen sich stark von einer anfänglichen Information (dem »Anker«) beeinflussen. Anchoring wird u.a. genutzt, um Ausgangswerte in Formularen (z.B. eine Spenden-Summe) zu definieren: Wird hier ein Start-Wert gesetzt, orientieren sich die Menschen daran.
Default Bias
Benutzer tendieren dazu, die voreingestellten Optionen oder Werte in einer Benutzeroberfläche beizubehalten, es sei denn, sie haben einen spezifischen Grund, dies zu ändern.
Framing
Die Art und Weise, wie Informationen präsentiert oder »gerahmt« werden, beeinflusst, wie Menschen sie wahrnehmen und bewerten. UX Designer können die Interpretation von Inhalten steuern, indem sie bewusst framen. Der Begriff Klimawandel erzeugt beispielsweise die Assoziation, dass die Klimaveränderungen auf der Erde ein natürlicher, langsamer Prozess wären. Klimakrise hingegen betont die dramatischen Auswirkungen.
Social Proof
Menschen neigen dazu, das Verhalten und die Entscheidungen anderer Personen als soziale Bestätigung zu betrachten und diesem Verhalten zu folgen. Im UX/UI Design wird dies u. a. durch Bewertungen oder Testimonials genutzt.
Künstliche Verknappung
Das Erzeugen eines Gefühls der Knappheit oder des Verlusts in Bezug auf ein Produkt oder eine Dienstleistung kann die Wertschätzung und das Interesse der Benutzer steigern.
Noble Edge Effect
Menschen neigen dazu, Produkte oder Dienstleistungen von Unternehmen zu bevorzugen, die soziale oder moralische Werte unterstützen oder positiv hervorheben.
Halo Effect
Dieser Effekt tritt auf, wenn eine positive Eigenschaft oder Information auf andere Aspekte übertragen wird. Das Verwenden von Kunden-Logos auf einer Website kann beispielsweise positiv auf die beworbene Leistung abstrahlen – vorausgesetzt die Logos werden positiv eingeordnet.
Geschrieben von Jonas
Jonas ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.
