ヒートマップ

Docs > RUM & セッションリプレイ > Session Replay > ヒートマップ

ヒートマップ (heat map とも) とは、Session Replay データの上にユーザーのインタラクションをオーバーレイ表示して可視化するものです。Real User Monitoring (RUM) には 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 > Real User Monitoring > Session Replay > Heatmaps に移動します。アプリケーションとビューを選択します。

Real User Monitoring ランディングページで、アプリケーションセレクターからアプリケーションとビューを選択します。Timeframe セレクターの左側で、表示したい heatmap の種類を選択できます: Top Elements、Click Map、Scroll Map。これにより、特定のビューのヒートマップページに移動します。

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

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

表示中のビューを切り替えるには、上部の 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 上のフローティングの青いバーを、評価したい深さまでドラッグできます。

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

Snapshots

Snapshot は、特定の時点における Session Replay の状態です。Snapshot を変更すると、選択した Snapshot に応じて異なる結果が表示されます。ヒートマップの Snapshot として特定の Snapshot を選択するには、Change Snapshot ボタンを使用できます。

背景 Snapshot を選択する手順:

ヒートマップのビューで、Change Snapshot ボタンをクリックします。
右側のアクションイベントをクリックして、ヒートマップ用に別の Snapshot を選択します。
セッションにアクションが含まれていない場合は、Choose Another Replay をクリックしてリプレイの一覧に戻れます。
Select Snapshot ボタンをクリックすると、一時停止している時点の Snapshot をヒートマップに適用します。

次のステップ

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

トラブルシューティング

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

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

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

ヒートマップは Session Replay データで生成されます。Datadog のインテリジェントなアルゴリズムは、ページの初期状態に最も一致し、かつ最新のリプレイを選択します。場合によっては、適切なリプレイが見つからないことがあります。ヒートマップの Snapshot を切り替えるには、Change Snapshot ボタンを使用してリプレイの異なる状態を移動し、目的の状態を見つけてください。閲覧中のリプレイに目的の Snapshot が含まれていない場合は、Choose Another Replay ボタンで同じビューの別のリプレイを選択できます。

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

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

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

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