Designpsychologie und die Neurowissenschaft von Awesome UX

Hören Sie sich die Audioversion dieses Artikels an

Es gibt eine Wissenschaft darüber, warum bestimmte Designs Ihre Aufmerksamkeit erregen und Ihr Blut in Wallung bringen.

Das menschliche Gehirn ist faul, voreingenommen und anfällig für Abkürzungen.

Die Untersuchung der Benutzererfahrung der menschlichen Kognition kann matschig, unwissenschaftlich und voller falscher Annahmen sein – vielleicht ist es die Schuld eines faulen Gehirns.

Kognition ist komplex, und viele Faktoren spielen bei Bauchreaktionen oder einem sofortigen Eindruck eine Rolle. Wenn du jemanden fragst: "Warum hast du das getan?" Es besteht eine hohe Wahrscheinlichkeit, dass sie nicht antworten können oder dass Sie ihre Antwort falsch interpretieren.

Geben Sie die Neurowissenschaften ein.

Während Forschungsmethoden wie Beobachtung und Befragung oft von UX-Forschern und Teilnehmern verlangen, dass sie Vermutungen anstellen, ermöglicht moderne Technologie wie Eyetracking den Forschern, fast unmerkliche Reaktionen und Vorlieben zu untersuchen .

Bei Produkten mit erheblichem Traffic können scheinbar winzige Details wie die Breite einer Schaltfläche oder der Farbkontrast von Text Millionen von Dollar ausmachen. Aus diesem Grund beginnen Technologiegiganten wie Facebook und Google, neurowissenschaftliche Techniken einzusetzen, um zu untersuchen, wie Menschen ihre Produkte verwenden.

Beginnen wir mit einer Einführung in reaktives, „schnelles Denken“ und geben Designern ein paar Tipps, wie sie die Kraft der Neurowissenschaften nutzen können, um großartige Benutzererlebnisse zu schaffen.

Designpsychologie: Schnelles Denken, langsames Denken

Es ist kein Geheimnis, dass vieles, was das menschliche Verhalten antreibt, unbewusst ist. In den Millisekunden, nachdem eine Person auf eine neue App oder Website gestoßen ist, feuern Millionen von Neuronen und das Gehirn trifft Hunderte von unbewussten Entscheidungen.

Bin ich am „richtigen“ Ort? Soll ich dieser Seite vertrauen?

Der YouTube UX-Forscher Javier Bargas-Avila stellte in einer Studie aus dem Jahr 2012 fest, dass Menschen in den ersten 17 bis 50 Millisekunden nach der Exposition ästhetische Reaktionen auf eine Webseite bilden .

Um das ins rechte Licht zu rücken: Das Auge braucht 300-400 Millisekunden, um zu blinzeln. Ihr Produkt kann in weniger als einem Wimpernschlag vor Gericht gestellt, verurteilt und verurteilt werden.

Diese Eindrücke werden möglicherweise nicht registriert, aber sie wirken sich auf das Verhalten aus. Wenn beispielsweise eine Website langsam geladen wird und das Gehirn die ersten Elemente liest, die als „off-topic“ geladen werden, kann der Benutzer sofort wegnavigieren, anstatt zu warten, bis die Website geladen ist.

Unternehmen wie Facebook investieren erhebliche Ressourcen in die Untersuchung der Ladereihenfolge von Elementen. Wenn sich jemand bei Facebook anmeldet und keine Benachrichtigungs-Badges sieht, kann er sofort wegnavigieren. Wenn die Abzeichen zuerst geladen werden, können sie warten, während der inhaltsreiche Newsfeed geladen wird.

Das Buch Thinking, Fast and Slow des Nobelpreisträgers Daniel Kahneman bricht das menschliche Denken und die Entscheidungsfindung in zwei Systeme, um den Unterschied zu veranschaulichen.

System 1: schnell, automatisch, häufig, emotional, stereotyp, unbewusst.

