Skip to main content

Att bli en datadriven produktchef är bland det bästa du kan göra för att ta ditt produktarbete till nästa nivå.

Som en del av det arbetet har du kanske redan börjat arbeta med olika analysverktyg och till och med försökt basera dina beslut på deras data. Om du har hamnat på den här artikeln antar jag att du också är intresserad av att analysera ditt användargränssnitt med hjälp av värmekartor.

I så fall har du kommit rätt. Låt oss göra en djupdykning i det här heta verktyget!

Continue Reading for Free

Create a free account to finish this article, plus get ongoing access to timely insights and practical resources.

Vad är värmekartsanalys (och hur fungerar värmekartor?)

Värmekartsanalys är en metod för att mäta, visualisera och analysera dina användares beteende med hjälp av – du gissade rätt! – värmekartor.

Värmekartor är skärmbilder av ditt användargränssnitt som har markerats med olika färgöverlägg baserat på hur dina användare interagerar med sidans olika områden. Färgerna som används för markering sträcker sig vanligtvis från rött (mycket användarinteraktion) till blått (lite användarinteraktion).

skärmbild av inloggning
Källa: Useitbetter

Värmekartan ovan är ett exempel på en ”klickkarta” som spårar och visualiserar var användarna klickar mest.

Som vi kan se får knapparna Logga in och Skapa konto många klick här, medan navigeringsmenyn högst upp får liten eller ingen uppmärksamhet från användarna.

Värmekartor är fantastiska visualiseringsverktyg för att analysera din produkt och användarupplevelsen. De medför många fördelar, men det finns även nackdelar med att använda dem. Låt oss gå vidare och lära oss lite mer om båda sidorna av det här verktyget.

Vilka är fördelarna med att använda värmekartsverktyg?

Programvara för värmekartor blir allt mer populär. Under det senaste decenniet brukade den höra hemma bland digitala marknadsförare – tills produktteam upptäckte hur användbar den var för att finjustera användarupplevelsen. I dag har den blivit ett oumbärligt verktyg för PM:er och UX-designers.

Och det finns en god anledning till att värmekartsverktyg har blivit så populära – de är helt enkelt så bra på att förmedla dina användares beteendedata. Om du inte redan har integrerat ett i din produktportfölj är det ett måste att integrera ett värmekartsverktyg – och här är ett par fördelar med värmekartor som jag hoppas ska övertyga ditt produktteam om att börja använda verktyget.

Värmekartor är utmärkta för komplex datavisualisering

Kan du föreställa dig hur data om användarklick skulle se ut i ett icke-visuellt format? Förmodligen ungefär så här:

data och visualisering av värmekarta

Aj, mina ögon!

Försök nu att förstå användarnas beteende utifrån dessa datapunkter. Kan du säga vilka knappar användarna helst klickar på? Förmodligen inte.

Nu försöker vi med en visuell representation av samma data.

hotjar-skärmbild
Ahhh, vilken lättnad. Källa: UserPilot

Det är mycket enklare att avgöra vilka knappar som fungerar bäst genom att titta på den här visuella bilden, eller hur?

Det fina med värmekartor är deras förmåga att förmedla komplex information på ett mycket lättillgängligt sätt.

We’ve collected the goods — AI prompts, exclusive deals, and a library of resources for product leaders. Unlock your account for access.

Värmekartor hjälper dig att identifiera användarnas avsikt

Moderna webbanalysverktyg (t.ex. Google Analytics eller Amplitude) är utmärkta på att spåra och visualisera webbplatsbesökarnas beteende och demografiska data (jag fortsätter att nämna webben, men värmekartor är lika användbara för mobila enheter och mobilappar). Deras främsta problem är dock att data de samlar in är alltför ”kvantitativa” och saknar det ”kvalitativa” perspektivet på varför användare beter sig på ett visst sätt.

Om 2 000 användare registrerar sig för din produkt varje dag, men bara 100 laddar ner och installerar din app, kan du med säkerhet säga att det är något fel på din aktivering. Men du kommer inte att kunna hitta det exakta problemet eller förstå varför människor inte lyckas installera din app.

Om du däremot använde ett värmekartsverktyg skulle du kunna granska din karta över frustrerade klick och se att nedladdningsknappen inte fungerar i vissa webbläsare, vilket gör att människor blir frustrerade och klickar upprepade gånger på den.

