熱圖分析，就像一群人通過(guò)一塊草地去各個(gè)目的地，走的人多的地方就成了路，走的人少的地方則還維持原樣，而通過(guò)高空俯視草地，我們就能清晰地了解用戶的行為軌跡。

作為產(chǎn)品或者運(yùn)營(yíng)，我們幾乎每天都會(huì)重復(fù)同一件事，說(shuō)服老板/開(kāi)發(fā)/設(shè)計(jì)/市場(chǎng)同意我們的建議或者方案。他們往往會(huì)用懷疑的口吻說(shuō)出這些話：

• 為什么要這樣做
• 你這樣做影響用戶體驗(yàn)
• 對(duì)手A為什么不這樣做
• ……

千言萬(wàn)語(yǔ)，其實(shí)說(shuō)的都是同一件事：你如何證明你是對(duì)的？

想必大家或多或少都會(huì)有這樣的苦惱，說(shuō)話的對(duì)象邏輯性欠佳，不僅無(wú)法理解你的話，還會(huì)用他的偏見(jiàn)駁斥你。而這個(gè)系列的文章，就是借助數(shù)據(jù)分析工具，讓數(shù)據(jù)來(lái)表達(dá)你的想法，即使是思路混亂的人，也能很快理解你的核心觀點(diǎn)。

先說(shuō)說(shuō)我所選擇數(shù)據(jù)分析工具的特點(diǎn)：

• 可視化，讓人能夠直觀地看到問(wèn)題
• 洞察性，能夠給出問(wèn)題產(chǎn)生的原因
• 組合性，這些工具能夠組合使用，形成完整的數(shù)據(jù)閉環(huán)

這個(gè)是系列文章，會(huì)分為7篇來(lái)講述，本篇是系列的第1篇：熱圖分析。

YouTube：75%的觀眾在360度視頻中只看正前方

作為全球最大的360和VR視頻內(nèi)容平臺(tái)，YouTube最近推出了熱圖分析功能。即通過(guò)對(duì)用戶在360度視頻中視線焦點(diǎn)聚集區(qū)域的數(shù)據(jù)收集整理，來(lái)分析在一個(gè)可自由觀看的媒介中，觀眾的視線更多聚焦在哪些位置。分析結(jié)果如圖所示：

75%的觀眾在觀看360度視頻時(shí)，視線只集中在90度的視域里，基本就是直視正前方。這個(gè)結(jié)果讓苦心孤詣制作360視頻的創(chuàng)作者感到沮喪，費(fèi)了半天勁前后左右給你們找“戲”，又是視線啟動(dòng)又是全方位照顧死角……原來(lái)你們還是跟看平面畫(huà)面一樣只盯著正前方。

人類在2D維度的娛樂(lè)習(xí)慣是長(zhǎng)期養(yǎng)成的，如果不徹底更改娛樂(lè)的交互方式，人們還是會(huì)把目光依舊停留在舒適又省心的正前方屏幕上。

利用熱圖分析，YouTube成功證明被認(rèn)為是未來(lái)視頻風(fēng)口的360度視頻也許并不如想的那么美好。那么，什么是熱圖分析？

熱圖分析：畫(huà)出用戶的行為

熱圖分析，就像一群人通過(guò)一塊草地去各個(gè)目的地，走的人多的地方就成了路，走的人少的地方則還維持原樣，而通過(guò)高空俯視草地，我們就能清晰地了解用戶的行為軌跡。由此引出熱圖定義：

熱圖分析：通過(guò)記錄用戶的鼠標(biāo)行為，并以直觀的效果呈現(xiàn)，從而幫助使用者優(yōu)化網(wǎng)站布局。

一般來(lái)說(shuō)，鼠標(biāo)行為可以分為3種：點(diǎn)擊、移動(dòng)、滾動(dòng)。根據(jù)這3種行為，再結(jié)合頁(yè)面元素能否交互，就形成了4種熱圖：

