Bei User Experience dreht sich alles um Kausalität: Woher weißt du, welche Events welche Konsequenzen haben? Neben User Testing und dem Einsatz von Design Patterns liefern dir zusätzlich UX Laws Antworten auf deine Fragen. Richtig eingesetzt wirst du damit die Usability deiner Website langfristig verbessern und Websitebesuchende zum Verweilen einladen.
UX Laws – oder auch Regeln des User Experience Designs – sollen dir helfen, besser zu verstehen, wie deine Designs von Endnutzer:innen verstanden werden. Diese Regeln haben oftmals einen psychologischen Ansatz. Ihr Ursprung kann aber aus allen Bereichen der Wissenschaft kommen. Sie sind häufig vereinfachte Abwandlungen ihrer ursprünglichen Thesen. Daher ist es wichtig, dass wir uns anschauen, woher sie eigentlich kommen und was damit tatsächlich gemeint ist.
Jakob’s Law
Wer deine Website nutzt, verbringt prozentual mehr Zeit auf anderen Websites als auf deiner. Deswegen haben User:innen die Erwartung, dass deine Website genauso funktioniert wie alle anderen. Etabliert wurde diese Regel von Jakob Nielsen. Auf YouTube findest du eine Erklärung dieser Theorie.
In allem, was wir tun, setzen wir unsere Fähigkeit ein, etwas zu lernen. Im Bereich Websites sind das bestimmte Abläufe, denen wir folgen, um etwas Bestimmtes zu erzielen. Wie viele Versuche wir zum Lernen benötigen, kann mit Hilfe von User Testing herausgefunden und als Lernkurve dargestellt werden.
Der Lernprozess kann dabei für allgemeine Abläufe nicht nur auf deiner Website, sondern auf allen Websites parallel stattfinden. Dadurch lernen Nutzer:innen viel schneller und können sich als Konsequenz schneller im Web fortbewegen. Diese immer wiederkehrenden Muster nennen wir Design Patterns. Anhand dieser Muster kannst und solltest du die Funktionen deiner Website designen.
Leider wird unter Jakob’s Law auch oft verstanden, dass innovatives Design negative Auswirkungen hat. Denn das Ziel ist es ja, eine Website zu präsentieren, die deine Zielgruppe im besten Fall ohne große Mühe verstehen und nutzen kann.
Innovation und Überraschungsmomente sind auch Gründe, warum eine Website im Gedächtnis hängen bleibt. Es bietet sich also an, die funktionellen Aspekte deiner Website an Design Patterns zu orientieren. Kreative Ideen und Überraschungsmomente können dann als visuelle Aspekte eingesetzt werden. Hier bieten sich zum Beispiel Animationen, Mikrointeraktionen sowie eine ausgefeilte Farbwahl an.
Das Team von Threadless lockert das Design mit einer Animation auf. Diese erscheint, wenn jemand etwas in den Einkaufswagen legt. Da die Animation durch eine Aktion getriggert wird, welche User:innen regelmäßig wiederholen sollen, kommt hier auch Gamification ins Spiel.
Miller’s Law
Unser Kurzzeitgedächtnis kann sich etwa sieben Dinge merken.
Benannt wurde diese Thesis nach George A. Miller und seiner Publikation „The Magical Number Seven, Plus or Minus Two“. Demnach können wir unser Kurzzeitgedächtnis lediglich mit fünf bis neun Dingen belasten. Das können Wörter, Zahlen oder die Aneinanderreihung von Charakteren, sogenannten Chunks, sein.
Sicherlich hast du schon von dem Trick gehört, Zahlen in Päckchen zu bündeln, um sie dir schneller merken zu können. 568 741 896 256 kannst du dir schneller einprägen als 568741896256.
Manche Wissenschaftler:innen zweifeln die These an und behaupten, wir können sogar nur 4 Elemente zwischenspeichern. Für das Erstellen von Websites hat sich deshalb manchmal die Meinung entwickelt, Menüs dürfen nur höchstens vier, maximal sieben Punkte haben. Sich verbissen an diese Regel zu halten, ist vermutlich sinnlos.
Das Menü dient als Inhaltsangabe für deine Website. Durch diese navigieren sich Besuchende durch alles, was deine Website zu bieten hat. Die Navigation künstlich zu verschmälern, hat lediglich die Konsequenz, dass Inhalte schwerer auffindbar werden.
Stattdessen solltest du deine Navigation eher in die Breite als in die Tiefe aufbauen. Das heißt: So wenige Ebenen wie möglich (aber so viele Ebenen wie nötig). Dabei solltest du in Betracht ziehen, dass sich User:innen schwerer zurechtfinden, wenn du mehrere Ebenen hast und entsprechend andere Indikatoren zu Hilfe nehmen, wie Breadcrumbs.
Hick’s Law
Je mehr Auswahlmöglichkeiten der Mensch hat, desto länger dauert es eine Entscheidung zu treffen. Das kann sogar bis zur Unfähigkeit, sich zu entscheiden, gehen.
Die amerikanischen Psychologen Edmund Hick und Ray Hyman sind für diese Thesis verantwortlich. Hick’s Law wird deswegen auch Hick-Hyman Law genannt. Sie erforschten, die Zusammengehörigkeit zwischen der Anzahl an gegeben Auswahlmöglichkeiten und der Zeit, die Probanden benötigten, um eine Entscheidung zu treffen.
Wie schon bei Miller’s Law, wird berücksichtigt, dass unser Gehirn eine limitierte Kapazität an verfügbarem „Arbeitsspeicher“ hat. Wird diese Kapazität ausgeschöpft, dann ist die Wahrscheinlichkeit groß, dass eine Aufgabe abgebrochen wird.
Anstatt also all deine Produkte auf einer Seite anzuordnen, ergibt es Sinn eine kleine Auswahl zu treffen. Am besten verarbeiten wir diese Auswahl, wenn sie in Kategorien unterteilt sind. Prozesse wie Formulare sollten in kleineren, leichter verdaubaren Häppchen serviert werden.
Auch die Anzahl an Produkten, die miteinander verglichen werden, sollte gering gehalten werden. Üblicherweise findest du drei bis vier Preisklassen auf den meisten Websites. Auch das Vorauswählen wie bei Elementor kann dem User dabei helfen sich schneller zu entscheiden.
Parkinson’s Law
Die gesamte verfügbare Zeit wird verwendet, um eine Aufgabe zu erledigen.
1955 veröffentlichte Cyril Northcote Parkinson ein Essay, in welchem er das folgende Konzept beschreibt. Je mehr Zeit wir für eine Aufgabe haben, desto mehr Zeit werden wir dafür verwenden, sie zu erfüllen. Ursprünglich war seine Annahme an die stetig wachsende Bürokratie und an Unternehmen gerichtet. Du kannst diese Regel jedoch auf viele Aspekte übertragen. Je näher eine Deadline rückt, desto produktiver werden wir. Je mehr Zeit wir haben, desto eher neigen wir zur Prokrastination.
Mithilfe von Miller’s und Hick’s Law sind wir uns schon darüber bewusst, dass das Aufteilen von Prozessen in kleinere Teilabschnitte unsere Arbeit erleichtert. Die Effizienz kannst du steigern, indem du eine Zeit vorgibst.
Das Team von Rede Expressos reserviert ein Ticket für 10 Minuten. Du hast also eine begrenzte Zeit, deine Kaufentscheidung umzusetzen, bevor du eine erneute Suche starten musst. Diese Regel verhindert einerseits, dass jemand den Kauf hinauszögert und erst etwas anderes macht. Unter Umständen kann dies aber auch Druck ausüben – und zu einem Abbruch des Checkouts führen. Online Banking Portale verfügen auch häufig über einen Countdown. Obwohl dieser eher aus Sicherheitsgründen implementiert wurde, sorgt er dafür, dass wir alles, was wir auf der Bank Website machen wollten, direkt tun und nicht einzelne Tasks auf später verschieben.
Fitts’ Law
Die Zeit, die benötigt wird, um ein gewisses Ziel zu erreichen, kann durch die Distanz und die Größe des Ziels bestimmt werden.
Der Psychologe Paul Morris Fitts veröffentlichte 1954 ein Paper, in dem er seine Experimente dazu veröffentlichte. Darin erklärt er, dass man eine Bewegung in zwei Phasen unterteilen kann:
- In der ersten Phase bewegen wir uns auf das Ziel zu. Diese Phase wird hauptsächlich durch die Entfernung bestimmt und wird als schnell und grob beschrieben.
- Während der zweiten Phase verlangsamt sich die Bewegung, da wir nun das eigentliche Ziel anvisieren. Je kleiner das Ziel, desto länger dauert diese Phase.
Vor allem im Design für mobile Geräte wird diese Regel immer wieder gepredigt. Die Platzierung und Größe eines Buttons beeinflussen direkt die Effizienz mit der deine Website bedient werden kann.
Links oder Buttons, die häufiger verwendet werden, müssen sich deshalb ganz klar in einem Bereich befinden, der einfach zu erreichen ist. Die Größe muss für Touchscreens angepasst werden. Zusätzlich solltest du bedenken, dass User dennoch häufig daneben tippen und deshalb genug Abstand einplanen – vor allem auch zu Logout Buttons.
Aber auch auf Desktop Größen solltest du diese Regel anwenden. Zwar haben wir hier die Möglichkeit mithilfe der Mousse auch kleinere Ziele anzuklicken, der Screen an sich ist aber viel größer und demnach auch die Distanz, die zurückgelegt werden kann.
Im Beispiel von MST kannst du Fitt’s Law im Einsatz sehen. Um das Menü auszufahren, müssen Nutzende auf das Icon rechts oben klicken.
Daraufhin öffnet sich von rechts die Navigation mit mehreren möglichen Interaktionen. Um das Menü wieder zu schließen, muss der Zeiger gar nicht bewegt werden. Hast du also aus Versehen oder aus Neugierde draufgeklickt, kannst ohne Mühe zum vorherigen Screen zurückkehren.
Die Menu Items, die sich am nächsten empfinden, sollten die sein, die am meisten angeklickt werden. Die, die weniger wichtig sind – etwa die E-Mail Adresse – sind am weitesten weg. Auch die Tatsache, dass sich zunächst alles auf dem rechten Bildschirm abspielt, steigert die Effizienz. Schließlich befinden sich User:innen schon auf der rechten Website. Die möglichen Wege sind also sehr kurz gehalten.
Fazit zu UX Laws
Nun kennst du die meistzitierten Regeln für User Experience. Es gibt noch weitere wie Postel’s Law und Tesler’s Law. Auch in Zukunft wird die Forschung weiterhin ihr Bestes geben, um die Motivation und die Beeinflussbarkeit unseres Verhaltens zu analysieren. Designer:innen bieten oft die Schnittstelle zwischen Produkt und Anwendenden. Deswegen ist es unumgänglich, dass wir uns auch mit diesem Thema auseinandersetzen. Besonders wichtig ist, dass wir unser Wissen für und nicht gegen die User:innen einsetzen.
Du möchtest mehr über Psychologie in Webdesign erfahren? Dann wirf einen Blick auf die folgenden Ressourcen:
- Laws of UX ist eine Sammlung von Best Practices, die du als Designer:in bei der Gestaltung von User Interfaces berücksichtigen können.
Deine Fragen zu UX Laws
Welche Fragen zu UX Laws hast du? Nutze gerne die Kommentarfunktion. Du willst mehr über Webdesign und Entwicklung erfahren? Dann folge uns auf Twitter, Facebook, LinkedIn oder über unseren Newsletter.
Sicher ein interessanter Artikel. Wird leider durch Gendern mit dem Doppelpunkt für Nutzer mit Seheinschränkungen und für Nutzer von Screenreadern nicht oder nur schwer lesbar.