Key Takeaways
Katso, mitä käyttäjät todella tekevät, älä vain sitä, mitä he sanovat: Kyselyt ja analytiikka kertovat vain osan tarinasta. Hiiren lämpökartat paljastavat, missä käyttäjät epäröivät, kamppailevat tai osallistuvat eniten – ja auttavat sinua tekemään dataperustaisia päätöksiä luottavaisin mielin.
Priorisoi korjaukset ja ominaisuudet, joilla on todella merkitystä: Sen sijaan että arvailisit, mitä seuraavaksi pitäisi työstää, lämpökartat korostavat, missä käyttäjät viettävät aikaa (tai turhautuvat), ja antavat sinulle selkeän suunnan siitä, mihin on kiinnitettävä huomiota ensin.
Selvitä, miksi käyttäjät poistuvat – ja korjaa ongelma: Kaikki poistumiset eivät johdu samoista syistä. Lämpökartat osoittavat, jäävätkö käyttäjiltä tärkeät toimintakehotteet huomaamatta, onko lomakekenttien täyttäminen vaikeaa tai aiheuttaako jokin hämmennystä – jotta voit poistaa esteet ennen kuin he lähtevät.
Paikanna aktivointisuppilosi piilevä kitka: Napsauttavatko käyttäjät kohtia, joita ei pitäisi napsauttaa? Jäävätkö he jumiin tärkeissä vaiheissa? Lämpökartat paljastavat pullonkaulat, jotta voit sujuvoittaa käyttäjäpolkua ja kasvattaa konversioita.
Luultavasti tuotepäällikön työn kiinnostavin ja palkitsevin osa on oppia ymmärtämään, miten käyttäjät ajattelevat ja toimivat käyttäessään tuotteita.
Tätä varten teemme yleensä käyttäjähaastatteluja, toteutamme kyselyitä ja analysoimme dataamme. Tuotepäällikön työkalupakissa on kuitenkin vielä yksi arvokas työkalu, joka voi auttaa sinua eläytymään käyttäjiesi tilanteeseen – hiiren lämpökartat!
Tänään haluan käydä läpi hiiren lämpökarttojen käytännön käyttötapauksia ja tehokkaita tapoja hyödyntää niitä tuotteesi parantamiseen.
Mitä hiiren lämpökartat ovat ja miten ne toimivat?
Hiiren lämpökartta (eli huomion lämpökartta) on tuoteanalytiikkatyökalu, joka havainnollistaa, miten käyttäjät ovat vuorovaikutuksessa käyttöliittymäsi kanssa hiiren liikkeiden avulla. Se luo käyttöliittymäsi kuvakaappauksen päälle visuaalisen peittokuvan – yleensä väriliukumia käyttäen – näyttääkseen, missä käyttäjät vievät hiiren osoittimen, liikuttavat sitä ja napsauttavat useimmin.
Tämä voi auttaa sinua tunnistamaan, mitkä elementit kiinnittävät huomiota, missä käyttäjät saattavat epäröidä ja mitkä kohdat jätetään kokonaan huomiotta. Hiiren lämpökartat ovat erityisen hyödyllisiä, kun niitä käytetään yhdessä muiden lämpökarttatyyppien kanssa, kuten vierityslämpökarttojen, jotka tallentavat, kuinka alas sivulla käyttäjät vierittävät.
Yhdessä käytettyinä nämä työkalut antavat kattavamman kuvan käyttäjien sitoutumisesta – mitä he näkevät, mitä he ohittavat ja minne heidän huomionsa luonnostaan suuntautuu.

