0| Kurs-Einstieg

Als Einführung in das Thema wurde zunächst theoretisches Fachwissen im Bereich der Anatomie und der historischen Entwicklung von Eye Tracking Geräten vermittelt. Zudem wurden Forschungspaper in Zweierteams präsentiert, die verschiedene Forschungsfragen und Anwendungsbeispiele aufzeigten. Dadurch lernten wir grundlegende Begrifflichkeiten, Methoden bzw. Verfahren und Geräte kennen und konnten auf Basis dessen eine Entscheidung für die eigene Themenfindung treffen.

1| Introduction

Thema:

Für unser Projekt entschieden wir uns für die Lernplattform Skillshare, über die diverse Online-Kurse und Tutorials in verschiedenen Bereichen angeboten werden.

Forschungsfrage: 

»Wie beeinflussen Menü- und Filter-Optionen einer Webseite die Benutzerfreundlichkeit und Zielerreichung von Nutzer`*innen?«

Hypothesen: 

1/ Nutzer*innen finden die gesuchten Informationen schneller, wenn die Menü-Elemente klar strukturiert und intuitiv gestaltet sind.

2/ Die Zufriedenheit der Nutzer*innen ist höher bei einer Webseite mit optimierten Menü-Elementen im Vergleich zu einer Webseite mit weniger optimierten Menü-Elementen.

3/ Nutzer*innen erreichen ihr Ziel häufiger erfolgreich, wenn es benutzerfreundliche und leicht zugängliche Filter-Optionen gibt.

Ziel der Studie: 

»Das Ziel dieser Studie ist es, durch die Analyse der Benutzerinteraktionen mit den Menü- und Filter-Optionen auf der Skillshare-Website und mit den Figma-Prototypen Empfehlungen für ein Redesign zu entwickeln, das die Benutzerfreundlichkeit erhöht und die Zielerreichung der Nutzer*innen verbessert.«

2| Methods

Vorbereitung: 

Um die Interaktion mit Filter- und Menüoptionen auf der Plattform bewerten zu können, analysierten wir zunächst den strukturellen Aufbau der Live-Webseite, um Problembereiche und Verbesserungspotentiale identifizieren zu können.

Auf Basis der Erkenntnisse bauten wir mehrere Figma-Prototypen, die die für uns relevanten Bereiche mit Fokus auf Menü- und Filteroptionen der Live-Webseite möglichst 1:1 abbildeten.

Studienaufbau: 

Experimentelle Studie: Die Studie wurde unter kontrollierten Bedingungen im Eyetracking-Labor durchgeführt.

Datenerhebung: Eyetracking-Studie, Fragebogen, Interview

Teilnehmer*innen: 7 (6 verwertete Datensätze)

Tool: Tobii Pro Fusion 120 Hz (Remote Testing im Eyetracking-Labor)

Auswertung: Tobii Software

Stimuli: 3 Aufgaben

Methode: A/B Testing

Aufgabenstellung:

Anlegen des Projektes im Tobii-Tool

Für den nächsten Abschnitt ist vorab anzumerken, dass wir uns dazu entschlossen haben, nur Aufgabe 1 auszuwerten. 

Grund hierfür war die Erkenntnis, dass wir mit den drei Aufgaben in zwei unterschiedlichen Ausgabeformaten und sieben Teilnehmer*innen einfach viel zu viele Daten gesammelt hatten. Hinzu kam, dass wir alle Aufgaben und Teilnehmer*innen in einem Projekt angelegt hatten, wodurch  im Tool ein totales Datenchaos entstand, ohne dass wir die Recordings und Screenshots noch zuordnen konnten.

3| Results

Startseite

Für uns spannend zu sehen ist zunächst wie die Startseite betrachtet wird und ob bzw. wie schnell die Proband*innen das Menü finden und nutzen. Auf der Live-Webseite haben sie zwar eine Suchleiste, diese dürfen sie allerdings nicht benutzen.

Live-Webseite (Gruppe B)

Hauptaugenmerke: Die Heatmap zeigt, dass die Proband*innen hauptsächlich auf die oberen Bereiche der Seite fokussiert waren, insbesondere auf der Navigationsleiste.

Sekundäre Bereiche: Der zentrale Content-Bereich mit empfohlenen Kursen erhielt viel Aufmerksamkeit. In den unteren Bereichen der Seite nahm die Blickfrequenz deutlich ab und ist ab der dritten Contentzeile kaum mehr vorhanden.

Hotspots: Die auffälligsten Hotspots befinden sich beim Menüpunkt „Entdecke“ und beim Titel des empfohlenen Kurses.

Prototyp (Gruppe A)

Hauptaugenmerke: Die Heatmap zeigt eine ungleichmäßigere Verteilung der Blickpunkte. Es gibt auffällige Hotspots in der Menüleiste und am Ende der Seite bei den letzten beiden Kursen.

Sekundäre Bereiche: Der zentrale Content-Bereich erhielt ebenfalls viel Aufmerksamkeit, jedoch war die Verteilung der Blickpunkte gleichmäßiger als bei der Originalseite. Die Seite wurde bis zum Ende betrachtet, einschließlich Footer und Seitenränder.

Hotspots: Die auffälligsten Hotspots befinden sich in der Menüleiste, speziell beim Button „Kategorien“ (entspricht „Entdecke“ auf der Originalseite), sowie bei den letzten beiden Kursen der Seite.

Interpretation der Ergebnisse

Die Heatmap-Auswertung zeigt, dass die Proband*innen auf der Originalseite von Skillshare hauptsächlich den oberen Bereich der Seite betrachteten, was darauf hindeutet, dass sie ziemlich schnell wussten was sie zu tun haben, und umso schneller das Menü gefunden haben. Dies bestätigt auch nochmal das Vergleichen der Zeit.

Die Heatmap des Prototypen unterscheidet sich wirklich stark von der der Originalseite, daher haben wir die Heatmaps nochmal einzeln von einander betrachtet. Eine Testperson zeigt ein ähnliches Blickmuster wie die drei Proband*innen der Originalseite. Bei den anderen beiden lässt sich auf jeden Fall ein ähnliches Blickmuster beobachten, was die Betrachtung der gesamten Seite angeht. Beide Proband*innen untersuchen die gesamte Seite und fokussieren sich nicht direkt auf die Menüleiste, so wie es die anderen tun.

Der Grund warum die Proband*innen, welche den Prototyp hatten, zunächst die ganze Seite untersucht haben, und die Menüleiste erst zu einem wesentlich späteren Zeitpunkt wahrgenommen haben, erschließt sich nicht ganz. Beide Gruppen hatten vor der Aufgabe eine Minute Zeit, sich mit der Live-Webseite vertraut zu machen und das Menü anzuschauen und es auch zu nutzen. Die Position der Kategorieauswahl verändert sich auch nicht zwischen Original und Prototyp. Lediglich die Beschreibung ist anders. Das es aber an den unterschiedlichen Bezeichnung liegt ist aber auszuschließen. Im Original ist es »Entdecke« im Prototyp »Kategorien«. Wenn die Probanden erst einmal in der Menüleiste waren, haben sie dann auch ziemlich schnell das Menü ausgeklappt. Der Zeitunterschied lag im generellen Wahrnehmen der Menüleiste.

Eine Vermutung woran diese späte Wahrnehmung liegen könnte, ist das Fehlen der Suchleiste im Prototyp. Dieses Element ist grundsätzlich ein Indikator für eine Menüleiste. Die Suchleiste wurde zwar auch auf der Live-Webseite wenig bis gar nicht wahrgenommen, trotzdem hilft dieses Element durch seine Aufforderung »Suche« den Nutzer bereits in die richtige Richtung zu lenken. Hinzu kommt das Problem, dass der Prototyp nicht wie eine normale Webseite im Browser, sondern wesentlich kleiner im Fenster angezeigt wurde. Dadurch entstand ein schwarzer Rand rund um das Fenster, was einige der Proband*innen abgelenkt hat.

4| Discussion

Ausblick: 

Auf Basis der Erkenntnisse aus der Eyetracking-Studie sind wir jetzt an einem Punkt, wo es sich lohnen würde, das Feedback der Probanden und die ersten Erkenntnisse zu nutzen, um einen neuen Versuchsaufbau zu entwickeln. Die Probleme, welche wir bei dieser Studie erkannt haben, würden wir dann natürlich vermeiden, indem wir unseren Aufbau abwandeln würden und dann mit einem überarbeiteten und besser ausgearbeiteten Prototypen erneut zu testen. Die Studie die wir jetzt durchgeführt haben, wäre dann als Pretest anzusehen. 

Die aus der neuen Studie gewonnenen Erkenntnisse würden wir dann für ein Redesign verwenden. Unser Ziel wäre es, eine gute Lösung für das aktuell noch wirklich schwierige Navigieren zum gewünschten Kurs zu finden. Wir würden grundsätzliche Veränderungen machen, die die Navigation und das Filtern betreffen (also das umsetzten, was wir durch die Tests herausgefunden haben) aber auch inhaltliche Abwandlungen und Anpassungen im Seitenlayout, da sich dies je nach Filter verändert und so wiederkehrende Elemente kontinuierlich woanders zu finden sind. Also einfach mehr Konstanz im Aufbau schaffen.

Kursfazit: 

Durch den Kurs haben wir defintiv einige neue Erkenntnisse gewinnen können. So war es super spannend einen Einblick in den doch sehr technischen Ablauf einer solchen Forschungsstudie erhalten zu können und den Prozess einmal zu durchlaufen. Auch das Arbeiten mit Figma-Prototypen, die von einer vorhandenen Webseite nur minimal abweichen sollten, war sehr spannend, wenn auch extrem zeitaufwendig. Umso enttäuschter waren wir, als wir merkten, dass unsere Prototypen im Tobii-Tool leider nicht identisch mit einem Browserfenster angezeigt wurden und somit klar war, dass unsere Studie leider nicht wirklich die nötige Vergleichbarkeit zwischen den Proband*innen bieten konnte. Großes Potential bietet der Kurs im Unikontext unserer Meinung nach va. für Marketing-, Bewegtbild- und Livewebseitenanalysen.