ヒートマップ

Docs > Product Analytics > ユーザーアクティビティの再生 > ヒートマップ

ヒートマップ (heat map とも呼ばれます) とは、Session Replay データの上にユーザーのインタラクションをオーバーレイ表示して可視化するものです。Product Analytics には 3 種類のヒートマップがあります:

Click maps: ページでユーザーがどのように操作しているかを理解するために、ユーザーのインタラクション (クリック) を表示します。
Top elements: 特定のページで最も操作された要素のランキングを、最大上位 10 件まで表示します。
Scroll maps: ユーザーがページをどこまでスクロールしたかを表示します。ページの平均的なファーストビュー (average fold) の位置も確認できます。平均的なファーストビューは、ユーザーがスクロールせずにデバイス上で見られる最下点を指します。

ヒートマップを使うと、ユーザーインタラクションに関するデータを確認し、ユーザーエクスペリエンスを改善する方法を特定できます。

前提条件

ヒートマップを使い始めるには:

SDK のバージョンを確認します:
- Click maps の場合、SDK は v4.40.0+ である必要があります。
- Scroll maps の場合、SDK は v4.50.0+ である必要があります。
Session Replay を有効化します。
アクション追跡を有効にするため、SDK の初期化時に trackUserInteractions: true を設定します (Click maps で必須)。

はじめに

Digital Experience > Product Analytics > Session Replay > Heatmaps に移動します。アプリケーションとビューを選択します。

タイムフレームセレクターの左側で、表示したいヒートマップの種類を選択できます: Top Elements、Click Map、Scroll Map。

各ビューで異なる種類のヒートマップを選択できます: Top Elements、Click Map、Scroll Map。

次の追加の表示オプションがあります:

表示中のビューを切り替えるには、上部の View Name と Application セレクターを使用します。
デバイスビューを変更するには、Device type セレクターを使用します。
アクション名でフィルタするには、Filter actions by ドロップダウンを使用します。
特定の地域など、より詳細なフィルターを追加するには、Add Filter ボタンをクリックします。

ヒートマップページでは、アプリケーション、マップタイプ、デバイスタイプ、アクション名、詳細フィルターなどで異なるビューを表示できます。

Top Elements

Top Elements ヒートマップは、特定のビューにおけるクリックアクションを集計し、最も操作された要素とそのインタラクション順位を表示します。マップ上のランキングは、サイドに表示されるアクション名と対応しています。

パネル内の任意のアクション名にホバーすると、マップ上の対応するアクションがハイライト表示されます。

Click maps

Click map は、セッションからのユーザークリックアクションを集計し、マップ上にブロブとして可視化することで、特定のビューで最も操作されたアクションを示します。

左側には、そのページで発生したすべてのアクションが頻度順に一覧表示されます。アクションをクリックすると、次のようにそのインタラクションの詳細を確認できます:

ユーザーがそのアクションを実行した回数や、そのページにおける上位アクション全体の分析での位置づけ。
そのアクションでフラストレーションシグナルが発生している場合 (例: ボタンへのレイジクリック)、関連するフラストレーションシグナルも確認できます。

このビューから Start a Funnel ボタンをクリックして、ユーザーの離脱を特定することもできます。

Scroll maps

Scroll maps は、特定のページにおけるスクロールアクティビティの集計を表示します。Scroll maps を使うと、ページの平均的なファーストビュー (average fold) がどこに位置するかや、どれだけのユーザーが特定の深さまでスクロールしたかを確認できます。Scroll map 上のフローティングの青いバーを、評価したい深さまでドラッグできます。

平均的なファーストビューとスクロールの深さの分布が表示されたサンプル E コマースページの Scroll map。

Scroll map の左側のパネルには、ハイレベルなインサイトとクエリ結果への直接リンクがあります。たとえば、特定のパーセンタイルを越えてスクロールしたビューの一覧へのリンクなどです。インサイトパネルの下には、ページのミニマップと、詳細なスクロールデータを表示する分布グラフがあり、どこで最も大きな離脱が発生しているかの特定に役立ちます。