Tuotepäälliköt ja UX-suunnittelijat käyttävät yleisesti erityyppisiä lämpökarttoja saadakseen tietoa käyttäjiensä toiminnasta. Näitä ovat esimerkiksi vierityskartat, napsautuskartat, käyttäjien huomiokartat, silmänliikkeiden seurantaan perustuvat lämpökartat ja monet muut lämpökarttaesimerkit. Jokainen tyyppi voi tarjota erityisiä oivalluksia, joiden avulla voit parantaa käyttäjien pysyvyyttä ja sitoutumista, mutta tänään haluan perehtyä perusteellisesti yhteen tiettyyn tyyppiin – hiiren lämpökarttaan.
Hiiren lämpökarttaa voisi kutsua ”koosteeksi”, sillä se sisältää yhdistettyä dataa useista erilaisista käyttäjien vuorovaikutustyypeistä: napsautuskäyttäytymisestä, vierityskäyttäytymisestä ja hiiren liikekäyttäytymisestä.
Hiiren lämpökartat ovat visuaalisen tuoteanalytiikan maailmassa suhteellisen uusia, koska näiden kolmen erityyppisen käyttäytymisen datan yhdistäminen yhdeksi visuaaliseksi esitykseksi on vaikea tehtävä. Analytiikkatyökalut pystyivät tähän vasta tekoälymallien yleistyttyä.
Hiiren seurannan avulla tapahtuvan tuotteen optimoinnin käytännön käyttötapauksia
Kun olemme nyt muodostaneet yleiskuvan siitä, mitä nämä lämpökartat ovat, perehdytään useisiin käytännön käyttötapauksiin, joissa voit tehdä jotain arvokasta tuotteesi hyväksi tarkastelemalla ja analysoimalla hiiren lämpökarttojasi.
Miten tuotepäälliköt käyttävät hiiren lämpökarttoja
Vaikka käyttäjien vuorovaikutuksen analysointi saattaa vaikuttaa enemmän UX-suunnittelijoiden tarpeisiin sopivalta tehtävältä, tuotepäälliköt voivat käyttää hiiren lämpökarttoja myös omien ongelmiensa ratkaisemiseen. Tässä on joitakin tapoja, joilla olen käyttänyt tätä työkalua tuotteideni parantamiseen.
Have an account? Log In
#1: Aktivointisuppilon pullonkaulojen löytäminen
Aktivointihaasteiden ratkaisemisesta saamani kokemuksen perusteella suppilon optimointi on yksi tuotepäällikön monimutkaisimmista mutta vaikutuksiltaan merkittävimmistä vastuista. Jo melko vaatimaton 10 prosentin parannus aktivoinnissa voi aiheuttaa ketjureaktion koko suppilossa ja kasvattaa merkittävästi ilmaiskäyttäjistä maksaviksi käyttäjiksi muuttuvien määrää.
Aktivointi ei kuitenkaan ole vain numeroihin perustuva peli – se on pulma, joka edellyttää syvällistä käyttäjien toimintaan liittyvää ymmärrystä, iteratiivista kokeilua ja halua kyseenalaistaa oletukset siitä, miten käyttäjät ovat vuorovaikutuksessa tuotteesi kanssa. Tärkeää ei ole vain saada yhä useampia käyttäjiä etenemään suppilossa, vaan todella ymmärtää, miksi he putoavat siitä pois alun perin.
Tätä varten tuotepäällikkö käyttää käytännössä kaikkia työkalupakkinsa työkaluja, kuten analytiikkaa ja kyselyitä. Myös hiirikartat kuuluvat näihin työkaluihin. Tässä on yksi monista tavoista, joilla ne voivat auttaa parantamaan aktivointia.
Kuvitellaan, että työskentelet Atlassianilla ja olet asettanut neljännesvuositavoitteeksi Jira Cloudin käyttöönottoprosentin parantamisen.
Tarkastelemalla aktivointisuppiloa analytiikkatyökalusi avulla huomaat, että käyttäjien kirjoittaessa Jira-instanssinsa nimeä ja luodessa Atlassian-verkkosivustoaan tapahtuu merkittävä pudotus.
Ymmärtääksesi, mitä on tapahtunut, voit avata lämpökarttatyökalusi ja tarkastella hiiren lämpökarttaa. Näet, että käyttäjät viettävät sivulla paljon aikaa ja napsauttavat aktiivisesti sivuston nimikenttää sekä ”Aloita Jirassa” -kenttää.
Tämä ei ole normaalia käyttäytymistä, sillä haluat ihmisten napsauttavan kutakin kenttää vain kerran ja viettävän tällä sivulla enintään 10–15 sekuntia. Käynnistät selvityksen ja pyydät laadunvarmistustiimiäsi tarkistamaan, mistä on kyse.
Tiimisi selvittää, että tietyn käyttäjäryhmän kohdalla sivuston nimen tarkistin (joka tarkistaa, onko nimi jo käytössä) antaa virheilmoituksen riippumatta siitä, mitä käyttäjä kirjoittaa.