• Mouse Move Heatmap（鼠標(biāo)移動(dòng)熱圖）
• Mouse Click Heatmap（鼠標(biāo)點(diǎn)擊熱圖）
• Mouse Scroll Heatmap（鼠標(biāo)滾動(dòng)熱圖）
• Link Heatmap（鏈接熱圖）

鼠標(biāo)移動(dòng)熱圖

這種熱圖記錄用戶鼠標(biāo)移動(dòng)、停留和徘徊等行為，熱圖多為軌跡形式。示例如下：

這種熱圖，能夠清晰呈現(xiàn)用戶最感興趣的頁(yè)面區(qū)域和元素，并能直觀反應(yīng)影響用戶行為的元素。為了說(shuō)明用法，舉個(gè)例子：

最近小及的汽車(chē)網(wǎng)站推出一項(xiàng)購(gòu)車(chē)送保險(xiǎn)的活動(dòng)，然而參與活動(dòng)的人寥寥無(wú)幾。通過(guò)鼠標(biāo)移動(dòng)熱圖分析，他發(fā)現(xiàn)購(gòu)車(chē)送保險(xiǎn)的內(nèi)容區(qū)域熱度很低，導(dǎo)致這種現(xiàn)象的可能原因如下：

1. 用戶根本沒(méi)有注意到這塊內(nèi)容
2. 用戶對(duì)送的保險(xiǎn)沒(méi)有興趣

再觀察整個(gè)熱圖，小及發(fā)現(xiàn)相鄰區(qū)域的熱度也很低，這說(shuō)明用戶根本沒(méi)有注意到該區(qū)域。于是，小及將購(gòu)車(chē)送保險(xiǎn)活動(dòng)置換到熱圖較高區(qū)域，成功解決了該問(wèn)題。

鼠標(biāo)點(diǎn)擊熱圖

這種熱圖記錄用戶的點(diǎn)擊行為，示例如下：

這種熱圖，能夠最直接地反應(yīng)用戶的內(nèi)心想法，洞察用戶與頁(yè)面的交互行為。用戶為什么沒(méi)有點(diǎn)擊我們期待他們點(diǎn)擊的地方。如果你是產(chǎn)品經(jīng)理或者交互設(shè)計(jì)師，你是不是經(jīng)常會(huì)想，用戶會(huì)不會(huì)點(diǎn)擊一些沒(méi)有鏈接的圖片？事實(shí)上，用戶很有可能就因?yàn)槟承╉?yè)面元素?zé)o法點(diǎn)擊而感受挫敗，甚至直接離開(kāi)。

使用點(diǎn)擊熱圖，能幫你迅速定位這些鏈接“死角”。而你需要做的，是把“死角”鏈接到相應(yīng)的內(nèi)容或頁(yè)面上。如果你不希望讓用戶跳轉(zhuǎn)到其他站內(nèi)的頁(yè)面的話，可以選擇彈窗的方式進(jìn)一步展示更多的相關(guān)內(nèi)容。嘗試一下，跳出率會(huì)大幅降低的。

鼠標(biāo)滾動(dòng)熱圖（又名注意力熱圖）

鼠標(biāo)滾動(dòng)熱圖，用于監(jiān)測(cè)用戶在頁(yè)面不同區(qū)域停留的時(shí)間，反映用戶對(duì)內(nèi)容的關(guān)注程度。在頁(yè)面布局優(yōu)化中會(huì)經(jīng)常使用到這個(gè)功能。示例如下：

大家應(yīng)該都有注意到上圖中有1條線標(biāo)有標(biāo)有XX百分比，這個(gè)是瀏覽觸達(dá)率，是告訴我們有多少比例的用戶看到了該區(qū)域，反過(guò)來(lái)也就是告訴我們其他用戶還沒(méi)到這，就已經(jīng)去往其他地方了。