Det här är ytterligare en av värmekartors bästa funktioner – de kan komplettera dina kvantitativa data med kvalitativa insikter.

Värmekartor är kostnadseffektiva alternativ till användbarhetstester

Låt mig säga det rakt. Värmekartor kan inte och bör inte ersätta användbarhetstester. Användbarhetstester är mycket värdefulla för ditt produkt- och designarbete, och du bör aldrig överväga att överge dem.

Värmekartor kommer däremot att spara tid och arbete när du genomför användbarhetstester av grundläggande sidelement och användarresor. Om du till exempel testar något så enkelt som en inloggningssida behöver du egentligen inte organisera en användbarhetstestsession.

skärmbild av inloggningssida

Allt dina användare gör på en inloggningssida är att fylla i sina inloggningsuppgifter och klicka på en av de CTA-knappar för inloggning som finns på sidan. Genom att titta på värmekartdata kan du enkelt se hur användarna interagerar med fälten för e-postadress och lösenord samt knapparna. Att genomföra användbarhetstester och granska sessionsinspelningen för något sådant här skulle vara slöseri.

Vilka begränsningar har värmekartor för webbplatser?

Värmekartor verkar vara fantastiska verktyg för att kostnadseffektivt visualisera användarnas beteende och avsikter. Men precis som alla andra verktyg är de inte felfria och har ett par begränsningar som du behöver ta hänsyn till när du använder ett värmekartverktyg.

Här är områden där värmekartor inte riktigt räcker till:

Kvalitativa insikter är begränsade i värmekartor

Jag nämnde förekomsten av kvalitativa insikter som en stor fördel med värmekartor. Men jag måste vara rättvis och nämna att dessa insikter är begränsade.

Ja, du kan enkelt upptäcka ilskna klick på en sida, och du kan använda rörelsekartan för att se hur användarnas markörer rör sig över gränssnittet. Ja, dessa data hjälper dig att förstå dina användares övergripande avsikter och känslor.

Du kan däremot inte få fram något mer än de nämnda ”övergripande avsikterna” med värmekartor.

När du till exempel granskar en värmekarta över din inloggningssida kan du se att majoriteten av användarna registrerar sig genom att manuellt fylla i fältet för e-postadress, och att mycket få av dem använder alternativet ”Logga in med Google”.

Din värmekarta kan inte berätta orsaken bakom detta beteende. För att gå djupare i något sådant behöver du genomföra användarintervjuer, genomföra enkäter eller hitta något annat sätt att samla in meningsfull användarfeedback.

I det här specifika fallet skulle du till exempel kunna prata med några av dina användare och upptäcka att dina användare huvudsakligen finns inom företagssegmentet och att de flesta använder Outlook-e-post i stället för Googles G-Suite. Eftersom du inte har något alternativ för ”Logga in med Microsoft” tenderar dessa användare att lägga till sina e-postadresser manuellt i stället.

För stort fokus på grundläggande typer av engagemang

En annan nackdel med värmekartor är att de bara registrerar din scrollning, markörrörelse och klickbeteende. Det innebär att du kan få missvisande information om du enbart förlitar dig på dina värmekartor för att analysera användarnas beteende, eftersom snygga värmekartdata (t.ex. många klick) inte alltid betyder ”bra” engagemang.

Låt mig säga det igen.

Snygga värmekartdata betyder inte alltid bra engagemang.

Föreställ dig att du tittar på en värmekarta över dokumentsidan i Google Docs-redigeraren och ser att många klickar på delningsknappen. Du drar då (naivt) slutsatsen att din delningsfunktion fungerar bra.

Men anta att du kontrollerar dina andra analysverktyg för webbplatsen och upptäcker att även om användarna klickar på delningsknappen för att öppna delningspopupen, är det mycket få av dem som faktiskt delar sina dokument med någon annan. Majoriteten av användarna stänger helt enkelt delningspopupen direkt efter att de har öppnat den.

Integritetsfrågor

Värmekartverktyg är ökända för att aktivt spåra och lagra känsliga användardata. Det går inte att komma runt detta; du måste hålla reda på användarnas musrörelser och klick för att kunna skapa en värmekarta.