Syynä on se, että näkymätön Google reCAPTCHA pitää näitä käyttäjiä botteina. Korjataksesi tilanteen keskustelet tietoturvatiimisi kanssa, huomaat, että reCAPTCHA:n tietoturvakynnys on korkeampi kuin tarvitsette, ja lasket sitä.
Tämän ansiosta vapautat käyttäjäsi, annat heidän luoda sivustonsa ja parannat merkittävästi aktivointiastettasi.
#2: Ominaisuuksien priorisoinnin tukeminen
Ominaisuuksien priorisoinnissa tärkein huomioon ottamasi tekijä on kyseisen ominaisuuden vaikutus käyttäjiisi. Mittaat tätä vaikutusta datan, käyttäjien tarpeita koskevan tietämyksesi (kyselyiden ja haastatteluiden perusteella), intuitiosi sekä sen perusteella, miten käyttäjät ovat vuorovaikutuksessa käyttöliittymäsi kanssa.
Jälkimmäisessä hiiren lämpökartat ovat avuksi.
Palataan Jira-esimerkkiimme. Oletetaan, että haluat parantaa tapaa, jolla ihmiset järjestävät backlogia, ja että tätä varten on yli 20 ominaisuusideaa. Priorisoidaksesi ne käyttäjien tarpeiden perusteella tarkastelet backlog-sivun lämpökarttaa. Tarkastelun jälkeen huomaat, että pikasuodattimien osiossa on paljon toimintaa.

Siirryt siis analytiikkatyökaluusi ja haet jakaumakaavion pikasuodattimista, joita käyttäjäsi ovat käyttäneet useimmin. Tarkastelemalla näitä tietoja huomaat, että noin 50 % kaikista Jira-käyttäjistä luo pikasuodattimen, joka näyttää tehtävät ”Tehtävätila”-tilassa.
Tässä tapauksessa hyvä tapa parantaa käyttäjien kokemusta olisi lisätä oma suodatinpainike tiloja varten. Oletetaan, että tämä ominaisuusidea oli jo parannuslistallasi, joten hyödynnät tätä tietoa antaaksesi sille korkeamman prioriteetin ja siirrät sen tiimisi backlogin kärkeen.
#3: Konversioasteen optimointi
Monimutkaisuudeltaan konversioasteen (CR) optimointi voi helposti kilpailla aktivointisuppiloiden kanssa. Olen käyttänyt kuukausia tuotteideni CR:n ja vastaavien mittareiden analysointiin, lisännyt ominaisuuksia niiden parantamiseksi, huomannut, etteivät ne toimi, lisännyt jotain muuta ja toistanut tätä sykliä, kunnes rakensin jotain, mikä todella kasvatti konversioastetta.
Aivan kuten aktivoinnissa, hiiren lämpökartat ovat tehokas työkalu tuotteidesi konversiohaasteiden analysointiin.
Useimmissa tapauksissa tämän työkalun tärkein hyöty on tunnistaa tilanteet, joissa ihmiset napsauttavat vääriä toimintakehotuksia ja jättävät huomiotta ne, jotka johtavat konversioon. Havainnollistan tätä kaupallisten keittiölaitteiden myymälän tuotesivulla.

