Heatmaps over musebevægelser: 8 måder, de kan forbedre dit produkt på

Den mest interessante og givende del af arbejdet som produktchef er sandsynligvis at lære, hvordan brugerne tænker og handler, når det kommer til at bruge deres produkter.

For at gøre dette gennemfører vi normalt brugerinterviews, udsender undersøgelser og analyserer vores data. Der findes dog et andet værdifuldt værktøj i en produktchefs arsenal, som kan hjælpe dig med at sætte dig ind i dine brugeres situation – muse-varmekort!

I dag vil jeg gennemgå de praktiske anvendelsesmuligheder for muse-varmekort og effektive måder at bruge dem til at forbedre dit produkt på.

Hvad er muse-varmekort, og hvordan fungerer de?

Et muse-varmekort (også kaldet et opmærksomhedsvarmekort) er et produktanalyseværktøj værktøj, der visualiserer, hvordan brugerne interagerer med din grænseflade ved hjælp af deres musebevægelser. Det opretter en visuel overlejring – typisk ved hjælp af farveovergange – på et skærmbillede af din brugergrænseflade for at vise, hvor brugerne oftest holder musen over, bevæger den og klikker.

Det kan hjælpe dig med at identificere, hvilke elementer der tiltrækker opmærksomhed, hvor brugerne måske tøver, eller hvad der bliver fuldstændig ignoreret. Muse-varmekort er særligt nyttige, når de bruges sammen med andre typer varmekort, såsom rullevarmekort, der viser, hvor langt ned på siden brugerne ruller.

Brugt sammen giver disse værktøjer dig et mere komplet billede af brugerengagementet – hvad de ser, hvad de springer over, og hvor deres opmærksomhed naturligt bevæger sig hen.

Forskellige typer varmekort bruges almindeligvis af produktchefer og UX-designere til at få indsigt i deres brugeres adfærd, herunder rullekort, klik-kort, brugeropmærksomhedskort, varmekort til øjensporing og mange flere eksempler på varmekort. Hver type kan give dig specifik indsigt, så du kan øge brugerfastholdelsen og engagementet, men i dag vil jeg gå i dybden med én bestemt type – muse-varmekortet.

Et muse-varmekort er det, man ville kalde en “aggregering”, da det indeholder kombinerede data fra flere forskellige typer brugerinteraktioner – klikadfærd, rulleadfærd og musebevægelsesadfærd.

Muse-varmekort er relativt nye inden for visuel produktanalyse, fordi det er en vanskelig opgave at kombinere data fra disse tre forskellige adfærdstyper i én enkelt visualisering, og det var fremkomsten af AI-modeller, der gjorde det muligt for analyseværktøjer at gøre dette.

Praktiske eksempler på optimering af dit produkt med musesporing

Nu hvor vi har en generel forståelse af, hvad disse varmekort er, kan vi dykke ned i flere praktiske eksempler på, hvordan du kan gøre noget værdifuldt for dit produkt ved at se på og analysere dine muse-varmekort.

Sådan bruger produktchefer muse-varmekort

Selvom analyse af brugerinteraktioner måske virker som noget, der i højere grad opfylder UX-designeres behov, kan produktchefer også bruge muse-varmekort til at løse deres egne problemer. Her er nogle af de måder, jeg har brugt dette værktøj på til at forbedre mine produkter.

#1: Find flaskehalse i din aktiveringstragt

Ud fra min erfaring med at håndtere aktiveringsudfordringer er tragtoptimering et af de mest komplekse, men samtidig mest virkningsfulde ansvarsområder for en produktchef. Selv en beskeden stigning på 10 % i aktiveringen kan skabe en kaskadeeffekt gennem hele tragten og øge konverteringen fra gratis til betalt betydeligt.

Aktivering handler dog ikke kun om tal – det er et puslespil, der kræver dyb indsigt i adfærd, gentagne eksperimenter og en villighed til at stille spørgsmålstegn ved antagelser om, hvordan brugerne interagerer med dit produkt. Det afgørende er ikke bare at få flere brugere gennem tragten, men virkelig at forstå, hvorfor de falder fra til at begynde med.