Das Denken von System 1 ist reaktiv – verantwortlich für komplexe, aber instinktive Wahrnehmungen wie die Bestimmung der Entfernung zwischen Objekten oder die Bestimmung emotionaler Reaktionen. Ihr faules Gehirn denkt im Allgemeinen standardmäßig nach System 1.

System 2: langsam, anstrengend, logisch, berechnend, bewusst, selten.

Das System-2-Denken ist analytisch und wird auf komplexere Szenarien angewendet, wie z. B. die Bestimmung angemessenen sozialen Verhaltens oder den Vergleich zweier Produkte mit unterschiedlichen Preisen und Eigenschaften.

Da das Gehirn nicht jedes Mal, wenn es mit einem neuen Szenario konfrontiert wird, Informationen neu verarbeiten oder neue Entscheidungen treffen möchte, fällt ein Großteil der menschlichen Entscheidungsfindung in System 1 oder „schnelles Denken“.

Wenn es schnell Entscheidungen trifft, kann sich das Gehirn zu sehr auf Schemata oder mentale Modelle verlassen – vertraute Informations- und Interaktionsmuster. Wenn das Denken von System 1 aktiviert ist, tritt System 2 niemals in Kraft. Menschen sind sich der Entscheidungskurzschrift ihres Gehirns vielleicht nicht bewusst, aber sie beeinflusst stark ihr Verhalten und ihre Wahrnehmung des Produkts.

Die Wissenschaft der Psychologie im Design

Das menschliche Gehirn verbraucht satte 25 % des Sauerstoffs des Körpers, obwohl es nur etwa 2 % seiner Masse ausmacht. Das Gehirn ist als Überlebensmechanismus faul – Mustererkennung und Abkürzungen bedeuten weniger Energieaufwand für die bewusste Verarbeitung der Situation . Das Gehirn identifiziert Dinge, etikettiert sie und ignoriert sie, bis sie wieder relevant sind.

Die Vorliebe des Gehirns für Muster und faule Entscheidungen mag das Überleben erleichtern, erschwert aber das UX-Design. Wie untersucht man etwas, das Ihr Forschungsobjekt nicht einmal wahrnehmen kann?

Eine Handvoll neurowissenschaftlicher Techniken hat kürzlich den Sprung in die UX-Forschung geschafft und hilft Forschern, Licht auf die Dinge zu werfen, die „schnelles Denken“ anregen.

Aufmerksamkeit und Wahrnehmung können mit Eye-Tracking-Kameras untersucht werden. Emotionale Reaktion und Erregung können mit Hautsensoren oder Gesichtsanalyse bestimmt werden. Die elektrische Reaktion im Gehirn kann mit Elektroenzephalographie gemessen werden.

Für Designer mag es wie eine unmögliche Aufgabe klingen, das Interesse von jemandem zu wecken und wichtige Informationen in weniger als einem Wimpernschlag zu vermitteln. Glücklicherweise kann uns die Neurowissenschaft nicht nur helfen, Probleme zu diagnostizieren, sondern auch allgemeine Lösungen und Best Practices aufzeigen.

Hier sind einige allgemeine Lehren aus der neurowissenschaftlichen Forschung zur Benutzererfahrung, die Designer beim Entwerfen digitaler Produkte anwenden können.

Design-Psychologie-Tipp Nr. 1: Machen Sie es einfach, es zu identifizieren

Jeder kommt auf eine Website oder eine App mit einer gewissen Erwartung, wie sie aussehen soll. Sich an diese Erwartung zu halten, hilft Designern, von der sofortigen unbewussten Entscheidungsfindung zu profitieren.

Die Person, die Ihre App oder Website öffnet, möchte wissen, a) ob diese das hat, wonach ich suche; und b) ist das von hoher Qualität? Designs einfach zu halten und Marke, Dienstleistungen und Produkte im Vordergrund zu halten, hilft den Menschen, sich zu orientieren.

Einige Informationen in den Vordergrund zu stellen bedeutet, andere Informationen davon abzuhalten, sie zu verdrängen. Das Aufräumen eines Designs ist genauso wichtig wie das Neuanordnen von Komponenten.