所以，如果你有很精彩的內(nèi)容放在頁(yè)面底部，那么它也許根本沒(méi)有貢獻(xiàn)任何價(jià)值。通過(guò)鼠標(biāo)滾動(dòng)熱圖，你能發(fā)現(xiàn)用戶是從哪里開(kāi)始喪失興趣的，以及那塊區(qū)域放置的內(nèi)容能帶來(lái)最多的潛在響應(yīng)。

鏈接熱圖

鏈接熱圖，記錄用戶在網(wǎng)頁(yè)內(nèi)容上的點(diǎn)擊，自動(dòng)過(guò)濾掉頁(yè)面空白處（沒(méi)有內(nèi)容和鏈接）的無(wú)效點(diǎn)擊。相比點(diǎn)擊熱圖，更強(qiáng)調(diào)突出用戶對(duì)當(dāng)前元素內(nèi)容的興趣。

還有一個(gè)比較有意思的方法是通過(guò)過(guò)濾來(lái)對(duì)比。舉個(gè)例子，一個(gè)電商網(wǎng)站，如果把男性和女性進(jìn)行細(xì)分，來(lái)對(duì)比他們?cè)陔娚虒?dǎo)航上的差異。很明顯女性對(duì)“服裝”、“化妝品”等信息的點(diǎn)擊比例明顯偏大，而男性對(duì)“數(shù)碼產(chǎn)品”等信息的點(diǎn)擊比例偏大。

以上只是一個(gè)最簡(jiǎn)單基礎(chǔ)的應(yīng)用，但說(shuō)明了一個(gè)數(shù)據(jù)分析最常用的手段，也就是對(duì)比。而對(duì)比衍生出來(lái)的數(shù)據(jù)分析工具就是AB測(cè)試，而這也會(huì)是該系列的一篇文章。

熱圖分析工具：欲善其事，必利其器

這里收集了很多非常好的工具，通過(guò)不同的方法追蹤用戶的行為并提供給你改進(jìn)網(wǎng)站可用性的建議。它們中有些可能不是免費(fèi)的，但一個(gè)好的回報(bào)是值得去付出的。

1. CrazyEgg

CrazyEgg可以相當(dāng)準(zhǔn)確地監(jiān)控所有頁(yè)面的點(diǎn)擊位置，并提供了heatmap、scrollup、confetti、overlay等4種形式的熱圖。

2. Clicktale

clicktale它是對(duì)你的網(wǎng)站訪客瀏覽行為進(jìn)行分析的一個(gè)工具，以類似視頻的方式將訪問(wèn)者在你的網(wǎng)站上進(jìn)行的操作全部記錄下來(lái)，你可以在線觀看也可以下載到電腦上。利用ClickTale的訪客行為視頻記錄，可以幫你更好的布局你的網(wǎng)頁(yè)，給訪問(wèn)者帶來(lái)更好的用戶體驗(yàn)進(jìn)而提升轉(zhuǎn)化率。

3. Mouseflow

mouseflow通過(guò)視頻記錄和分析用戶的點(diǎn)擊和滾動(dòng)行為，生成鼠標(biāo)點(diǎn)擊和移動(dòng)熱圖，幫助你優(yōu)化目標(biāo)頁(yè)面和提高轉(zhuǎn)化率。

4. Google analysis

GA可以說(shuō)是世界上目前最為強(qiáng)大的分析工具，在它內(nèi)容概述頁(yè)面的右下角有“網(wǎng)頁(yè)詳情分析”（In-Page Analytics），可以顯示頁(yè)面的熱圖分析。但是此圖是由用戶的訪問(wèn)路徑計(jì)算得到的，有一定局限性。

歡迎關(guān)注我的數(shù)據(jù)分析工具系列，我會(huì)講述如何改善用戶體驗(yàn)，提升轉(zhuǎn)化，幫助你更好地運(yùn)用數(shù)據(jù)驅(qū)動(dòng)網(wǎng)站運(yùn)營(yíng)。

作者：曹思龍，微信公眾號(hào)：及策云課堂。Admaster產(chǎn)品經(jīng)理，畢業(yè)于北京郵電大學(xué)，知乎專欄作者

本文由 @曹思龍 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。