Screenrecording & Heatmaps

Screenrecording und Heatmaps zählen zu den wichtigsten visuellen Analysetools in der UX-Forschung. Sie liefern retrospektive, quantitative und kontextsensitive Daten zur tatsächlichen Nutzung digitaler Systeme – etwa von Websites, mobilen Apps oder interaktiven Webanwendungen. Beide Methoden helfen dabei, Nutzerverhalten sichtbar zu machen und dadurch fundierte Optimierungsentscheidungen zu treffen. Besonders im Live-Betrieb, also unter realen Bedingungen und mit echten Nutzer:innen, entfalten sie ihre Stärke.

Screenrecording: Blick durchs digitale Schlüsselloch

Beim Screenrecording wird die Interaktion von Nutzer:innen mit einem Interface aufgezeichnet – meist inklusive Mausbewegungen, Klicks, Scrolling und Tastatureingaben. Die Methode eignet sich ideal zur nachträglichen Analyse realer Nutzungssitzungen, etwa zur Identifikation von Friktionen, häufigen Navigationsfehlern oder wiederholtem Zögern.

Ein Beispiel: Ein Team beobachtet, dass viele Nutzer:innen auf einer Anmeldeseite mehrfach zwischen Passwortfeld und Hilfelink wechseln. Die Videoanalyse zeigt: Der Hinweis zur Passwortanforderung ist zwar vorhanden, aber visuell unauffällig platziert. Diese Erkenntnis führt zu einer gestalterischen Anpassung – der Hinweis wird direkt neben dem Eingabefeld angezeigt.

Screenrecordings sind besonders hilfreich, wenn es darum geht, konkrete Schwachstellen in User Flows zu erkennen, z. B. in mehrstufigen Prozessen wie Checkout-Strecken oder Registrierungsformularen. Auch gerätespezifische Unterschiede – etwa zwischen Desktop- und Mobile-Nutzung – lassen sich vergleichend auswerten.

Tools: Hotjar, Microsoft Clarity (kostenlos), Smartlook, FullStory, Mouseflow
Hinweis: Bei sensiblen Inhalten sind DSGVO-konforme Lösungen wie Piwik PRO oder On-Premise-Server wichtig.

Heatmaps: Wo geklickt, bewegt und gescrollt wird

Heatmaps visualisieren aggregiertes Nutzerverhalten auf einer Seite – typischerweise farbcodiert: Rot steht für häufige Aktionen (Hotspots), Blau für seltene (Cold Spots). Es gibt unterschiedliche Arten von Heatmaps:

• Click-Heatmaps zeigen, wo Nutzer:innen klicken – auch auf nicht-interaktive Elemente.
• Move-Heatmaps visualisieren Mausbewegungen und geben Hinweise auf visuelle Aufmerksamkeit.
• Scroll-Heatmaps machen sichtbar, bis wohin Nutzer:innen tatsächlich scrollen.
• Attention Maps kombinieren Blickverlauf und Aktivität, meist via Eye Tracking.

Ein praktisches Beispiel: Eine Scroll-Heatmap zeigt, dass nur 30 % der Besucher:innen den unteren Bereich einer Landingpage sehen – obwohl dort ein zentraler Call-to-Action („Jetzt Kontakt aufnehmen“) platziert ist. Die Schlussfolgerung: Die Botschaft wird nach oben verlagert, die Conversion Rate steigt um 18 %.

Heatmaps sind besonders nützlich bei Fragen wie: „Werden wichtige Inhalte überhaupt wahrgenommen?“ oder „Sind Navigationselemente am richtigen Ort platziert?“ Sie eignen sich auch hervorragend für den Vorher-Nachher-Vergleich bei Redesigns oder A/B-Tests.

Grenzen und Einordnung

Beide Methoden liefern was passiert, aber nicht warum es passiert. Sie zeigen keine Motive, Emotionen oder mentale Modelle der Nutzer:innen. Ein Click auf einen Button kann Unsicherheit, Neugier oder bloßes Ausprobieren bedeuten – ohne ergänzende qualitative Verfahren bleibt die Interpretation spekulativ.

Auch gilt: Heatmaps sind kontextspezifisch – sie müssen getrennt für unterschiedliche Seiten und Gerätetypen analysiert werden. Eine mobile Heatmap unterscheidet sich deutlich von ihrer Desktop-Version. Zudem sind datenschutzrechtliche Aspekte zwingend zu beachten: Nutzungsaufzeichnungen dürfen nur mit expliziter Einwilligung erfolgen.

Best Practices aus der Praxis

• Kombination mit KPIs: Heatmaps und Screenrecordings sollten zusammen mit Metriken wie Bounce Rate oder Conversion Rate betrachtet werden.
• Seiten- und gerätespezifisch auswerten: Nur so lassen sich valide Designentscheidungen treffen.
• Veränderungen dokumentieren: Ideal für Before-After-Vergleiche bei UI-Anpassungen.
• Triangulation nutzen: Ergänze visuelle Daten mit Interviews oder Thinking-Aloud-Tests für ein vollständigeres Bild.
• Systematisch taggen: In Tools wie FullStory oder Lookback lassen sich Auffälligkeiten markieren und kategorisieren.

Fazit

Screenrecordings und Heatmaps bieten UX-Teams einen unmittelbaren, visuellen Zugang zur realen Nutzungserfahrung. Sie zeigen, was Nutzer:innen tatsächlich tun – und wo sie Schwierigkeiten haben. Richtig eingesetzt, liefern sie belastbare Hinweise auf Optimierungspotenziale, die sich gut an Stakeholder kommunizieren lassen. Ihr größter Wert liegt in der Kombination: mit qualitativen Insights, mit quantitativen Metriken – und mit dem richtigen Gespür für Designentscheidungen.