ヒートマップ・画面録画・フォームトラッキングツール「Hotjar」の特徴

Google Analyticsだけでもユーザー行動は追えますし、ページ上の動きもイベントを仕込んでログに吐くことでより詳細に追うことができます。ログ基盤が整っている現場だとヒートマップツールの役目は終わったようにも感じます。

しかしイベントのログ出力や整形、可視化がされていない現場ですと、手軽にページ上の動きを追いたいときにヒートマップツールはまだまだ有用だとも思います。

ということで、LPO/EFOに使えるヒートマップツール「Hotjar」の特徴を紹介します。

Hotjarとは

公式のProduct TourやDocumentsを見てもらうのがキャプチャも豊富で一番わかりやすいので、ここでは箇条書きで軽く説明するだけにします。

Hotjarは大きく2点、分析とフィードバックの機能を持っています。

• Analytics Tools
  • Heatmap
    • ページ上のクリック・タップ・マウス・スクロールを可視化できます
  • Visitor Recordings
    • 動画でページ上の動きを確認できます
  • Conversion Funnels
    • 離脱するページと割合を確認できます
  • Form Analytics
    • 入力フィールドの入力率や入力時間、離脱率を確認できます
• Feedback Tools
  • Incoming Feedback
    • ページのここの部分がよかったなどのコメントを残せる
  • Feedback Polls
    • 訪問者に向けて簡単な質問を作成できます
  • Surveys
    • 訪問者に向けてのアンケートフォームを作成できます
  • Recruit User Testers
    • テストユーザーを募集できます

導入の仕方

https://insights.hotjar.com/register
から登録して、Javascriptのタグをページに埋め込むか、 Googleタグマネージャーが導入済みであればタグの設定と追加するだけで導入は完了です。

Hotjar各機能の特徴

ほかのヒートマップツールと比べたときに気になるだろうポイントを上げています。
この機能はどう使うのかや、ヒートマップの濃淡や値はどういう意味を持つのかなど、一般的なことの説明は省いています。

Heatmap

• PCとタブレット、スマホは自動で切り分けられる
• 15分以内にデータが反映される
• ページURL（正規表現可能）を指定して上限PVを指定してHeatmapを作成する
• 上限PVは1Heatmapあたり最大5,000PV（BUSINESSプラン）
  • 少ないように感じますが、2,000PVでも濃淡がくっきり出て動きが見て取れます
• 上限PVよりもアクセスのあるページの場合、いい感じに24時間に分散してくれる
• Heatmapの設定を変えると集計値がリセットされる
  • 設定値が違っているのに前の集計値と混同して可視化しまわないための配慮
  • 他社ツールでは設定値変えても、前の集計値と一緒にして可視化していたので表示が変なことあったのでリセットは妥当
• 集計開始日を指定してHeatmapを作成することはできない
  • APIがないのが残念でならない
• データの保存期間を過ぎると保存済みのHeatmapは消える
  • BASICプランでも3ヶ月も保存してくれる
  • Heatmapはpngでエクスポートできる
• 複数ドメインのトラッキングができる
  • 組織のトラッキングIDを複数のサイトに入れればよい
  • ドメインで分けたい場合はサイトのトラッキングIDを使う
  • https://docs.hotjar.com/docs/installing-hotjar-on-multiple-websites
• SPAにも対応
  • https://docs.hotjar.com/v1.0/docs/hotjar-on-single-page-apps
• IP Blockingあり
  • https://docs.hotjar.com/docs/excluding-your-own-ip-from-recorded-data
• opt-outあり
  • https://www.hotjar.com/opt-out

ヒートマップデータの集計方法

https://docs.hotjar.com/docs/how-is-hotjar-different-to-google-analytics

Hotjar only collects data from a sample of visitors on a site. A proprietary sampling engine distributes this sampling evenly over the course of a day.

独自のサンプリングエンジンにより、1日で集計可能なPV数をいい感じに24時間に分散してくれます。

上限PVが1日単位で設定されているため、設定ミスで月の上限PV数を一気に消費してしまったり、 ページのPV数から1日または1時間に集計できるのは何%か、こちらで設定する必要がなくなります。

