Eye Tracking im UX Research: Was Blickverläufe für dein Design zeigen

Du hast den Einstieg erklärt, einen gut sichtbaren Button gesetzt und daneben die wichtigsten Vorteile beschrieben. Im Nutzertest wird spannend, wie jemand diese Elemente miteinander verbindet: Wandert der Blick von der Überschrift zur Erklärung und anschließend zur passenden Aktion? Mit Eye Tracking kannst du diesen Weg verfolgen und dadurch neben den Klicks auch betrachten, was ihnen vorausgeht.

Das Video aus dem Projekt medienkundig zeigt eine solche Blickaufzeichnung auf einer Website und in der zugehörigen Lernanwendung. Daran lässt sich gut erklären, wie du die Methode für UX Research nutzt und aus einer Aufnahme konkrete Fragen an dein Design ableitest. Der Gewinn liegt in einer besseren Grundlage für Entscheidungen über Leseführung, Erklärung und Interaktion.

Wie Eye Tracking den Blick auf einer Oberfläche erfasst

Bei bildschirmbasiertem Eye Tracking schätzt ein Sensor, wohin eine Person gerade schaut. Verbreitete Systeme nutzen dafür unsichtbares Infrarotlicht und Kameras, um die Positionen von Pupillen und Lichtreflexen zu erfassen und daraus die Blickposition auf dem Bildschirm zu berechnen. Damit diese Zuordnung zur Person und ihrer Sitzposition passt, folgt sie vor der Untersuchung einigen Kalibrierungspunkten. Tobii erklärt das Verfahren anhand der eingesetzten Sensortechnik.

Für die Auswertung werden die Blickpositionen mit der Oberfläche verbunden: Kurze Aufenthalte des Blicks heißen Fixationen, die schnellen Bewegungen dazwischen Sakkaden. Wie diese Abfolge dargestellt wird, hängt davon ab, was du untersuchen möchtest. Während ein Gaze Replay den zeitlichen Verlauf direkt über der Aufnahme zeigt, fasst ein Gaze Plot ihn als Punkte und Verbindungen zusammen; eine Heatmap bündelt dagegen die Blickverteilung für einen ausgewählten Zeitraum oder mehrere vergleichbare Durchläufe.

Für die Gestaltung ist vor allem interessant, welche Inhalte vor einer Entscheidung betrachtet werden und in welcher Reihenfolge das geschieht. Wenn eine Klickauswertung beispielsweise zeigt, dass jemand einen Lernpfad öffnet, ergänzt der Blickverlauf, ob der Blick vorher auf dessen Beschreibung liegt oder zwischen mehreren Angeboten wechselt.

Was du im medienkundig-Video sehen kannst

Im ersten eingebundenen Ausschnitt von medienkundig wandert die Markierung auf der Startseite zwischen dem einführenden Text und den Aktionen darunter. Der zweite Ausschnitt führt in die Lernanwendung, wo links die Lernpfade stehen und rechts eine Erklärung zur ausgewählten Einheit erscheint, bevor der Weg in eine Aufgabe mit mehreren Antwortmöglichkeiten weitergeht.

Gerade der Wechsel zwischen Übersicht und Detail ist aufschlussreich. Du kannst verfolgen, wann die Markierung im Bereich der Lernpfade liegt und wann sie zur seitlichen Erklärung wandert. Damit wird aus dem allgemeinen Eindruck einer Seite ein beobachtbarer Ablauf, den ein Team gemeinsam anschauen und besprechen kann.

An dieser früheren Interface-Fassung lassen sich die Blickbewegungen an einer konkreten Oberfläche nachvollziehen und einzelne Momente für die gemeinsame Besprechung anhalten: Welche Information steht an dieser Stelle bereit, welche Aktion folgt darauf und wie passen beide zusammen? Indem wir den Ausschnitt mit diesen Fragen betrachten, bleibt der Bezug zwischen Gestaltung und Handlung erhalten.

Eine gute Forschungsfrage macht den Blickverlauf nützlich

Wenn du eine Kursseite untersuchst, bringt dich die Frage nach der nächsten Entscheidung weiter als eine allgemeine Bewertung des Designs. Bei einer Seite wie der von Hundeschule Hopen wäre zum Beispiel interessant, wie jemand einen passenden Kurs für einen jungen Hund auswählt. Dazu gehören die Beschreibung des Trainings, Voraussetzungen und der Weg zur Buchung. Die Person bekommt eine alltagsnahe Aufgabe und kann selbst entscheiden, wie sie vorgeht.

Aus dieser Aufgabe ergeben sich die Stellen, die du betrachten möchtest. Bei Hopen wären das etwa die Angaben zur Eignung und der Übergang zum Buchungsportal; in einer Lernanwendung die Auswahl einer Einheit und der Einstieg in die erste Übung. Diese Beispiele zeigen zwei sinnvolle Einsatzfelder der Methode. Bei medienkundig kannst du einen Ausschnitt davon im Video verfolgen.