スクリーンショット

スクリーンショットは、特定の時点におけるビューの状態です。スクリーンショットを変更すると、選択したスクリーンショットに応じて異なる結果が表示されます。スクリーンショットを保存して、組織内の全員が同じビューの状態を分析できるようにすることもできます。

スクリーンショットの変更

ヒートマップのビューで、Change Screenshot ボタンをクリックします。チームメイトが以前保存した既存のスクリーンショットから選択するか、Session Replay からスクリーンショットを取得します。

Session Replay からスクリーンショットを選択するには:

希望するヒートマップのスクリーンショットがまだ保存されていない場合は、Grab from replay をクリックします。
右側のアクションイベントをクリックして、ヒートマップ用に別の Snapshot を選択します。
セッションに、希望するスクリーンショットにつながるようなアクションが含まれていない場合は、Choose Another Replay をクリックしてリプレイの一覧に戻れます。
Take Screenshot ボタンをクリックすると、一時停止している時点のスクリーンショットをヒートマップに適用します。

スクリーンショットの保存

現在のヒートマップの状態をスクリーンショットとして保存することで、組織内でヒートマップを開く人のデフォルトビューにすることができます。最近のリプレイから自動選択された現在のスクリーンショットを保存するには、現在のスクリーンショットの Save をクリックします。

同じビューに対して複数のスクリーンショットを保存し (例: デフォルトビュー、ナビゲーションメニューを開く、モーダルを開く)、チームメイトが保存したスクリーンショットに切り替えることができます。

現在保存されているスクリーンショットを削除し、最近のリプレイから自動選択されたスクリーンショットに戻すには、現在のスクリーンショットの Unpin をクリックします。

Unpin をクリックして、現在ピン止めされているスクリーンショットを削除します。

次のステップ

ヒートマップを分析したら、関連データを探索してユーザーの行動の背景にある理由を理解しましょう。Analytics Explorer に切り替えるか、関連する Session Replay を視聴して、セッション全体の文脈の中でユーザーアクションを視覚的に確認できます。

トラブルシューティング

特定のビューのヒートマップを見ていますが、想定外のページが表示されます。

ヒートマップは Product Analytics のビュー名に基づきます。Product Analytics アプリケーションの構成によっては、多くのページが同じビュー名の下にグループ化されたり、非常に具体的なビュー名を持つようになったりすることがあります。

選択したビューで初期コンテンツが表示されません。

ヒートマップは Session Replay データで生成されます。Datadog は、ページの初期状態によく一致する最近のリプレイを自動的に選択します。場合によっては、ビューの別の状態のヒートマップを見たいこともあるでしょう。ヒートマップのスクリーンショットを切り替えるには、Change Screenshot、Grab from replay の順にクリックして、リプレイのさまざまな状態を確認し、目的の状態を見つけてください。閲覧中のリプレイに目的のスクリーンショットが含まれていない場合は、Choose Another Replay ボタンで同じビューの別のリプレイを選択できます。

ヒートマップの横のアクションリストで、ヒートマップ内に表示されていない要素を示すアイコンが見えます。

アイコンのツールチップには element is not visible と表示されます。これは、その要素がページ上の一般的なアクションではあるものの、ヒートマップのスクリーンショットでは表示されていないことを意味します。その要素を確認するには、右上の Change Screenshot をクリックし、その要素が存在するスクリーンショットに切り替えてください。

ヒートマップの作成を試みると、「No Replay Data」状態が表示されます。

これは、現在の検索フィルターに一致し、ヒートマップの背景として使用できる Session Replay が Datadog に見つからなかったことを意味します。Browser SDK でセッションの記録を開始したばかりの場合、Session Replay が閲覧可能になるまで数分かかることがあります。