Sie werden eine Bewegung in Technologieunternehmen hin zu einfacheren, weniger überfüllten Schnittstellen bemerken. Diese minimalistischen Designs übertreffen komplexere Designs bei der Erledigung von Aufgaben, und die visuelle Klarheit wirkt sich nachweislich auf Kaufentscheidungen online und offline aus.

Es ist wissenschaftlich erwiesen, dass visuell einfache und saubere Designs besser funktionieren. Das faule Gehirn kann den Zweck der Website sofort erfassen und versteht, welche Maßnahmen zu ergreifen sind.

Design-Psychologie-Tipp Nr. 2: Zeigen Sie, was kommt

Das Vorbereiten oder Vorbereiten von jemandem auf bevorstehende Informationen oder Interaktionen kann die Fähigkeit des Benutzers verbessern, neue Informationen zu verstehen und darauf zu reagieren. Sie können jemanden darauf vorbereiten, Dinge wie Elemente der Benutzeroberfläche, bestimmte Interaktionen oder das Timing in einem Prozess zu erwarten.

Beispielsweise verwendet Yelp einen zusätzlichen Bildschirm, um Benutzer darauf hinzuweisen, dass sie Yelp verlassen, um eine Website eines Drittanbieters zu besuchen. Der zusätzliche Kontext hilft dem Benutzer zu signalisieren, dass er ein neues Design und eine neue Informationsarchitektur erwartet.

Priming ist ein zweischneidiges Schwert. Informationen, die Sie nicht mitteilen möchten, können sich dennoch auf die Entscheidungsfindung auswirken . Wenn Ihr Fotounternehmen beispielsweise nur Bilder von Babys anbietet, könnte eine Person fälschlicherweise annehmen, dass Sie nur Kleinkinder bedienen.

Design-Psychologie-Tipp Nr. 3: Organisieren Sie für faule Leser

Eye-Tracking-Studien sind in der Lage, den Blick einer Person zu verfolgen, während sie mit einem Produkt interagiert. Sie können Heatmaps erstellen, die zeigen, wie viel Zeit konzentriert auf einen Teil des Bildschirms verbracht wurde, oder Karten, die zeigen, wie das Auge über die Seite springt.

Wir wissen, dass das Gehirn in allen Branchen und App-Typen üblicherweise nach Informationen in einem F-Muster (oder E-Muster) sucht. Die Person sieht sich die Informationen oben an, liest nach rechts und scannt dann die Seite nach relevanten Informationen oder Symbolen.

Das Durchbrechen des F-Musters – zum Beispiel das Einfügen wichtiger Informationen in die untere rechte Ecke – erschwert das Auffinden.

Zähmen Sie Ihren Text

Laut einer Studie von Nielsen Norman mit 45.237 Seitenaufrufen lesen Menschen nur etwa 20 % des Textes auf einer Seite. Schlimmer noch, auf Websites mit mehr Inhalt widmeten die Leute nur etwa 4 zusätzliche Sekunden für jeweils 100 zusätzliche Wörter Text.

In einer Welt, in der Menschen nicht Wort für Wort lesen, verwendet Nielsen Norman die folgenden Richtlinien für scannbaren Text .

• Hervorgehobene Schlüsselwörter
• Aussagekräftige Unterüberschriften
• Listen mit Aufzählungszeichen
• Eine Idee pro Absatz
• Der Stil der umgekehrten Pyramide – beginnen Sie mit der Schlussfolgerung
• Halb so viele Wörter (oder weniger) wie herkömmliches Schreiben

Arbeiten Sie mit Color Pop und Contrast

Die Textorganisation und -position sind nicht die einzigen wichtigen Faktoren bei der Gestaltung. Farbtheorie, Gewichtungen und Kontrast können verwendet werden, um die Aufmerksamkeit des Benutzers zu lenken.

Das Cockpit-Designteam der NASA verwendet die Luminanz – oder die wahrgenommene Helligkeit eines Designs – um die Aufmerksamkeit des Piloten in einem Bereich zu lenken, der mit konkurrierenden Informationen überfüllt ist. Das Designteam des Cockpits verwendet Farbe und Kontrast, um die wichtigsten Elemente optisch hervorzuheben.