När du integrerar en värmekartlösning (särskilt om den har realtidsanalys, sessionsuppspelning och sidvisningar) behöver du därför ha detta i åtanke och känna dig trygg med att dina användare inte blir irriterade på dig för att du spårar deras surfbeteende.

En annan sak du behöver tänka på är att följa lagstiftningen. Du behöver samarbeta nära med dina juridik- och säkerhetsteam för att ta fram rätt juridiska dokument och säkerställa att dina spårningsmetoder inte kränker någons rättigheter eller skapar juridiska risker för företaget.

Detta är särskilt viktigt om du hävdar att du följer större integritetsförordningar som GDPR, CalOPPA med flera.

Det var grunderna i att använda värmekartor för analys, tillsammans med deras fördelar och nackdelar. Nu går vi vidare och upptäcker hur du kan använda detta verktyg för att analysera dina kunders beteende och dra värdefulla slutsatser.

3 verkliga användningsområden för värmekartanalys

Utifrån min erfarenhet har värmekartor visat sig vara mycket värdefulla verktyg för att förstå vad som händer med din produkt.

Med tanke på det här verktygets fördelar och begränsningar tittar jag nästan aldrig på heatmapdata isolerat. I stället kombinerar mitt team och jag vanligtvis dessa data med data från andra analysverktyg för att få en mer heltäckande överblick över vår produkt och våra användare.

För att hjälpa dig med praktiska tillämpningar av heatmapping vill jag dela med mig av ett par verkliga användningsfall.

1. Att avkoda ilskna klick: A/B-testning med Fullstorys kartor över ilskna klick och Google Optimize

Jag börjar med ett analysanvändningsfall som omfattar min favorittyp av heatmaps – kartor över ilskna klick.

Du kan betrakta en användares klick på ditt användargränssnitt som ett ”ilskt klick” om hen klickar flera gånger på samma element i följd. Det antas allmänt att den här typen av beteende indikerar frustration och ilska hos användaren (därav namnet).

Det finns många anledningar till att du kan få användare som klickar ilsket. Oftast utlöses det av:

  • Ett element som ser klickbart ut men inte är det. Användaren klickar på det, tror att det inte fungerar och blir arg.
  • Dina knappar fungerar helt enkelt inte. Det säger sig självt.
  • Knapparna fungerar, men ett designproblem gör en eller flera av knapparna svåra att träffa.

Med hjälp av kartor över ilskna klick kan du identifiera elementen i ditt användargränssnitt som får ilskna klick, försöka förstå orsaken bakom dem och åtgärda problemet. Så här kan det se ut för en e-handelswebbplats som säljer frukt och grönsaker.

skärmbild av e-handelswebbplats som säljer frukt och grönsaker
Källa: Fullstory

Problemet med att hitta problemområden och åtgärda dem är att din lösning kanske inte fungerar, och att människor fortfarande kan fortsätta klicka ilsket. För att lösa detta kan du använda valfritt A/B-testverktyg (t.ex. Google Optimize) för att testa hur effektiv din lösning är.

Så här gör du: Skapa ett A/B-test där variant A är din lösning och variant B är det ursprungliga tillståndet. När du har aktiverat A/B-testet börjar du titta på kartorna över ilskna klick för båda varianterna och beräkna antalet ilskna klick som varje variant får.

Om variant A har fått färre klick har din lösning fungerat, och du kan tryggt lansera den.

2. Att avmystifiera konverteringsgrader: Optimering av konverteringsgrad med Hotjars rörelsekartor och Google Analytics

Nästa exempel vi ska titta på är förmodligen det allra populäraste användningsfallet för heatmaps – att analysera konvertering (eller andra liknande mätvärden).

Som jag nämnde kommer en kombination av data från heatmaps och analysverktyg att ge dig bäst resultat när det gäller att få korrekta data och undvika missvisande slutsatser. I det här specifika exemplet ska vi se hur du kan använda en kombination av Google Analytics och Hotjars rörelsekartor.

Suren Karapetyan

Anteckning

Rörelsekartor visar var på sidan användarens markör har rört sig och stannat under sessionen.

