Maus-Heatmaps: 8 Wege, Wie Sie Ihr Produkt Verbessern Können
Sehen Sie, was Nutzer wirklich tun – nicht nur, was sie sagen: Umfragen und Analysen erzählen nur einen Teil der Geschichte. Maus-Heatmaps zeigen, wo Nutzer zögern, Schwierigkeiten haben oder sich besonders engagieren – damit Sie fundierte, datengestützte Entscheidungen treffen können.
Priorisieren Sie Korrekturen und Funktionen, die wirklich zählen: Anstatt zu raten, woran als Nächstes gearbeitet werden soll, zeigen Heatmaps, wo Nutzer Zeit verbringen (oder frustriert sind), und geben eine klare Richtung, was zuerst angegangen werden muss.
Finden Sie heraus, warum Nutzer abspringen – und beheben Sie es: Nicht jeder Absprung ist gleich. Heatmaps zeigen, ob Nutzer wichtige CTAs übersehen, mit Formularfeldern kämpfen oder verwirrt sind – so können Sie Hindernisse entfernen, bevor sie abspringen.
Identifizieren Sie versteckte Reibungen in Ihrem Aktivierungstrichter: Klicken Nutzer dort, wo sie nicht sollten? Bleiben sie an wichtigen Schritten hängen? Heatmaps offenbaren Engstellen, damit Sie den Nutzerweg glätten und die Konversionen steigern können.
Wahrscheinlich ist der interessanteste und lohnendste Teil der Arbeit eines Product Managers, mehr darüber zu erfahren, wie die eigenen Nutzer denken und handeln, wenn sie das Produkt verwenden.
Hierfür führen wir in der Regel Nutzerinterviews durch, erstellen Umfragen und analysieren unsere Daten. Es gibt jedoch noch ein weiteres wertvolles Werkzeug im Repertoire eines PMs, das dabei hilft, sich besser in die Nutzer hineinzuversetzen – Maus-Heatmaps!
Heute möchte ich mit Ihnen die praktischen Anwendungsfälle von Maus-Heatmaps und effektive Einsatzmöglichkeiten zur Verbesserung Ihres Produkts durchgehen.
Du willst mehr vom The CPO Club?
Registriere dich für eine kostenlose Mitgliedschaft, um diesen Artikel vollständig zu lesen:
Have an account? Log In
Was sind Maus-Heatmaps und wie funktionieren sie?
Eine Maus-Heatmap (auch Aufmerksamkeits-Heatmap genannt) ist ein Produktanalyse-Tool, das visualisiert, wie Nutzer mit Ihrer Benutzeroberfläche über ihre Mausbewegungen interagieren. Sie erstellt eine visuelle Überlagerung – typischerweise mit Farbverläufen – auf einem Screenshot Ihrer Benutzeroberfläche, um zu zeigen, wo Nutzer am häufigsten mit der Maus schweben, sich bewegen oder klicken.
So können Sie erkennen, welche Elemente Aufmerksamkeit auf sich ziehen, wo Nutzer möglicherweise zögern oder was komplett ignoriert wird. Maus-Heatmaps sind besonders wertvoll, wenn sie zusammen mit anderen Arten von Heatmaps genutzt werden, wie z. B. Scroll-Heatmaps, die erfassen, wie weit Nutzer auf der Seite nach unten scrollen.
Kombiniert erhalten Sie mit diesen Tools ein umfassenderes Bild des Nutzerengagements – was Nutzer sehen, was sie überspringen und wohin ihre Aufmerksamkeit natürlich fließt.
Produktmanager und UX-Designer nutzen verschiedene Arten von Heatmaps, um Einblicke in das Verhalten ihrer Nutzer zu erhalten, darunter Scroll-Maps, Klick-Maps, Aufmerksamkeits-Heatmaps, Eye-Tracking-Heatmaps und viele weitere Heatmap-Beispiele. Jede Art kann Ihnen gezielte Erkenntnisse liefern, um die Nutzerbindung zu steigern und das Engagement zu fördern. Heute möchte ich jedoch insbesondere auf eine Art näher eingehen – die Maus-Heatmap.
Eine Maus-Heatmap ist das, was man als „aggregiert“ bezeichnen würde, da sie kombinierte Daten mehrerer verschiedener Nutzerinteraktionen enthält – Klickverhalten, Scrollverhalten und Mausbewegungen.
Maus-Heatmaps sind im Bereich der visuellen Produktanalyse relativ neu, da es eine große Herausforderung war, diese drei unterschiedlichen Verhaltensarten in einer einzigen Visualisierung zu bündeln – erst mit dem Aufkommen von KI-Modellen konnten Analyse-Tools dies ermöglichen.
Praxisnahe Anwendungsbeispiele: Ihr Produkt mit Mouse-Tracking optimieren
Nachdem wir nun grundsätzlich verstanden haben, was diese Heatmaps sind, schauen wir uns reale Anwendungsfälle an, bei denen Sie durch die Analyse Ihrer Maus-Heatmaps wertvolle Verbesserungen an Ihrem Produkt erzielen können.
Wie Produktmanager Maus-Heatmaps nutzen
Obwohl die Analyse von Nutzerinteraktionen vielleicht eher nach einer Aufgabe für UX-Designer klingt, können auch Produktmanager Maus-Heatmaps nutzen, um ihre eigenen Fragestellungen zu lösen. Hier sind einige Möglichkeiten, wie ich dieses Werkzeug zur Produktverbesserung eingesetzt habe.
#1: Engpässe im Aktivierungstrichter finden
Aus meiner Erfahrung mit Aktivierungsherausforderungen ist die Optimierung des Trichters eine der komplexesten, aber auch wirkungsvollsten Aufgaben eines Product Managers. Schon eine moderate Steigerung der Aktivierungsrate um 10% kann einen Kaskadeneffekt im Trichter auslösen und die Free-→Paid-Konvertierung signifikant erhöhen.
Doch Aktivierung ist nicht bloß eine Frage der Zahlen – es ist ein Puzzle, das tiefe Einblicke ins Verhalten, iteratives Experimentieren und die Bereitschaft verlangt, Annahmen über das Nutzerverhalten in Frage zu stellen. Der Schlüssel ist nicht nur, mehr Nutzer durch den Trichter zu bewegen, sondern wirklich zu verstehen, warum sie überhaupt abspringen.
Um dies herauszufinden, nutzt ein Product Manager praktisch alle Werkzeuge im Repertoire, inklusive Analysen, Umfragen usw. Auch Maus-Maps gehören dazu. Hier ist eine Möglichkeit, wie diese zur Steigerung der Aktivierungsrate beitragen können.
Stellen Sie sich vor, Sie arbeiten bei Atlassian und haben sich das Quartalsziel gesetzt, die Einrichtungsrate von Jira Cloud zu verbessern.
Betrachten Sie mithilfe Ihres Analyse-Tools den Aktivierungstrichter und sehen, dass es einen deutlichen Nutzungsabfall gibt, wenn Nutzer den Namen ihrer Jira-Instanz eingeben und ihre Atlassian-Website erstellen sollen.
Um herauszufinden, was passiert ist, könnten Sie Ihr Heatmap-Tool öffnen und die Maus-Heatmap betrachten. Sie sehen, dass Nutzer viel Zeit auf der Seite verbringen, aktiv auf das Feld für den Site-Namen und das Feld „Get Started In Jira“ klicken.
Dies ist kein normales Verhalten, denn Sie möchten, dass die Nutzer jedes Feld nur einmal anklicken und nicht mehr als 10–15 Sekunden auf dieser Seite verbringen. Sie starten eine Untersuchung und bitten Ihr QS-Team (Qualitätssicherung) zu prüfen, was vor sich geht.
Ihr Team stellt fest, dass für eine bestimmte Nutzergruppe der Validator für den Seitennamen (der prüft, ob der Name bereits existiert) immer einen Fehler ausgibt, egal was eingegeben wird.
Der Grund dafür ist, dass ein unsichtbares Google Recaptcha diese Nutzer für Bots hält. Zur Lösung sprechen Sie mit Ihrem Security-Team, stellen fest, dass der Sicherheitsschwellenwert für Recaptcha zu hoch ist, und senken ihn herab.
Dadurch schalten Sie die Nutzer frei, ermöglichen ihnen die Seitenerstellung und verbessern die Aktivierungsrate signifikant.
#2: Unterstützung bei der Feature-Priorisierung
Bei der Priorisierung neuer Funktionen ist der wohl wichtigste Faktor der Einfluss dieser Funktion auf Ihre Nutzer. Sie messen diesen Einfluss anhand von Daten, Ihrem Wissen über die Nutzerbedürfnisse (aus Umfragen und Interviews), Ihrem Bauchgefühl und dem Verhalten der Nutzer in Ihrem Interface.
Letzteres ist der Punkt, an dem Mauskarten (Mouse Heatmaps) hilfreich werden.
Zurück zu unserem Jira-Beispiel. Angenommen, Sie möchten die Organisation des Backlogs verbessern und haben dafür über 20 Funktionsideen. Um diese anhand der Nutzerbedürfnisse zu priorisieren, betrachten Sie die Heatmap der Backlog-Seite. Bei der Analyse sehen Sie, dass im Bereich der Schnellfilter besonders viel Aktivität stattfindet.
Sie greifen also auf Ihr Analysetool zurück und erstellen eine Verteilungsgrafik der am häufigsten von Ihren Nutzern verwendeten Schnellfilter. Aus diesen Daten geht hervor, dass etwa 50 % aller Jira-Nutzer einen Schnellfilter einrichten, der Aufgaben mit dem Status „To Do“ anzeigt.
Eine großartige Möglichkeit, das Nutzererlebnis zu verbessern, wäre in diesem Fall das Hinzufügen eines speziellen Button-Filters für Aufgabenstatus. Angenommen, diese Funktionsidee steht bereits auf Ihrer Verbesserungsliste – dank dieser Erkenntnis bekommt sie jetzt eine höhere Priorität und wandert an die Spitze des Team-Backlogs.
#3: Conversion-Rate-Optimierung
Der Aufwand für die Optimierung der Conversion Rate (CR) kann sich problemlos mit Aktivierungsfunnels messen. Ich habe Monate damit verbracht, CR und verwandte Kennzahlen für meine Produkte zu analysieren, Features zur Verbesserung zu entwickeln, festgestellt, dass sie nicht funktionieren, dann etwas anderes hinzugefügt und diesen Zyklus wiederholt, bis ich ein Feature gebaut hatte, das die Conversion Rate tatsächlich steigerte.
Wie bei der Aktivierung sind auch hier Maus-Heatmaps ein effektives Instrument, um Konversionsherausforderungen bei Ihren Produkten zu analysieren.
In den meisten Fällen besteht der Hauptnutzen dieses Tools darin, herauszufinden, wann Nutzer auf die falschen Handlungsaufforderungen (CTAs) klicken und die konversionsfördernden ignorieren. Ich zeige das am Beispiel einer Produktseite eines Händlers für Gastronomiebedarf.
Angenommen, wir analysieren die Website-Heatmap dieser Seite. Sehr wahrscheinlich werden wir sehen, dass einige Nutzer auf den „Chat Now“-Button oberhalb der Haupt-CTAs (Produkt anzeigen) klicken. Ich verstehe, dass das Unternehmen den Button platziert hat, um Nutzer davon zu überzeugen, dass die Produkte am günstigsten am Markt sind.
Das Problem ist jedoch, dass der Klick auf „Chat Now“ die Kaufentscheidung der Nutzer unterbricht – und somit die Conversion Rate deutlich senkt.
Mein Vorschlag wäre daher, diese Nachricht und den CTA in einen weniger prominenten Bereich der Seite zu verschieben, um den Nutzerfluss nicht zu unterbrechen.
#5: A/B-Testing zur Feature-Validierung
Eine weitere wertvolle Anwendung von Maus-Heatmaps ist die Feature-Validierung per A/B-Testing. Hier dienen Heatmaps als wertvolle Datenquelle, indem sie Ihnen visuell verdeutlichen, wie sich Nutzerinteraktionen bei aktivierter oder deaktivierter Funktion verändern.
Sie führen also einen A/B-Test mit Feature-Variante A (an) und Variante B (aus) durch. Sie stellen sicher, dass das Heatmapping-Tool die Nutzerinteraktionen auf beiden Varianten erfasst, um einen direkten Vergleich der Maus-Heatmaps zu ermöglichen.
Durch den Vergleich erkennen Sie sofort Verhaltenänderungen und können nachvollziehen, ob Ihre neue Funktion die gewünschte Wirkung erzielt hat.
Ein Beispiel hierfür wäre das Hinzufügen einer Schaltfläche „Alles herunterladen“ auf der Dateibrowser-Seite Ihres Cloud-Speicherprodukts. Wenn die Nutzer beginnen, aktiv mit dieser Schaltfläche zu interagieren, anstatt jede einzelne Datei manuell herunterzuladen, ist Ihre neue Funktion ein Erfolg.
Wie UX-Designer Maus-Heatmaps verwenden
Heatmaps sind ein fantastisches Werkzeug, um Nutzerinteraktionen zu analysieren. Daher zähle ich sie zu den unverzichtbaren Werkzeugen im Arsenal von UX-Designern. Hier sind einige Beispiele, wie mein UX-Team Maus-Heatmaps genutzt hat, um ihr Design zu verbessern.
#6: Verbesserung der Formular-Abschlussrate
Unabhängig davon, welches Produkt Sie anbieten, werden Sie höchstwahrscheinlich mindestens ein Formular in Ihrem Aktivierungs- oder Monetarisierungs-Funnel haben. Außerdem werden Sie meiner Erfahrung nach die meisten Nutzer oder Conversions an dem Schritt verlieren, an dem sie dieses Formular ausfüllen müssen.
Der Hauptgrund für diesen Abbruch ist häufig eine schlechte Benutzererfahrung, wodurch die Nutzer sich langweilen oder frustriert werden. Um herauszufinden, ob dies bei Ihrem Formular der Fall ist und es zu beheben, führen Produktdesigner Usability-Tests durch und beobachten genau das Verhalten ihrer Nutzer. Das Problem bei diesen Tests ist jedoch, dass sie sowohl zeit- als auch ressourcenintensiv sind.
Formularanalysen mit Maus-Heatmaps hingegen können einen erheblichen Teil der Usability-Probleme zu einem Bruchteil der Kosten identifizieren.
Wenn Sie beispielsweise einen großen Drop-off bei Ihrem Registrierungsformular während des Checkouts feststellen und die Heatmap betrachten, könnten Sie herausfinden, dass es viel Mausaktivität in den ersten Feldern gibt, diese aber beim Feld „Telefonnummer“ plötzlich stark abnimmt.
Das könnte darauf hindeuten, dass die Menschen sich unwohl fühlen, ihre Telefonnummer mit Ihnen zu teilen, und Sie daher eine alternative Identifikationsmöglichkeit in Betracht ziehen sollten.
#7: Behebung von Navigationsproblemen
Manchmal liegt der Rückgang bei der Entdeckung und Nutzung Ihrer Funktionen oder Website-Bereiche daran, dass Nutzer diese auf Ihrer Plattform nicht finden können.
Wenn Sie ein E-Commerce-Shop sind, der gerade erst angefangen hat, professionelle Sportschuhe (wie z. B. Ringen, Basketball usw.) zu verkaufen, würden Sie ganz natürlich einen neuen Bereich unter Ihrer bestehenden Navigation hinzufügen und es dabei belassen.
Stellen Sie sich jedoch vor, dass der Traffic in Ihrem Bereich für Sportschuhe deutlich niedriger ist als erwartet. Nach der Analyse der Maus-Heatmap könnten Sie feststellen, dass nur sehr wenige Menschen mit der Maus über diesen Bereich in Ihrer Navigation fahren.
Einerseits könnte dies an mangelndem Interesse an Sportschuhen liegen. Andererseits könnte es sein, dass die Nutzer Ihre neue Kategorie schlichtweg nicht bemerkt haben, da die Liste der Schuhtypen in Ihrer Navigation bereits sehr umfangreich ist.
Auch wenn es durchaus Sinn macht, Ihre Bereiche organisiert zu halten, sollten Sie neue Bereiche dennoch anfangs besonders prominent platzieren. Ein UX-Designer könnte also erwägen, diesen neuen Bereich direkt in der oberen Navigationsleiste unterzubringen. Alternativ könnte er ihn an der bisherigen Stelle belassen, aber mit einem „neu“-Tag versehen, um mehr Aufmerksamkeit zu generieren.
#8: Verbesserung der Lesbarkeit
Dieser Aspekt ist besonders relevant für Blogs oder andere Ressourcen mit umfangreichen Inhalten. Manchmal beeinträchtigt die Gestaltung Ihres Textes die Lesbarkeit – mit dem Ergebnis, dass die Nutzer den Artikel verlassen.
Wie bei den vorherigen Anwendungsfällen lässt sich dies mithilfe von Maus-Heatmaps diagnostizieren. Wenn Sie zum Beispiel feststellen, dass Menschen mit dem Mauszeiger über jede Zeile Ihres Textes fahren, könnte dies daran liegen, dass der Textbereich für sie zu breit ist, um jede Zeile mit den Augen zu verfolgen – und sie deshalb den Mauszeiger als Hilfsmittel nutzen.
Heatmap-Software, die Sie in Betracht ziehen sollten
Nachdem wir die praktischen Anwendungsfälle für Maus-Heatmaps betrachtet haben, möchte ich auch auf einige verschiedene Heatmap-Analysetools, die dieses Werkzeug anbieten, eingehen und Ihnen zeigen, wie unterschiedlich diese an das Thema herangehen.
Hotjar
Hotjar bietet nicht direkt eine Maus-Heatmap an. Stattdessen teilt es die Informationen, die Sie normalerweise in einer Maus-Heatmap finden, in verschiedene Kartentypen auf. Konkret gibt es Mausklick-Heatmaps, Scroll-Heatmaps, Mausbewegungs-Heatmaps und Rage-Click-Heatmaps. So sieht beispielsweise die Bewegungs-Karte aus.
Auch wenn es auf den ersten Blick unpraktisch erscheint, separate Maps zu haben, liefern diese viel detailliertere Daten zu jeder Art von Interaktion (z. B. Scrollen).
Darüber hinaus bietet es zusätzliche Funktionen, wie eine Echtzeit-Anzeige der Webseitenbesucher, Sitzungsaufzeichnungen, visuelle Darstellung von Engagement-Zonen im Seitenlayout usw.
Crazy Egg
Mit Crazy Egg erhältst du eine Heatmap, die Datensätze sowohl aus Benutzer-Klicks als auch aus Mouse-Hover enthält. Mit ihren eigenen Algorithmen können sie diese beiden verschiedenen Interaktionstypen zu einer einzigen Karte zusammenfassen, die die allgemeinen Interessensbereiche deiner Nutzer anzeigt.
Im Vergleich zu Hotjar erhältst du etwas weniger Granularität. Jedoch ist diese kombinierte Heatmap sehr nützlich, wenn du dir einen Überblick darüber verschaffen möchtest, wie Nutzer mit deinem UX interagieren, anstatt die exakten Standorte von Klicks, Scroll-Tiefe, usw. zu identifizieren.
Ebenso wie bei Hotjar erhältst du auch bei Crazy Egg Sitzungsaufzeichnungen und weitere Analyse-Möglichkeiten.
Mouseflow
Wie Hotjar bietet dir Mouseflow 6 verschiedene Arten von Maus-Tracking-Heatmaps anstelle einer einzigen kombinierten Karte. Du bekommst die üblichen Typen wie Klick-, Hover- und Scroll-Heatmaps.
Darüber hinaus hat Mouseflow jedoch eine besondere Art von Heatmap im Angebot, die du bei solchen Plattformen nur selten findest – eine geografische Heatmap.
Anstatt die Nutzerinteraktion auf deinem UX zu visualisieren, zeigt diese Heatmap dir die Weltkarte an und hebt die Regionen hervor, aus denen du die meisten Nutzer (und Interaktionen) erhältst.
Unverzichtbar: Ergänzung zu Nutzerinterviews und Usability-Tests
Ich behaupte, dass Nutzerinterviews die wertvollste Aktivität sind, die Produktmanager durchführen. Aber genau wie Usability-Tests sind sie sehr zeitaufwendig.
Überlege dir also, Maus-Heatmaps als fantastische (und günstige) Alternative zu nutzen, um Antworten auf einige der einfacheren Fragen über deine Kundschaft zu bekommen und den wertvollen Interview-Zeitaufwand für komplexere Themen aufzusparen.
Suchst du nach weiteren Möglichkeiten, deine Produkte zu verbessern? Frische dein Wissen und deine Fähigkeiten in diesem faszinierenden Berufsfeld auf, indem du unseren Newsletter abonnierst. So bleibst du mit unserem hochwertigen Bildungskontent und unseren Software-Listen immer auf dem neuesten Stand der Produktmanagement-Themen.