Kuvitellaan, että tarkastelemme tämän verkkosivun lämpökarttaa. Todennäköisesti näemme, että tietty määrä ihmisiä napsauttaa pääasiallisen toimintakehotuksen (katso tuote) yläpuolella olevaa ”Keskustele nyt” -painiketta. Ymmärrän, että yritys on lisännyt sen vakuuttaakseen käyttäjilleen, että sen tuotteet ovat markkinoiden edullisimpia.
Ongelma on kuitenkin se, että ”Keskustele nyt” -painikkeen napsauttaminen katkaisee tuotetta tarkastelevien ja sitä ostavien käyttäjien etenemisen – mikä laskee konversioastetta merkittävästi.
Ehdotukseni olisi siirtää tämä viesti ja toimintakehotus vähemmän näkyvälle osalle sivua, jotta käyttäjien eteneminen ei katkeaisi.
#5: A/B-testaus ominaisuuksien validoimiseksi
Toinen hyödyllinen hiiren lämpökarttojen käyttötapa on ominaisuuksien validointi A/B-testauksen avulla. Tässä lämpökartat voivat toimia arvokkaana tietolähteenä, sillä ne näyttävät visuaalisesti, miten käyttäjien vuorovaikutus ominaisuutesi kanssa on parantunut (tai ei ole parantunut).
Tässä tapauksessa suoritat A/B-testin siten, että ominaisuus on käytössä variantissa A ja pois käytöstä variantissa B. Varmistat sitten, että lämpökarttatyökalusi seuraa käyttäjien vuorovaikutusta molemmissa varianteissa, jotta voit verrata niiden hiiren lämpökarttoja rinnakkain.
Niitä tarkastelemalla huomaat helposti muutokset käyttäjien toiminnassa ja näet, vaikuttiko uusi ominaisuutesi toivomallasi tavalla.
Esimerkki tästä olisi ”Lataa kaikki” -painikkeen lisääminen pilvitallennustuotteesi tiedostoselaimen sivulle. Jos ihmiset alkavat käyttää painiketta aktiivisesti sen sijaan, että he lataisivat jokaisen tallennustilassaan olevan tiedoston manuaalisesti, uusi ominaisuutesi on onnistunut.
Miten UX-suunnittelijat käyttävät hiirikarttoja
Lämpökartat ovat erinomainen työkalu käyttäjien vuorovaikutuksen tutkimiseen. Siksi pidän niitä yhtenä UX-suunnittelijoiden työkalupakin välttämättömistä työkaluista. Tässä on muutamia tapoja, joilla UX-tiimini on käyttänyt hiirikarttoja suunnittelun parantamiseen.
#6: Lomakkeiden täyttöasteen parantaminen
Riippumatta siitä, millainen tuotteesi on, sinulla on todennäköisesti vähintään yksi lomake aktivointi- tai kaupallistamisputkessasi. Kokemukseni perusteella menetät todennäköisesti ihmisiä ja konversioita juuri siinä putken vaiheessa, jossa he täyttävät tämän lomakkeen.
Menetät heidät todennäköisesti heikon käyttäjäkokemuksen vuoksi, mikä saa heidät tylsistymään tai turhautumaan. Selvittääkseen, tapahtuuko näin lomakkeesi kohdalla, ja korjatakseen tilanteen tuotesuunnittelijat tekevät käytettävyystestejä ja seuraavat tarkasti käyttäjiensä toimintaa. Näiden testien ongelmana on kuitenkin se, että ne kuluttavat sekä aikaa että resursseja.
Hiirikarttoihin perustuva lomakeanalytiikka voi kuitenkin tunnistaa merkittävän osan käytettävyysongelmista murto-osalla kustannuksista.
Jos esimerkiksi huomaat kassalla olevan rekisteröitymislomakkeen kohdalla suuren pudotuksen ja tarkastelet lämpökarttaa, saatat havaita, että ensimmäisissä kentissä on paljon hiiritoimintaa, mutta toiminta vähenee yhtäkkiä ”puhelinnumero”-kentän kohdalla.

Tämä saattaa tarkoittaa, etteivät ihmiset halua jakaa puhelinnumeroaan kanssasi ja että sinun kannattaa harkita vaihtoehtoista tapaa heidän tunnistamiseensa.
#7: Navigointiongelmien korjaaminen
Joskus ominaisuuksiesi tai verkkosivustosi osioiden löytämisen ja käytön väheneminen johtuu siitä, etteivät käyttäjät löydä niitä alustaltasi.
Jos olet verkkokauppa, joka on juuri aloittanut ammattilaisille tarkoitettujen urheilujalkineiden (esimerkiksi paini- ja koripallokenkien) myynnin, lisäisit luonnollisesti uuden osion nykyiseen navigointiisi ja pitäisit asiaa sillä selvänä.

Oletetaan kuitenkin, että urheilujalkineosion liikenne on paljon odotettua vähäisempää. Tarkasteltuasi hiirikarttaa saatat huomata, että vain harvat ihmiset vievät hiiren kyseisen urheiluosion päälle navigoinnissasi.
Toisaalta tämä saattaa johtua kiinnostuksen puutteesta urheilujalkineita kohtaan. Toisaalta ihmiset eivät ehkä ole huomanneet sen lisäämistä, koska navigoinnissasi oleva kenkätyyppien luettelo on melko laaja.
Vaikka osioiden pitäminen järjestyksessä onkin järkevää, uutta lisätessäsi sinun kannattaa sijoittaa se näkyvälle paikalle (ainakin aluksi). UX-suunnittelija saattaisi harkita tämän uuden osion sijoittamista suoraan ylänavigointipalkkiin. Vaihtoehtoisesti sen voisi pitää samassa paikassa, mutta lisätä siihen ”uusi”-tunnisteen huomion kiinnittämiseksi.
#8: Luettavuuden parantaminen
Tämä tapaus on erityisen relevantti blogeille ja muille pitkämuotoista sisältöä tarjoaville resursseille. Joskus tekstin suunnittelutapa vaikuttaa kielteisesti sen luettavuuteen, minkä seurauksena käyttäjät hylkäävät artikkelin.
Aiemman käyttötapauksen tavoin tämän voi diagnosoida hiirikarttojen avulla. Jos esimerkiksi tarkastelet lämpökarttaa ja huomaat ihmisten vievän kohdistimen tekstisi jokaisen rivin päälle, tekstiosio saattaa olla heille liian leveä, jotta he pystyisivät seuraamaan jokaista riviä silmillään (joten he käyttävät sen sijaan hiiren kohdistinta tähän tarkoitukseen).
Harkitsemisen arvoisia lämpökarttaohjelmistoja
Kun hiirikarttojen käytännön käyttötapaukset on käsitelty, haluan puhua hieman myös eri lämpökartta-analytiikkatuotteista, jotka tarjoavat tämän työkalun, ja näyttää, miten niiden lähestymistavat eroavat toisistaan.
Hotjar
Hotjarissa ei varsinaisesti ole hiirikarttaa. Sen sijaan se jakaa tyypillisestä hiirikartasta löytyvät tiedot erillisiksi karttatyypeiksi. Näitä ovat hiiren napsautuskartat, vierityskartat, hiiren liikkeiden lämpökartat ja turhautumisnapsautusten lämpökartat. Tältä sen liikkumiskartta näyttää.

