關(guān)于亮家底系列：這個(gè)系列介紹平常使用起來比較趁手的工具召川，每期介紹一項(xiàng)程帕，涉及各個(gè)領(lǐng)域，不要錯(cuò)過愧哟。
對(duì)于絕大多數(shù)設(shè)計(jì)師來說骑科，數(shù)據(jù)分析屬于另外一個(gè)世界的事情橡淑，通常應(yīng)該由研究人員或者專門的數(shù)據(jù)分析師去完成。對(duì)設(shè)計(jì)效果進(jìn)行數(shù)據(jù)分析咆爽？最好提都不要提梁棠！
2017年，一項(xiàng)針對(duì)歐美設(shè)計(jì)師的調(diào)查數(shù)據(jù)顯示：73%的設(shè)計(jì)師沒有使用分析工具對(duì)設(shè)計(jì)效果進(jìn)行數(shù)據(jù)監(jiān)測(cè)和分析（報(bào)告全文：2017年度設(shè)計(jì)工具調(diào)查）伍掀。參照國(guó)內(nèi)外設(shè)計(jì)師對(duì)技術(shù)的掌握情況掰茶，國(guó)內(nèi)設(shè)計(jì)師的這個(gè)比例應(yīng)該更高。
圖1：歐美設(shè)計(jì)師使用數(shù)據(jù)分析工具的比例分布
造成這種狀況的原因蜜笤，我個(gè)人的判斷主要有兩個(gè)：
第一個(gè)，是長(zhǎng)期以來設(shè)計(jì)師缺乏利用數(shù)據(jù)分析盐碱，對(duì)自身的設(shè)計(jì)進(jìn)行評(píng)估和優(yōu)化的意識(shí)把兔。但在數(shù)字化的大趨勢(shì)下，數(shù)據(jù)驅(qū)動(dòng)的設(shè)計(jì)和優(yōu)化瓮顽，是未來的必然發(fā)展方向县好，各個(gè)職業(yè)和崗位，包括設(shè)計(jì)師也必須要具備數(shù)據(jù)分析的意識(shí)和能力暖混。
第二個(gè)缕贡，是目前的很多數(shù)據(jù)分析工具，主要針對(duì)的是專門的研究和運(yùn)營(yíng)人員拣播，功能非常強(qiáng)大晾咪。監(jiān)測(cè)的指標(biāo)非常之多，如果你覺得還不夠贮配，還能讓你自定義谍倦，同時(shí)對(duì)每一個(gè)指標(biāo)，都能提供各種維度的篩選和交叉分析泪勒。但對(duì)設(shè)計(jì)師來說昼蛀，這些使用起來太復(fù)雜，不方便圆存，不直觀叼旋，打開首頁就被嚇傻了，其中沦辙，Google Analysis就是典型代表夫植！
由于以上原因，就造成了設(shè)計(jì)師對(duì)美好設(shè)計(jì)的追求與不平衡不充分的數(shù)據(jù)分析能力之間的矛盾怕轿。于是偷崩，一位來自以色列的資深設(shè)計(jì)師——David Darmanin辟拷，自己創(chuàng)業(yè)開發(fā)了一款數(shù)據(jù)分析工具——Hotjar，它的最大特點(diǎn)就是：
簡(jiǎn)單阐斜、方便衫冻、實(shí)用！
Hotjar沒有堆砌大量的功能谒出、成堆的指標(biāo)隅俘、復(fù)雜的自定義流程。選取的都是設(shè)計(jì)師最需要笤喳、能看懂为居，所需要的自定義操作基本都在設(shè)計(jì)師能力和耐心范圍內(nèi)。
使用之后不得不說杀狡，還是只有設(shè)計(jì)師最懂設(shè)計(jì)師蒙畴。到目前為止，Hotjar是我見過的最適合設(shè)計(jì)師使用的數(shù)據(jù)分析工具呜象，下面就直接上圖說明膳凝。
第一步：創(chuàng)建項(xiàng)目
打開Hotjar官網(wǎng)（www.hotjar.com），點(diǎn)擊“TRY FOR FREE”按鈕恭陡，按照指引注冊(cè)賬號(hào)蹬音，Hotjar提供有免費(fèi)套餐，每月提供2000個(gè)pv休玩。
圖2：賬號(hào)注冊(cè)
注冊(cè)登陸后著淆，點(diǎn)擊登錄后主頁左上角的“+”，創(chuàng)建需要監(jiān)測(cè)和分析的網(wǎng)站項(xiàng)目拴疤，項(xiàng)目設(shè)置非常簡(jiǎn)單永部，輸入需要監(jiān)測(cè)的網(wǎng)址即可（如圖3）。
圖3：創(chuàng)建網(wǎng)站監(jiān)測(cè)與分析項(xiàng)目
第二步：埋代碼
創(chuàng)建好項(xiàng)目后遥赚，還看不到數(shù)據(jù)扬舒，因?yàn)镠otjar還沒有跟要監(jiān)測(cè)的網(wǎng)站對(duì)接上。為了讓Hotjar采集到被監(jiān)測(cè)網(wǎng)站的數(shù)據(jù)凫佛，下一步就是埋代碼讲坎，也是唯一一個(gè)需要技術(shù)人員支持的環(huán)節(jié)。
這個(gè)環(huán)節(jié)也非常簡(jiǎn)單愧薛，Hotjar將需要埋入的代碼呈現(xiàn)在了登錄后的主頁區(qū)域晨炕，如圖4所示。讓技術(shù)人員把Hotjar提供的代碼復(fù)制并粘貼到被檢測(cè)網(wǎng)站的后臺(tái)代碼庫(kù)中毫炉，放置在兩個(gè)<head>之間的任意位置即可瓮栗。如果你有網(wǎng)站后臺(tái)的賬號(hào)，完全不需要任何技術(shù)人員的支持，3分鐘就能完成復(fù)制粘貼费奸。
圖4：埋代碼
如果在登陸后主頁找不到代碼區(qū)弥激，可以點(diǎn)擊主頁右上角的“Tracking Inactive”的激活按鈕（如圖4），會(huì)彈出專門的代碼顯示框（如圖5）愿阐，同樣可以復(fù)制粘貼微服。
圖5：代碼框
在被監(jiān)測(cè)的網(wǎng)站買入代碼后，大約10分鐘左右缨历，Hotjar就能跟網(wǎng)站后臺(tái)連接上以蕴，登錄后首頁的右上角會(huì)顯示帶勾的“Tracking Active”標(biāo)識(shí)（如圖6），表明Hotjar已經(jīng)開始接收數(shù)據(jù)了辛孵。
圖6：數(shù)據(jù)激活
第三步：設(shè)置與分析
數(shù)據(jù)接通后丛肮，就可以開始自定義設(shè)置和查看分析結(jié)果。這部分就是Hotjar跟市面上其他分析工具差別最大的地方魄缚，它并沒有提供非常多宝与、非常復(fù)雜的分析功能，只提供了兩類數(shù)據(jù)的分析冶匹，一目了然（如圖7左側(cè)欄所示）：
一類是ANALYTICS：這類分析功能主要基于網(wǎng)站后臺(tái)的行為數(shù)據(jù)進(jìn)行分析伴鳖，也就是我們常說的客觀大數(shù)據(jù)分析。具體分析功能包括4個(gè)——熱圖分析（Heatmaps）徙硅、操作錄像（Recording）、漏斗分析（Funnels）搞疗、表格分析（Forms）嗓蘑。這4個(gè)是行為分析中最常用的分析功能，對(duì)設(shè)計(jì)師在進(jìn)行界面設(shè)計(jì)匿乃、流程設(shè)計(jì)和表格設(shè)計(jì)有非常直接的幫助桩皿。
一類是FEEDBACK：這類分析功能基于用戶的直接反饋數(shù)據(jù)進(jìn)行分析，屬于主觀小數(shù)據(jù)的分析幢炸。這個(gè)大類也包括4類具體分析功能——進(jìn)入反饋（Incoming）泄隔、投票（Polls）、問卷調(diào)查（Surveys）宛徊、用戶招募（Recruiters）佛嬉。
圖7：分析功能
以上就是Hotjar提供的所有分析功能——4個(gè)客觀分析功能，4個(gè)主觀分析功能闸天，非常簡(jiǎn)練暖呕，而且是主客觀相結(jié)合。Hotjar是所有輕量級(jí)分析工具中唯一能做到主客觀相結(jié)合的苞氮，同時(shí)也是所有主客觀分析工具中湾揽，做的最輕的。
這8個(gè)分析功能在使用之前需要進(jìn)行自定義設(shè)置，但設(shè)置流程非常簡(jiǎn)單库物，采用的Step By Step方式霸旗，指引清晰，照著說明一步一步操作即可戚揭。設(shè)計(jì)師的貼心和強(qiáng)迫癥在這里體現(xiàn)的淋漓盡致诱告，尤其是有十幾年經(jīng)驗(yàn)的老司機(jī)。
幾個(gè)栗子
下面以UXTOOLS.CC網(wǎng)站為例毫目，列舉幾個(gè)我自己利用Hotjar進(jìn)行的例子蔬啡。首先來看熱圖分析（Heatmaps），點(diǎn)擊熱圖分析首頁的“+New Heatmap”按鈕（如圖8所示）镀虐，按照彈出的指引頁面箱蟆，添加想監(jiān)測(cè)熱圖的頁面地址。添加成功后刮便，熱圖列表就會(huì)出現(xiàn)添加的監(jiān)測(cè)項(xiàng)目空猜，點(diǎn)擊熱圖項(xiàng)目的“View Heatmap”按鈕，就可以打開查看指定頁面的熱圖（如圖9）恨旱。
圖8：熱圖分析
Hotjar的熱圖功能可以分別查看WEB端和手機(jī)端辈毯，提供點(diǎn)擊、鼠標(biāo)和翻頁行為的熱圖搜贤，詳細(xì)數(shù)據(jù)可以導(dǎo)出谆沃，熱圖圖片可下載。
圖9：熱圖結(jié)果
下面再來看看操作錄像（Recording）的例子：同樣仪芒，先在操作錄像的頁面點(diǎn)擊“Edit Settings”進(jìn)行設(shè)置唁影，系統(tǒng)會(huì)自動(dòng)對(duì)訪問者的操作進(jìn)行視頻還原。所有的錄像都會(huì)出現(xiàn)在列表中掂名，每一條都會(huì)注明訪問者編號(hào)据沈、訪問頁面、時(shí)長(zhǎng)饺蔑、操作系統(tǒng)锌介、瀏覽器等信息（如圖10）。點(diǎn)擊“Play”按鈕猾警，會(huì)打開專門的播放頁面（圖11）孔祸。
圖10：操作錄像列表
Hotjar的操作錄像播放頁面會(huì)顯示訪問者的屏幕錄像，并會(huì)對(duì)鼠標(biāo)點(diǎn)擊行為肿嘲、翻頁行為融击、鼠標(biāo)軌跡進(jìn)行標(biāo)記，還可以查看被訪者的每一個(gè)操作雳窟，并添加注釋尊浪，這樣項(xiàng)目組的其他成員可以看到（如圖11）匣屡。
圖11：查看操作錄像
最后再舉個(gè)設(shè)置入口反饋的例子：進(jìn)入Incoming首頁，點(diǎn)擊“+New Feedback Widget”創(chuàng)建新的反項(xiàng)目拇涤，按照指引進(jìn)行設(shè)置（如圖12）捣作。
圖12：創(chuàng)建反饋項(xiàng)目
設(shè)置成功后，訪問者訪問網(wǎng)站時(shí)鹅士，會(huì)看到浮動(dòng)的反饋圖標(biāo)（如圖13）券躁，點(diǎn)擊反饋圖標(biāo)，可以進(jìn)行打分掉盅，以及文字和截圖反饋（如圖14）也拜。訪問者反饋后，可以在后臺(tái)看到反饋的打分趾痘、截圖以及文字（如圖12）慢哈。
圖13：反饋圖標(biāo)
圖14：打分反饋
例子就舉這么多，其他5個(gè)分析功能就不一一列舉永票，具體的設(shè)置和分析流程基本類似卵贱。想了解更多用戶體驗(yàn)工具，請(qǐng)關(guān)注UXTOOLS公眾號(hào)侣集。
END
原文作者：劉勝?gòu)?qiáng)Suddenly
原文鏈接：Hotjar：最適合設(shè)計(jì)師的數(shù)據(jù)分析工具
本文為UXTOOLS發(fā)起人劉勝?gòu)?qiáng)原創(chuàng)分享發(fā)布于UI中國(guó)键俱，未經(jīng)作者許可，禁止轉(zhuǎn)載世分。