Wie wichtig die Aufgabenformulierung dafür ist, zeigt ein einfacher Vergleich: Während „Finde den blauen Button“ den Blick bereits auf ein Gestaltungselement lenkt, lässt „Du möchtest herausfinden, womit du beginnen kannst“ Raum für den tatsächlichen Suchweg. Die Forschung von Nielsen Norman Group zu Aufgaben und Blickverhalten zeigt, wie stark das jeweilige Ziel beeinflusst, welche Informationen Menschen betrachten.

Blickbewegungen mit Verhalten und Erklärungen verbinden

Für die Auswertung schauen wir zusammen auf Blickverlauf, sichtbare Handlung und die Erklärung der Person. Wenn der Blick mehrfach zwischen einer Überschrift und einem Button wechselt, ist eine hilfreiche Anschlussfrage, was die Person dort erwartet hat. Daraus lässt sich ableiten, ob eine präzisere Beschriftung, eine näher platzierte Erklärung oder eine klarere Gruppierung die Entscheidung unterstützt.

Wenn du solche Stellen nach der Aufgabe gemeinsam anhand der Aufnahme besprichst, hat die Person einen konkreten Moment vor Augen und kann beschreiben, wonach sie gesucht hat. Auf dieser Verbindung beruht auch Retrospective Think Aloud, bei dem die Aufzeichnung als Gesprächsanlass dient, um die eigene Vorgehensweise nachzuvollziehen. Eine Studie von Cho und Kollegen beschreibt diese Kombination für die Untersuchung einer Gesundheitsanwendung.

So erhält auch ein längerer Blick auf einen Text seinen Zusammenhang: Vielleicht vergleicht die Person dort sorgfältig mehrere Angaben oder sucht nach einer bestimmten Information. Ihre anschließende Erklärung hilft dem Team, die Beobachtung zu verstehen und daraus eine passende Änderung am Design abzuleiten.

Daraus entstehen konkrete Verbesserungen an der Nutzerführung

Aus der Auswertung sollte hervorgehen, welche Stelle du verändern möchtest und welchen Weg die Gestaltung erleichtern soll. Wenn jemand beispielsweise beim Vergleich mehrerer Lernangebote immer wieder deren Detailansicht öffnet, um die Dauer zu finden, kann eine Zeitangabe direkt in der Übersicht die Auswahl unterstützen. Die Gestaltung beantwortet damit die Frage an der Stelle, an der sie für die Entscheidung gebraucht wird.

Bei medienkundig hilft diese Perspektive auch beim Umgang mit Begriffen aus dem digitalen Alltag, die selbst zum Lerngegenstand gehören. Ihre Erklärung sollte deshalb von der aktuellen Aufgabe aus erreichbar sein und anschließend an dieselbe Stelle zurückführen, damit Menschen den neuen Hinweis bei ihrer Entscheidung nutzen können. Wie Inhalt und Interaktion dabei zusammenarbeiten, beschreiben wir im Artikel zu Fachbegriffen im Interface.

Für ein Team wird die Entscheidung greifbar, wenn die Beobachtung, der zugehörige Ausschnitt und die geplante Änderung zusammen vorliegen. Design und Entwicklung können dann nachvollziehen, warum ein Hinweis näher an eine Auswahl rückt oder eine Überschrift den Inhalt genauer benennt. In einem weiteren Durchlauf lässt sich beobachten, wie Menschen den überarbeiteten Weg nutzen.

Wann sich Eye Tracking für dein Projekt lohnt

Besonders interessant ist Eye Tracking, wenn du die visuelle Orientierung genauer verstehen möchtest: bei umfangreichen Produktinformationen, vergleichbaren Angeboten oder einem wichtigen Einstieg in eine Anwendung. Die Methode hilft, Aufmerksamkeit im Ablauf zu besprechen und die Oberfläche auf die aktuelle Aufgabe auszurichten. Für Stakeholder macht ein kurzer, gut eingeordneter Ausschnitt zudem verständlich, worauf eine Designentscheidung beruht.

Der Ausgangspunkt für dein Projekt ist die Frage, die du beantworten möchtest. In einem Nutzertest untersuchen wir, wie Menschen einen relevanten Weg verwenden. Wenn die Blickführung dabei die entscheidende Forschungsfrage ist, stimmen wir den Einsatz von Eye Tracking und die dafür passende Ausstattung gemeinsam ab. Aus den Beobachtungen entwickeln wir konkrete Änderungen an Inhalt, Anordnung und Interaktion, die wir anschließend im Nutzungsweg und Prototyp zusammenführen.