Vaikka erilliset kartat saattavat ensisilmäyksellä vaikuttaa hankalilta, ne tarjoavat paljon parempaa ja yksityiskohtaisempaa tietoa kustakin vuorovaikutustyypistä (esimerkiksi vierittämisestä).
Lisäksi siihen kuuluu muita toimintoja, kuten reaaliaikainen verkkosivuston kävijämäärä, istuntojen toistot, sivun asettelun sitoutumisalueiden visuaalinen esitys ja paljon muuta.
Crazy Egg
Crazy Eggin avulla saat lämpökartan, joka sisältää sekä käyttäjien napsautuksiin että hiiren liikuttamiseen perustuvia tietojoukkoja. Omien algoritmiensa avulla se voi yhdistää nämä kaksi erilaista vuorovaikutustyyppiä yhdeksi kartaksi, joka näyttää käyttäjiäsi eniten kiinnostavat yleiset alueet.

Hotjariin verrattuna saat hieman vähemmän yksityiskohtaista tietoa. Tällainen yhdistetty lämpökartta on kuitenkin erittäin hyödyllinen, kun tavoitteenasi on saada yleiskuva siitä, miten ihmiset käyttävät käyttöliittymääsi, sen sijaan että tunnistaisit napsautusten, vierityssyvyyden ja muiden toimintojen tarkat sijainnit.
Hotjarin tavoin saat Crazy Eggin avulla myös istuntojen tallenteita ja muita analytiikkaominaisuuksia.
Mouseflow
Hotjarin tavoin Mouseflow tarjoaa kuusi erilaista hiiren seurannan lämpökarttatyyppiä yhden yhdistetyn kartan sijaan. Saat tavanomaiset tyypit, kuten napsautus-, hiiren päälle viemisen ja vierityksen lämpökartat.
Mouseflow sisältää kuitenkin myös erityisen lämpökarttatyypin, jota tällaisilta alustoilta löytää harvoin – maantieteellisen lämpökartan.

Käyttäjän vuorovaikutuksen visualisoinnin sijaan tämä lämpökartta näyttää maailmankartan ja korostaa maailman alueita, joilta saat eniten käyttäjiä (ja vuorovaikutusta).
More Articles
Välttämätön lisä käyttäjähaastatteluihin ja käytettävyystestaukseen
Väitän, että käyttäjähaastattelut ovat yksittäinen arvokkain tuotejohtajien tekemä toiminto. Käytettävyystestauksen tavoin ne vievät kuitenkin melko paljon aikaa.
Harkitse siis hiiren lämpökarttojen käyttöä erinomaisena (ja edullisena) vaihtoehtona saadaksesi vastauksia joihinkin helpompiin asiakkaitasi koskeviin kysymyksiin ja käyttääksesi arvokasta haastatteluaikaasi sen sijaan vaikeampiin kysymyksiin.
Etsitkö lisää tapoja kehittää tuotteitasi? Syvennä tietojasi ja taitojasi tässä kiehtovassa ammatissamme tilaamalla uutiskirjeemme. Pysyt ajan tasalla tuotehallinnan uusimmista aiheista korkeatasoisen koulutussisältömme ja ohjelmistoluetteloidemme avulla.



