Mappe di Calore del Mouse: 8 Modi in Cui Possono Migliorare il Tuo Prodotto
Vedi Cosa Fanno Davvero gli Utenti, Non Solo Cosa Dicono: Sondaggi e analisi raccontano solo una parte della storia. Le mappe di calore del mouse rivelano dove gli utenti esitano, hanno difficoltà o si coinvolgono di più—aiutandoti a prendere decisioni basate sui dati con sicurezza.
Dai Priorità alle Correzioni e alle Funzionalità Davvero Importanti: Invece di indovinare su cosa lavorare dopo, le mappe di calore evidenziano dove gli utenti trascorrono tempo (o si frustrano), fornendo una direzione chiara su cosa richiede attenzione prima.
Scopri Perché gli Utenti Abbandonano… e Risolvilo: Non tutti gli abbandoni sono uguali. Le mappe di calore mostrano se gli utenti si perdono i pulsanti chiave, hanno difficoltà con i campi del modulo o si confondono—così puoi rimuovere gli ostacoli prima che se ne vadano.
Individua l’Atrito Nascosto nel Tuo Funnel di Attivazione: Gli utenti cliccano dove non dovrebbero? Restano bloccati in passaggi chiave? Le mappe di calore scoprono i colli di bottiglia così puoi semplificare il percorso e aumentare le conversioni.
Probabilmente la parte più interessante e gratificante del lavoro di un product manager è imparare a conoscere come pensano e agiscono i propri utenti quando utilizzano i loro prodotti.
Per farlo, solitamente conduciamo interviste agli utenti, realizziamo sondaggi e analizziamo i nostri dati. Tuttavia, nell’arsenale di un PM esiste un altro strumento prezioso che può aiutarti a entrare in empatia con i tuoi utenti: le heatmap del mouse!
Oggi, voglio analizzare insieme a voi i casi d’uso pratici delle heatmap del mouse e come sfruttarle efficacemente per migliorare il vostro prodotto.
Vuoi di più da The CPO Club?
Iscriviti gratuitamente per completare la lettura di questo articolo:
Have an account? Log In
Cosa Sono le Heatmap del Mouse e Come Funzionano?
Una heatmap del mouse (nota anche come heatmap dell’attenzione) è uno strumento di analisi dei prodotti che visualizza come gli utenti interagiscono con la tua interfaccia tramite i movimenti del mouse. Crea una sovrapposizione visiva—di solito usando gradienti di colore—su uno screenshot della tua UI per mostrare dove gli utenti passano il mouse, si muovono e cliccano più frequentemente.
Questo può aiutarti a identificare quali elementi attirano l’attenzione, dove gli utenti esitano o cosa viene completamente ignorato. Le heatmap del mouse sono particolarmente utili se utilizzate insieme ad altri tipi di heatmap, come le heatmap di scroll, che catturano fino a dove gli utenti scorrono la pagina.
Usati insieme, questi strumenti ti danno una visione più completa dell’engagement degli utenti: cosa vedono, cosa saltano e dove scorre naturalmente la loro attenzione.
Diversi tipi di heatmap sono comunemente utilizzati da product manager e designer UX per ricavare insight sui comportamenti degli utenti, tra cui scroll map, mappe dei clic, mappe di attenzione degli utenti, heatmap di eye-tracking e molti altri esempi di heatmap. Ogni tipo può offrire insight specifici per aumentare la fidelizzazione e l’engagement degli utenti, ma oggi voglio approfondire un tipo in particolare: la heatmap del mouse.
Una heatmap del mouse è ciò che si definisce un “aggregato” poiché include dati combinati provenienti da vari tipi di interazioni dell’utente: clic, scroll e movimenti del mouse.
Le heatmap del mouse sono relativamente nuove nel mondo della visual analytics di prodotto perché combinare i dati di questi tre diversi tipi di comportamenti in una sola visualizzazione è difficile, ed è stata l’avvento dei modelli di intelligenza artificiale a permettere agli strumenti di analytics di riuscirci.
Casi d’Uso Reali di Ottimizzazione del Prodotto con Mouse Tracking
Ora che abbiamo una comprensione generale di cosa sono queste heatmap, vediamo alcuni casi reali in cui puoi portare valore al tuo prodotto analizzando le heatmap del mouse.
Come Usano le Heatmap del Mouse i Product Manager
Sebbene analizzare le interazioni degli utenti possa sembrare un’attività più vicina alle esigenze dei designer UX, i product manager possono utilizzare le heatmap del mouse per risolvere i loro problemi specifici. Ecco alcuni dei modi in cui ho utilizzato questo strumento per migliorare i miei prodotti.
#1: Individuare i Collo di Bottiglia nel Tuo Funnel di Attivazione
Dalla mia esperienza nell’affrontare le sfide dell’attivazione, l’ottimizzazione del funnel è una delle responsabilità più complesse ma anche con maggiore impatto per un product manager. Anche solo un miglioramento del 10% dell’attivazione può creare un effetto a cascata su tutto il funnel, aumentando notevolmente la conversione da Free → Paid.
Tuttavia, l’attivazione non è solo una questione numerica: è un puzzle che richiede una profonda comprensione comportamentale, sperimentazione iterativa e la volontà di mettere in discussione le assunzioni su come gli utenti si rapportano al tuo prodotto. La chiave non è solo spingere più utenti lungo il funnel, ma capire davvero perché si interrompono nel percorso.
Per farlo, un product manager utilizzerà praticamente tutti gli strumenti a sua disposizione, tra cui analytics, sondaggi, ecc. Anche le heatmap del mouse fanno parte di questi strumenti. Ecco uno dei tanti modi in cui queste possono aiutare a migliorare l’attivazione.
Immagina di lavorare in Atlassian e di avere fissato come obiettivo trimestrale quello di incrementare il tasso di completamento della configurazione di Jira Cloud.
Analizzando il funnel di attivazione tramite il tuo strumento di analytics, noti che c’è un forte calo nel passaggio in cui gli utenti devono inserire il nome della propria istanza di Jira e creare il sito Atlassian.
Per capire cosa sta succedendo, potresti aprire lo strumento delle heatmap e osservare la heatmap del mouse. Quello che vedi è che gli utenti trascorrono molto tempo sulla pagina, cliccano frequentemente sul campo nome sito e sul campo “Get Started In Jira”.
Questo non è un comportamento normale, poiché desideri che le persone clicchino su ciascun campo solo una volta e trascorrano non più di 10-15 secondi su questa pagina. Avvii un'indagine e chiedi al tuo team QA di verificare cosa sta succedendo.
Quello che il tuo team scopre è che, per un certo gruppo di utenti, il validatore del nome del sito (che controlla se il nome esiste già) genera un errore qualunque cosa venga digitata.
La ragione è che un Google Recaptcha invisibile considera questi utenti come bot. Quindi, per risolvere questo problema, parli con il tuo team di sicurezza, capisci che la soglia di sicurezza di recaptcha è più alta di quella di cui abbiamo bisogno e la abbassi.
Di conseguenza, stai sbloccando i tuoi utenti, permettendo loro di creare il loro sito e migliorando significativamente il tuo tasso di attivazione.
#2: Aiutare nella Prioritizzazione delle Funzionalità
Quando si tratta di prioritizzazione delle funzionalità, il fattore più importante che consideri è l'impatto di quella funzionalità sui tuoi utenti. Misuri questo impatto in base ai dati, alla tua conoscenza dei bisogni degli utenti (basata su sondaggi e interviste), al tuo intuito e a come gli utenti interagiscono con la tua interfaccia.
Ed è qui che le heatmap del mouse possono aiutarti.
Tornando al nostro esempio di Jira. Supponiamo che tu voglia migliorare il modo in cui le persone organizzano l'area backlog e che ci siano più di 20 idee di funzionalità a riguardo. Per priorizzarle in base ai bisogni degli utenti, consulti la heatmap della pagina backlog. Dopo averla analizzata, noti che c'è molta attività nella sezione dei filtri rapidi.
Quindi vai al tuo strumento di analisi ed estrai un grafico di distribuzione dei filtri rapidi che i tuoi utenti hanno applicato più frequentemente. Osservando questi dati, vedi che circa il 50% di tutti gli utenti Jira crea un filtro rapido che mostra le attività con "Stato Da Fare".
Un ottimo modo per migliorare l'esperienza degli utenti, in questo caso, sarebbe aggiungere un pulsante filtro dedicato per gli stati. Supponiamo che questa idea fosse già sulla tua lista di miglioramenti, quindi usi questa intuizione per assegnarle una priorità più alta e portarla in cima al backlog del tuo team.
#3: Ottimizzazione del Tasso di Conversione
In termini di complessità, l'ottimizzazione del tasso di conversione (CR) può facilmente competere con i funnel di attivazione. Ho passato mesi ad analizzare il CR e metriche simili per i miei prodotti, aggiungendo funzionalità per migliorarlo, rendendomi conto che non funzionano, aggiungendone altre e ripetendo questo ciclo fino a costruire qualcosa che effettivamente aumenti il tasso di conversione.
Proprio come per l'attivazione, le heatmap del mouse sono uno strumento efficace per analizzare le sfide di conversione dei tuoi prodotti.
Nella maggior parte dei casi, il principale punto di forza di questo strumento è identificare i casi in cui le persone cliccano sui CTA sbagliati e ignorano quelli che portano alla conversione. Lascia che te lo dimostri sulla pagina prodotto di un negozio di attrezzature da cucina professionali.
Immagina di analizzare la heatmap di questa pagina web. Molto probabilmente noterai che un certo numero di persone clicca sul pulsante "Chat Now" sopra l'invito principale all'azione (visualizza prodotto). Capisco, l'azienda l'ha aggiunto per convincere gli utenti che i loro prodotti sono i più economici sul mercato.
Tuttavia, il problema qui è che cliccare su "Chat Now" interrompe il percorso degli utenti che stanno valutando il prodotto e che potrebbero acquistarlo, riducendo notevolmente il tasso di conversione.
Il mio suggerimento, in questo caso, sarebbe spostare questo messaggio e CTA in una parte meno evidente della pagina per evitare di interrompere il percorso degli utenti.
#5: A/B Testing per la Validazione delle Funzionalità
Un'altra applicazione utile delle heatmap del mouse è la validazione delle funzionalità tramite A/B testing. In questo caso, le heatmap possono essere una preziosa fonte di dati poiché mostrano visivamente i miglioramenti (o la loro assenza) nel modo in cui gli utenti interagiscono con la tua funzionalità.
Quello che fai in questo caso è eseguire un test A/B con la tua funzionalità attiva per una variante A e inattiva per la variante B. Ti assicuri poi che lo strumento di heatmapping stia monitorando le interazioni degli utenti su entrambe le varianti per permetterti di fare un confronto fianco a fianco delle heatmap del mouse di ciascuna.
Osservandole, puoi facilmente individuare i cambiamenti nel comportamento degli utenti e capire se la tua nuova funzionalità ha prodotto l'effetto atteso.
Un esempio potrebbe essere l'aggiunta di un pulsante “Scarica tutto” nella pagina di navigazione file del tuo servizio di cloud storage. Se le persone iniziano a interagire attivamente con quel pulsante invece di scaricare manualmente ogni singolo file dal loro spazio di archiviazione, allora la tua nuova funzionalità sarà un successo.
Come gli UX Designer Utilizzano le Heatmap del Mouse
Le heatmap sono uno strumento fantastico per analizzare le interazioni degli utenti. Per questo motivo, le considero indispensabili nell’arsenale di un UX designer. Ecco alcuni dei modi in cui il mio team UX ha utilizzato le heatmap del mouse per migliorare i propri design.
#6: Migliorare il Tasso di Completamento dei Moduli
Non importa quale tipo di prodotto hai, molto probabilmente avrai almeno un modulo nel tuo funnel di attivazione o monetizzazione. Inoltre, dalla mia esperienza, perderai quasi certamente utenti/conversioni proprio nella fase del funnel in cui devono compilare questo modulo.
La ragione principale per cui li perdi è probabilmente una scarsa esperienza utente che li lascia annoiati o frustrati. Per capire se questo accade anche con i tuoi moduli e risolverlo, i designer di prodotto effettueranno dei test di usabilità osservando attentamente il comportamento degli utenti. Il problema di questi test, però, è che richiedono molto tempo e risorse.
L’analisi dei moduli tramite heatmap del mouse, invece, può identificare una parte significativa dei problemi di usabilità a una frazione del costo.
Ad esempio, se noti un forte calo nella compilazione del modulo di registrazione durante il checkout e osservi la heatmap, potresti scoprire che c’è una notevole attività del mouse nei primi campi, che però cala improvvisamente nel campo “numero di telefono”.
Questo potrebbe indicare che le persone non si sentono a proprio agio a condividere il loro numero di telefono e dovresti considerare un modo alternativo per identificarle.
#7: Risolvere Problemi di Navigazione
A volte il calo nella scoperta e nell’utilizzo delle tue funzionalità o delle sezioni del sito dipende dal fatto che gli utenti non riescono a trovarle sulla tua piattaforma.
Se sei un negozio eCommerce che ha appena iniziato a vendere scarpe sportive professionali (ad esempio, da lotta, basket, ecc.), naturalmente aggiungeresti una nuova sezione nella navigazione esistente e ti fermeresti lì.
Tuttavia, immagina che il traffico della tua sezione scarpe sportive sia molto inferiore alle aspettative. Dopo aver esaminato la heatmap del mouse, potresti notare che pochissime persone passano con il mouse sopra quella sezione nella tua navigazione.
Da un lato, questo potrebbe essere dovuto a una mancanza di interesse per le scarpe sportive. Dall’altro, le persone potrebbero non essersi accorte che l’hai aggiunta semplicemente perché l’elenco dei tipi di scarpe nella navigazione è piuttosto lungo.
Ha certamente senso mantenere le sezioni organizzate, ma se aggiungi qualcosa di nuovo dovresti posizionarlo in modo prominente (almeno all’inizio). Quindi, un UX designer potrebbe valutare di inserire questa nuova sezione direttamente nella barra di navigazione principale. In alternativa, potrebbe lasciarla nella stessa posizione ma aggiungere un tag “nuovo” per attirare maggior attenzione.
#8: Migliorare la Leggibilità
Questo caso è particolarmente rilevante per blog o risorse con contenuti lunghi. A volte il modo in cui hai progettato il testo può influire negativamente sulla leggibilità – portando gli utenti ad abbandonare l’articolo.
Come nei casi d’uso precedenti, anche questo può essere individuato tramite heatmap del mouse. Ad esempio, se guardando la heatmap noti che le persone passano il cursore su ogni riga del tuo testo, la sezione di testo potrebbe essere troppo larga perché riescano a seguire ogni riga solo con lo sguardo (così finiscono per usare il mouse come guida).
Software di Heatmap da Prendere in Considerazione
Dopo aver affrontato i casi pratici delle heatmap del mouse, parliamo anche dei prodotti di analisi heatmap che offrono questo strumento e vediamo come si differenziano nell’approccio.
Hotjar
Hotjar non dispone necessariamente di una heatmap del mouse in senso stretto. Invece, ha suddiviso le informazioni che normalmente trovi in una classica heatmap del mouse in diversi tipi di mappe. In particolare, ci sono le mappe dei clic del mouse, le mappe di scorrimento, le heatmap di movimento del mouse e le mappe dei "rage click". Ecco come appare la sua mappa di movimento.
Sebbene avere mappe separate possa sembrare scomodo a prima vista, in realtà fornisce dati molto più dettagliati per ciascun tipo di interazione (ad es. lo scroll).
Inoltre, offre anche funzionalità aggiuntive, come il conteggio in tempo reale dei visitatori del sito web, replay delle sessioni, rappresentazione visiva delle zone di coinvolgimento sulla struttura della pagina, ecc.
Crazy Egg
Con Crazy Egg, ottieni una heatmap che include dati sia dai click degli utenti sia dai movimenti del mouse sopra le aree. Con i loro algoritmi proprietari, riescono a combinare questi due diversi tipi di interazione in una sola mappa che mostra le aree di interesse generale per i tuoi utenti.
Rispetto a Hotjar, si ottiene una granularità leggermente inferiore. Tuttavia, questo tipo di heatmap combinata è molto utile quando il tuo obiettivo è avere una panoramica di come le persone interagiscono con la tua UX invece di identificare le posizioni esatte dei click, la profondità dello scroll, ecc.
Proprio come con Hotjar, anche Crazy Egg offre registrazioni delle sessioni e altre funzionalità di analytics.
Mouseflow
Proprio come Hotjar, Mouseflow ti fornirà 6 tipi distinti di heatmap di tracciamento del mouse invece di una sola combinata. Trovi tutte le tipologie usuali, inclusi click, hover e heatmap di scroll.
Oltre a ciò, però, Mouseflow offre anche un tipo speciale di heatmap che raramente si trova su queste piattaforme: la heatmap geografica.
Invece di visualizzare l'interazione degli utenti sulla tua UX, questa heatmap ti mostrerà la mappa del mondo e evidenzierà le parti del mondo da cui arrivano la maggior parte degli utenti (e delle interazioni).
Un Must da aggiungere a interviste agli utenti e usability testing
Sostengo che le interviste agli utenti siano l’attività singola più preziosa svolta dai product manager. Tuttavia, proprio come il testing di usabilità, richiedono molto tempo.
Quindi, considera l'utilizzo delle heatmap mouse come una fantastica (e economica) alternativa per trovare risposte alle domande più semplici sui tuoi clienti, destinando invece il tuo prezioso tempo di intervista a quelle più complesse.
Vuoi scoprire nuovi modi per migliorare i tuoi prodotti? Aggiorna le tue conoscenze e competenze in questa professione affascinante iscrivendoti alla nostra newsletter. Potrai restare aggiornato sui più recenti argomenti di product management con i nostri contenuti formativi di alto livello e le nostre liste di software.