For at gøre dette vil en produktchef bruge stort set alle værktøjerne i sit arsenal, herunder analyser, undersøgelser osv. Musekort er også blandt disse værktøjer. Her er én af de mange måder, de kan hjælpe med at forbedre aktiveringen på.

Forestil dig, at du arbejder hos Atlassian, og at du har sat dig et kvartalsmål om at forbedre opsætningsraten for Jira Cloud.

Ved at se på aktiveringstragten ved hjælp af dit analyseværktøj kan du se, at der er et alvorligt frafald på det trin, hvor brugerne indtaster navnet på deres Jira-instans og opretter deres Atlassian-websted.

For at forstå, hvad der er sket, kan du åbne dit varmekortværktøj og se på muse-varmekortet. Du kan se, at brugerne bruger meget tid på siden og aktivt klikker på feltet til webstedsnavnet og feltet “Kom i gang i Jira”.

Dette er ikke normal adfærd, da du ønsker, at folk kun klikker på hvert felt én gang og bruger højst 10-15 sekunder på denne side. Du iværksætter en undersøgelse og beder dit QA-team om at undersøge, hvad der foregår.

Det, dit team finder ud af, er, at valideringen af webstedsnavnet (som kontrollerer, om navnet allerede findes) for en bestemt gruppe brugere viser en fejl, uanset hvad de indtaster.

Årsagen er, at en usynlig Google Recaptcha tror, at disse brugere er bots. For at løse dette taler du derfor med dit sikkerhedsteam, forstår, at sikkerhedstærsklen for recaptcha er højere end nødvendigt, og sænker den.

Som resultat låser du dine brugere op, lader dem oprette deres websted og forbedrer din aktiveringsrate betydeligt.

#2: Hjælp med prioritering af funktioner

Når det kommer til prioritering af funktioner, er den klart stærkeste faktor, du overvejer, funktionens indvirkning på dine brugere. Du måler denne indvirkning baseret på data, din viden om brugernes behov (baseret på spørgeundersøgelser og interviews), din mavefornemmelse og den måde, brugerne interagerer med din grænseflade på.

Det sidstnævnte er, hvor dine musevarmekort kommer dig til hjælp.

Lad os vende tilbage til vores Jira-eksempel. Lad os antage, at du ønsker at forbedre den måde, folk organiserer backloggen på, og at der er mere end 20 idéer til funktioner. For at prioritere dem baseret på brugernes behov gennemgår du varmekortet for backlog-siden. Efter gennemgangen kan du se, at der er stor aktivitet i sektionen med hurtige filtre.

Så går du til dit analyseværktøj og udtrækker et fordelingsdiagram over de hurtige filtre, som dine brugere oftest har anvendt. Ved at se på disse data kan du se, at omkring 50 % af alle Jira-brugere opretter et hurtigt filter, der viser opgaverne med “Skal udføres-status”.

En god måde at forbedre dine brugeres oplevelse på i dette tilfælde ville være at tilføje en dedikeret filterknap til statuser. Lad os sige, at denne funktionsidé allerede stod på din liste over forbedringer, så du bruger denne indsigt til at give den en højere prioritet og flytter den øverst i dit teams backlog.

#3: Optimering af konverteringsrate

Hvad angår kompleksitet, kan optimering af konverteringsraten (CR) sagtens konkurrere med aktiveringsfunnels. Jeg har brugt måneder på at analysere CR og lignende målinger for mine produkter, tilføje funktioner for at forbedre den, indse, at de ikke virker, tilføje noget andet og gentage denne cyklus, indtil jeg byggede noget, der faktisk øgede konverteringsraten.

Ligesom ved aktivering er musevarmekort et effektivt værktøj til at analysere konverteringsudfordringer for dine produkter.

I de fleste tilfælde er den største fordel ved dette værktøj at identificere de tilfælde, hvor folk klikker på de forkerte CTA'er og ignorerer dem, der fører til konvertering. Lad mig demonstrere det på produktsiden for en butik med udstyr til storkøkkener.