Luminanz und Kontrast können in Ihrem gesamten Produkt verwendet werden, um bestimmte Informationen hervorzuheben oder herunterzuspielen, aber am häufigsten wird darauf im Button- oder Call-to-Action-Design verwiesen. Wie Sie in den roten Beispielschaltflächen unten sehen können, „fühlt“ sich die Schaltfläche in der oberen linken Ecke, obwohl sie am stärksten gesättigt ist, am hellsten an, da der Kontrast am höchsten ist.

Kontrast und Leuchtdichte sind nur ein erster Schritt. Die Farbtheorie schlägt vor, die Farben Ihres Produkts auszugleichen, indem Sie 60 % der Zeit die dominante Farbe, 30 % die Sekundärfarbe und 10 % die Akzentfarbe verwenden. Diese Aufschlüsselung steht im Einklang mit der Neurowissenschaft hinter dem, was die Aufmerksamkeit auf sich zieht. Da die Akzentfarbe am wenigsten verwendet wird, zieht sie die meisten Blicke auf sich.

So wie die Verwendung heller Farben das Auge auf sich ziehen kann, kann die Verwendung gedämpfterer Farben einem Benutzer helfen, festzustellen, welche Informationen zweitrangig oder weniger wichtig sind. Beispielsweise verwenden die meisten Websites Fußzeilenbereiche mit einer neutraleren Farbe, um eine Trennung von den restlichen Informationen auf der Seite anzuzeigen.

Alle Funktionen oder Informationsdesigner, die die Priorität herabsetzen, helfen dem Benutzer, sich direkt auf die wichtigsten Interaktionen oder Informationen zu konzentrieren.

Design-Psychologie-Tipp Nr. 4: Bauchcheck

Glücklicherweise brauchen Sie keine Tausende von Dollar an Eye-Tracking-Software oder ein Elektroenzephalogramm, um festzustellen, ob ein Design funktioniert.

5-Sekunden-Tests sind ein leistungsstarkes Tool, um festzustellen, ob Ihre Designs sofort verständlich sind oder nicht.

In einem 5-Sekunden-Test sieht sich der Teilnehmer 5 Sekunden lang eine Website oder App an und beantwortet dann Fragen zu Thema und Design. Ohne auf das Bild zurückgreifen zu können, geben die Teilnehmer ihre „Eindrücke“ wieder – was die Teilnehmer als Zweck und Funktion des Produkts annahmen und was sie tun würden oder wo sie nach nächsten Schritten suchen würden.

Ihr Produkt hat möglicherweise alle Funktionen, die Ihr Benutzer wünscht, aber wenn das faule, musterliebende Gehirn das nicht sofort begreifen kann, wird es weitermachen .

Designer als „Gedankenleser“

Während wir mehr über Designpsychologie, das Gehirn und Wahrnehmung lernen, werden sich die Designnormen in der gesamten Branche weiter ändern. Der rote Faden sind Daten – mit der Verbesserung der Methoden für das Studium der Neurowissenschaften und der Kognition werden auch die Art und Qualität der für das UX-Design verfügbaren Daten verbessert.

Großartiges User Experience Design ist keine Zauberei – es ist Wissenschaft. Neurowissenschaft.

Dieser Artikel wurde in Zusammenarbeit mit der UX-Forscherin Caitria O'Neill , zuvor bei Facebook, derzeit bei Airbnb, und einer Kollegin an der d.school in Stanford, verfasst .

• • •

Weiterführende Literatur im Toptal Design Blog:

• eCommerce UX – Best Practices im Überblick (mit Infografik)
• Die Bedeutung von Human-Centered Design im Produktdesign
• Die besten UX-Designer-Portfolios – inspirierende Fallstudien und Beispiele
• Heuristische Prinzipien für mobile Schnittstellen
• Antizipatorisches Design: Wie man magische Benutzererlebnisse schafft