Föreställ dig att du ansvarar för en e-handelsbutik som erbjuder två fraktalternativ för att leverera köp till kunder. Priset för dessa två alternativ är $2 för ”Standard” (även kallad ”långsam”) frakt och $10 för ”Express”-frakt.

Ditt mål i det här hypotetiska exemplet är att analysera konverteringsgraden för det billiga och det dyra fraktalternativet.

Så här gör du: Börja med att titta på konverteringsgraden i Google Analytics för det dyra alternativet. Låt oss anta att graden är 5 % (eller att bara 1 av 20 användare väljer det dyrare alternativet). Det här är verkligen dåliga nyheter för dig, så nu behöver du förstå orsaken till den låga graden.

För att göra det vill du öppna rörelsekartan för kassasidan (där användaren väljer fraktalternativ). Föreställ dig att rörelsekartan visar att användarna håller markören över det dyra fraktalternativet, klickar på texten där det står ”Expressfrakt” (i stället för knappen ”Välj” precis under), ger upp och går vidare med det billigare alternativet (som är valt som standard).

Det här beteendet visar några möjliga hypoteser:

  1. Dina användare vill faktiskt läsa mer om det dyra alternativet innan de väljer det, eftersom de inte riktigt förstår vilket extra värde eller vilken extra fördel de får genom att välja det.
  2. Knappen ”Välj” är inte tillräckligt synlig – kanske är den dold under den synliga delen av sidan för majoriteten av användarna.

Vi kan sedan genomföra 1–2 korta intervjuer med användare och kontrollera om våra hypoteser stämmer eller om problemet är något helt annat.

3. Kapplöpning mot botten: Optimering av FAQ-sektionens prestanda med rullningskartor

FAQ-avsnitt är kraftigt underskattade verktyg i produktledningens värld.

FAQ:er är fantastiska verktyg för produktchefer. Ett av de bästa användningsområdena för att lägga till ett FAQ-avsnitt i din produkt eller på din webbplats är att konvertera potentiella kunder som är redo att köpa din produkt, men som först behöver få svar på ett par frågor som oroar dem innan de genomför köpet.

Med tanke på värdet du får från ditt FAQ-avsnitt är det ganska viktigt att följa dess resultat och optimera det.

Så här gör du: Vanligtvis placerar vi FAQ:er längst ner på en webbsida – men det finns en betydande risk att dina användare inte scrollar så långt och missar avsnittet. För att mäta detta kan du använda scrollvärmekartor, som visar hur mycket tid användarna har tillbringat i varje avsnitt på sidan och hur långt ner på sidan de har scrollat.

Så här ser det ut:

skärmbild från Hotjar av FAQ:er
Källa: Hotjar

I det här specifika exemplet kan vi se att majoriteten av användarna har sett sidans övre del (den är röd), men endast 44 % har scrollat tillräckligt långt för att se FAQ-avsnittet (det är blått och har en procentsymbol på sig).

Ärligt talat är 44 % ett bra resultat. Men om du tycker att fler personer borde se dina FAQ:er skulle jag föreslå att du letar efter en UX-lösning som gör det möjligt för dem att "hoppa" direkt till FAQ-avsnittet.

Vill du se fler verkliga exempel på värmekartor i praktiken? Den här artikeln visar hur varumärken använder visuella beteendedata för att fatta smartare UX-beslut.

Visualiserad data är bra, men att kombinera den med din produktintuition är ännu bättre.

Värmekartor, tillsammans med andra analysverktyg, kommer att förbättra kvaliteten på de beslut du fattar avsevärt – det är det som gör dig till en datadriven PM!

Men om jag får lämna dig med ett enda råd är det detta:

Förlita dig inte enbart på analysdata – lyssna på ditt hjärta också.

Som produktchefer har vi denna superkraft som kallas produktintuition, vilken hjälper oss att fatta smarta beslut även när vi endast har begränsad analysdata till hands. Så om du kombinerar din intuition med lärdomarna du får från dina värmekartor kan du ta dina färdigheter i beslutsfattande till en helt ny nivå.

En annan superkraft som produktchefer har är den ständiga hungern efter att lära sig något nytt – och vi kan hjälpa till med det! Anmäl dig till vårt nyhetsbrev för att få en samling insikter, resurser och annat nyttigt inom produktledning varannan vecka, direkt till din inkorg.