Forestil dig, at vi gennemgår webstedets varmekort for denne webside. Mest sandsynligt vil vi se, at et vist antal personer klikker på knappen “Chat nu” over den primære CTA (se produkt). Jeg forstår godt, at virksomheden har tilføjet den for at overbevise brugerne om, at deres produkter er de billigste på markedet. 

Problemet er imidlertid, at et klik på “Chat nu” afbryder brugernes rejse, mens de gennemgår produktet og køber det – hvilket reducerer konverteringsraten betydeligt.

Mit forslag her ville være at flytte denne besked og CTA'en til en mindre fremtrædende del af siden for at undgå at afbryde brugernes rejse.

#5: A/B-test til validering af funktioner

En anden nyttig anvendelse af musevarmekort er funktionsvalidering via A/B-test. Her kan varmekort fungere som en værdifuld datakilde ved visuelt at vise dig forbedringerne (eller manglen på samme) i den måde, brugerne interagerer med din funktion på.

I dette tilfælde gennemfører du A/B-testen med din funktion slået til for variant A og slået fra for variant B. Derefter sørger du for, at dit varmekortværktøj sporer brugerinteraktioner på begge varianter, så du kan foretage en direkte sammenligning af musevarmekortet for hver af dem.

Ved at se på dem kan du nemt få øje på ændringer i brugeradfærden og se, om din nye funktion havde den effekt, du håbede på.

Et eksempel på dette ville være at tilføje en "Download alle"-knap på filbrowsersiden i dit cloudlagerprodukt. Hvis folk begynder aktivt at interagere med den knap i stedet for manuelt at downloade hver eneste fil i deres lager, vil din nye funktion være en succes.

Sådan bruger UX-designere muse-varmekort

Varmekort er et fantastisk værktøj til at undersøge brugerinteraktioner. Derfor betragter jeg det som et af de uundværlige værktøjer i UX-designeres arsenal. Her er nogle af de måder, mit UX-team har brugt muse-varmekort til at forbedre deres design på.

#6: Forbedring af gennemførelsesraten for formularer

Uanset hvilken type produkt du har, vil du højst sandsynligt have mindst én formular i din aktiverings- eller indtægtstragt. Desuden vil du, baseret på min erfaring, højst sandsynligt miste personer/konverteringer på det trin i tragten, hvor de udfylder denne formular.

Den primære årsag til, at du mister dem, er sandsynligvis en dårlig brugeroplevelse, der gør dem kede af det eller frustrerede. For at forstå, om dette sker med din formular, og rette op på det, udfører produktdesignere brugervenlighedstests og holder nøje øje med deres brugeres adfærd. Problemet med disse tests er imidlertid, at de både er tids- og ressourcekrævende.

Analyse af formularer ved hjælp af muse-varmekort kan imidlertid identificere en betydelig del af brugervenlighedsproblemerne til en brøkdel af omkostningerne.

Hvis du for eksempel ser et stort frafald på din registreringsformular under betalingsprocessen og kigger på varmekortet, opdager du måske, at der er betydelig museaktivitet i de første par felter, hvorefter aktiviteten pludselig falder ved feltet "telefonnummer".

Det kan være et tegn på, at folk ikke føler sig trygge ved at dele deres telefonnumre med dig, og at du bør overveje en alternativ måde at identificere dem på.

#7: Løsning af navigationsproblemer

Nogle gange skyldes faldet i opdagelsen og brugen af dine funktioner eller webstedssektioner, at dine brugere ikke kan finde dem på din platform.

Hvis du har en e-handelsbutik, der netop er begyndt at sælge professionelle sportssko (f.eks. brydning, basketball osv.), vil du naturligt tilføje en ny sektion under din eksisterende navigation og betragte opgaven som løst.

Forestil dig imidlertid, at trafikken til din sportssko-sektion er langt lavere, end du forventede. Efter at have gennemgået muse-varmekortet kan du måske se, at meget få personer holder markøren over denne sportssektion i din navigation.

På den ene side kan det skyldes manglende interesse for sportssko. På den anden side har folk måske ikke bemærket, at du har tilføjet den, simpelthen fordi listen over skotyper i din navigation er ganske omfattende.