Instead of collecting data from all pages, Hotjar takes an ‘On demand report’ approach. Users can generate an unlimited amount of ‘snapshot’ reports on an unlimited number of pages.

「On demand report」アプローチというものを採用しています。

全ページを常時データ取得して全期間のHeatmap（snapshot reports）を作るのではなく、 決められたページ、決められた期間、決められた量のHeatmapのみを作るというモデルになります。

• Good
  • 集計PV数の無駄をなくせる（設定したまま見ないページにPVを取られない）
  • 低価格で利用できる（Hotjar側のインフラにかかる費用が減り低価格を実現できている）
• Bad
  • 見たい時だけ見るというような運用には適さない

どうしてもこのアプローチが合わないという方は、Crazy Egg や Mouseflow をおすすめします。

Visitor Recordings

• いままで見た録画ツールの中で一番レスポンスがいい
• 期間・URL・訪問者情報などで検索できる
• 自動で次のアクセス分の録画を再生してくれる
• ページ遷移しても１セッションとして録画される
• 特定のページのみを録画対象にできる（有償版）
  • https://docs.hotjar.com/docs/recording-specific-pages
• 特定のアクションをしたときだけ録画対象にできる（有償版）
  • https://docs.hotjar.com/v1.0/docs/using-javascript-triggers

Conversion Funnels

• Heatmapと違い期間指定で集計結果を出せる
• 特定のステップで離脱したユーザーの動画を見にいける

Form Analytics

• 集計したいフォームがあるURLを入れると、そのページにあるフォームとinput要素が出てくる
  • 集計したいフォームを選ぶ
  • 集計不要なinput要素を外す
• フォームの入力フィールドの上から順にドロップしたところが分かる
• フォーム入力にかかった時間が分かる
• FormのSuccessはSubmitボタンを押したかどうかで判断される
  • Submitボタンを押した結果が成功・失敗に限らず、押せばSuccess扱いになる
  • https://docs.hotjar.com/docs/understanding-the-form-report
  • jsで失敗したときと成功したときでそれぞれイベント発火すれば区別できる
• 入力値が自動入力されているようなものは、Left Blankの値が高いがSuccessも高くて変な数値になる
  • Funnelでform->confirm->completeのDrop率を取って遷移率はそちらで見るのがよい
  • Formの方の全体Drop率は%見るのではなく、他のフォーム項目と比較して見るのがよい

価格

通常価格

https://www.hotjar.com/pricing

肝心の価格ですが、さすがセールスポイントにしているだけあって安い！

代理店価格

https://docs.hotjar.com/v1.0/docs/using-hotjar-for-clients

Organization2つ目（別法人）からは代理店割引価格で購入することができる。

• Organization A [PLUS]
  • Site A
  • Site B
  • Site C
• Organization B [PLUS]
  • Site D
  • Site E

$29 + $9 = $38

料金体系の改定

https://docs.hotjar.com/docs/pricing-structure-update

2017/09/04以降に有償プランに切り替えた場合、 OrganizationごとからSiteごとにプランを設定して請求される体系になる。 （9/4以前のアカウントについては前の料金を保証）

• Organization A
  • Site A [PLUS]
  • Site B [PLUS]
  • Site C [PLUS]
• Organization B
  • Site D [PLUS]
  • Site E [PLUS]

$293 + $92 = $105（仮）

9/4以降、追加Organizationの扱いについて記載がないので、 本当に上記のような計算になるのかはわからない。

さいごに

ここまでの機能が揃っておいて、この低価格でヒートマップツールが利用できるのはかなり珍しいです。
国内で同等のものを探そうとするとHotjarの5倍～10倍以上はかかるでしょう。

こういうツールは導入した月は利用されるものの、だんだん利用されなくなる傾向があるので、月額で導入して継続して利用していけるのか、ここで得られたものが改善施策になって効果が出せるのか測るのに、価格的にも試験導入しやすいと思います。

複数会社で使う場合、お得に代理店価格を利用できるのはあとわずかなので、気になる方はまず無料体験期間を利用して導入してみてはどうでしょうか。

Hotjar Product Roadmap

近いうちにiOS/Androidアプリにも対応するらしいので、リリースされたら試用してみたいですね。