Selvom det giver god mening at holde dine sektioner organiseret, bør du placere noget nyt et fremtrædende sted (i hvert fald i begyndelsen), hvis du tilføjer det. En UX-designer kan derfor overveje at placere denne nye sektion øverst i navigationslinjen. Alternativt kan designeren beholde den på samme sted, men tilføje et "ny"-mærke for at tiltrække flere blikke. 

#8: Forbedring af læsbarheden

Dette tilfælde er særligt relevant for blogs eller andre ressourcer med langt indhold. Nogle gange vil den måde, du har designet din tekst på, påvirke læsbarheden negativt - hvilket får brugerne til at forlade artiklen.

Ligesom med de tidligere anvendelsesområder er dette noget, du kan diagnosticere med muse-varmekort. Hvis du for eksempel ser på varmekortet og ser personer føre deres markører hen over hver linje i din tekst, kan tekstsektionen være for bred til, at de kan følge hver linje med øjnene (så de ender med at bruge musemarkøren til det formål i stedet).

Varmekortsoftware, du kan overveje

Nu hvor de praktiske anvendelsesområder for muse-varmekort er dækket, vil jeg også fortælle lidt om de forskellige analyseprodukter til varmekort, der tilbyder dette værktøj, og vise dig forskellene på deres tilgang til det.

Hotjar

Hotjar har ikke et egentligt muse-varmekort. I stedet har de opdelt de oplysninger, du kan finde i et typisk muse-varmekort, i forskellige typer kort. Du får nemlig kort over museklik, rullekort, varmekort over musebevægelser og varmekort over frustrerede klik. Sådan ser deres bevægelseskort ud.

Selvom det ved første øjekast virker upraktisk at have separate kort, er de meget bedre til at give dig mere detaljerede data for hver type interaktion (f.eks. rulning).

Derudover kommer det også med ekstra funktioner såsom antal besøgende på webstedet i realtid, afspilninger af sessioner, visuel gengivelse af engagementszoner i sidelayoutet osv.

Crazy Egg

Med Crazy Egg får du et varmekort, der indeholder datasæt både fra brugerklik og musemarkørens bevægelser. Ved hjælp af deres proprietære algoritmer kan de kombinere disse to forskellige typer interaktioner i et enkelt kort, der viser de generelle interesseområder for dine brugere.

Sammenlignet med Hotjar får du lidt mindre detaljerede data. Denne type kombinerede varmekort er dog meget nyttig, når dit mål er at få et overblik over, hvordan folk interagerer med din UX, i stedet for at identificere de præcise placeringer af klik, rulledybde osv.

Ligesom med Hotjar får du også sessionsoptagelser og andre analysemuligheder med Crazy Egg.

Mouseflow

Ligesom Hotjar giver Mouseflow dig 6 forskellige typer varmekort til musesporing i stedet for ét kombineret kort. Du får de sædvanlige typer, herunder varmekort for klik, musebevægelser og rulning.

Mouseflow har dog også en særlig type varmekort, som man sjældent finder på sådanne platforme – et geografisk varmekort.

I stedet for at visualisere brugerinteraktion på din UX viser dette varmekort dig et verdenskort og fremhæver de dele af verden, hvor du får flest brugere (og interaktioner).

En vigtig tilføjelse til brugerinterviews og brugervenlighedstest

Jeg mener, at brugerinterviews er den mest værdifulde enkeltstående aktivitet, som produktchefer udfører. Men ligesom brugervenlighedstest er det ret tidskrævende.

Overvej derfor at bruge varmekort for musebevægelser som et fantastisk (og billigt) alternativ til at få svar på nogle af de lettere spørgsmål, du har om dine kunder, og brug i stedet din dyrebare interviewkapacitet på de sværere spørgsmål.

Leder du efter flere måder at forbedre dine produkter på? Opfrisk din viden og dine færdigheder inden for dette fascinerende fagområde ved at tilmelde dig vores nyhedsbrev. Du holder dig opdateret om de nyeste emner inden for produktledelse med vores førsteklasses uddannelsesindhold og softwarelister.