Un heatmap (o mapa de calor) es una visualización de las interacciones de tus usuarios superpuesta a los datos de Session Replay. Análisis de producto dispone de tres tipos diferentes de mapas de calor:
- Mapas de clics: Consulta las interacciones de los usuarios (clics) para comprender cómo interactúan con tu página.
- Principales elementos: Visualiza una clasificación de los 10 elementos con los que más se interactuó en una página.
- Mapas de desplazamiento: Observa hasta dónde se desplazan los usuarios por una página, incluyendo dónde se encuentra el pliegue medio de una página. El pliegue medio es el punto más bajo de una página que un usuario puede ver en su dispositivo sin desplazarse.
Utiliza mapas de calor para revisar datos complejos de un vistazo y obtener información para optimizar la experiencia del usuario.
Requisitos previos
Para empezar con los mapas de calor:
- Verifica la versión de tu SDK:
- Para los mapas de clics, debes tener la última versión del SDK (v4.40.0 o posterior).
- Para los mapas de desplazamiento, debes tener (v4.50.0 o posterior).
- Activa Session Replay.
- Configura
trackUserInteractions: true en la inicialización del SDK para habilitar el seguimiento de acciones (necesario para los mapas de clics).
Empezando
Ve a Experiencia digital > Análisis de productos > Session Replay > Mapas de calor. Selecciona tu aplicación y visualízala.
En esta página, puedes seleccionar el tipo de mapa de calor (Elementos principales, Mapa de clics, Mapa de desplazamientos) del que quieres ver una vista concreta.
Haz clic en el nombre de una vista para ver con más detalle el mapa de calor correspondiente. A partir de aquí, tienes estas opciones de vista adicionales:
- Para cambiar la vista que se muestra, utiliza los selectores Nombre de la vista y Aplicación de la parte superior.
- Para cambiar la vista del dispositivo, utiliza el selector Tipo de dispositivo.
- Para filtrar por el nombre de acción, utiliza el desplegable Filtrar acciones por.
- Para añadir filtros más granulares, como una geografía específica, por ejemplo, haz clic en el botón Add Filter (Añadir filtro).
Elementos principales
Los mapas de calor de Elementos principales agregan las acciones de clic en una vista determinada, mostrando los elementos con los que más se interactúa, además de su clasificación de interacción. La clasificación en el propio mapa corresponde al nombre de acción al lado.
Pasa el ratón por encima de cualquier nombre de acción del panel para resaltar la acción correspondiente en el mapa.
Mapas de clics
Un mapa de clics te muestra las acciones con las que más se interactuó en una vista determinada, agregando acciones de clic de las sesiones y visualizándolas como manchas en el mapa.
A la izquierda hay una lista de todas las acciones que ocurrieron en la página, enumeradas por frecuencia. Al hacer clic en una acción, puedes obtener más información sobre esa interacción, por ejemplo:
- El número de veces que el usuario realizó la acción y su posición en el análisis general de las principales acciones de una página determinada.
- Si en esa acción se produjo una señal de frustración (por ejemplo, si un usuario hizo un clic de ira en ese botón), también puedes ver las señales de frustración asociadas.
En esta vista, también puedes hacer clic en el botón Start a Funnel (Iniciar embudo) para identificar el abandono de los usuarios.
Mapas de desplazamiento
Los mapas de desplazamiento muestran una imagen de la actividad de desplazamiento agregada en una página determinada. Utiliza los mapas de desplazamiento para ver dónde se encuentra el pliegue medio de la página y cuántos usuarios se desplazan hasta una profundidad determinada. Puedes arrastrar la barra azul flotante de un mapa de desplazamiento hasta la profundidad que quieras evaluar.
El panel situado a la izquierda del mapa de desplazamiento proporciona información muy clara con enlaces directos a los resultados de la consulta, como un enlace a una lista de las visualizaciones en las que el usuario se desplazó más allá de un percentil determinado. Debajo del panel de información hay un minimapa de la página y un gráfico de distribución que muestra datos de desplazamiento detallados, útiles para identificar dónde se producen los mayores abandonos de la página.
Snapshots
Un snapshot es el estado de una Session Replay en un momento determinado. Cambiar el snapshot muestra resultados diferentes, dependiendo del snapshot seleccionado. Puedes utilizar el botón Change Snapshot (Cambiar snapshot) para seleccionar un snapshot concreto en una repetición para tu mapa de calor.
Para seleccionar un snapshot de fondo:
En la vista de mapa de calor, haz clic en el botón Change Snapshot (Cambiar snapshot).
Haz clic en un evento de acción a la derecha para seleccionar un snapshot diferente para tu mapa de calor.
Si la sesión no contiene la acción que lleva al snapshot deseado, puedes volver a la lista de repeticiones haciendo clic en Choose Another Replay (Elegir otra repetición).
Haz clic en el botón Select Snapshot (Seleccionar snapshot) para aplicar el snapshot en el punto pausado al mapa de calor.
Siguientes pasos
Después de entender los análisis, el siguiente paso es comprender la acción en el contexto de otros datos fuera de los mapas de calor. Esto puede significar pasar al Analytics Explorer. También puedes ver las repeticiones de sesión asociadas para ver visualmente a un usuario realizando la acción en el contexto de su sesión global.
Solucionar problemas
Estoy viendo un mapa de calor para una vista determinada, pero me muestra una página inesperada.
Los mapas de calor se basan en nombres de vistas del Análisis de productos. Según cómo esté configurada tu aplicación de Análisis de productos, muchas páginas pueden empezar a agruparse bajo el mismo nombre de vista o podrías empezar a tener nombres de vista específicos.
La vista que seleccioné no muestra el contenido inicial.
Los mapas de calor se generan con los datos de Session Replay. El algoritmo inteligente de Datadog selecciona la repetición más reciente y la que mejor se ajusta al estado inicial de la página. En algunos casos, puede que no encuentres la repetición correcta. Para cambiar el snapshot de tu mapa de calor, puedes utilizar el botón Change Snapshot (Cambiar snapshot) para navegar por los diferentes estados de una repetición y encontrar la que estás buscando. Si la repetición que estás viendo no tiene el snapshot que buscas, puedes utilizar el botón Choose Another Replay (Elegir otra repetición) para seleccionar otra repetición de la misma vista.
En la lista de acciones en el lado de mi mapa de calor, veo un icono que muestra un elemento que no es visible en el mapa de calor.
El globo del icono dice que el elemento no es visible. Esto significa que el elemento es una acción común en tu página, pero no se muestra en el snapshot en el mapa de calor. Para ver ese elemento, puedes hacer clic en Change Snapshot (Cambiar snapshot) en la esquina superior derecha para cambiar el snapshot de tu mapa de calor a uno en el que esté presente ese elemento.
Después de intentar crear un mapa de calor, veo que aparece el estado “No Replay Data”.
Esto significa que Datadog no logró encontrar ninguna Session Replay para utilizarla como un fondo del mapa de calor que coincida con los filtros actuales de búsqueda. Si acabas de empezar a grabar sesiones con el SDK del navegador, puede que la Session Replay tarde unos minutos en estar disponible para su visualización.
Después de intentar crear un mapa de calor, veo que aparece el estado “Not enough data to generate a heatmap” (No hay suficientes datos para generar un mapa de calor).
Esto significa que Datadog no ha podido emparejar ninguna acción del usuario con la repetición seleccionada en ese momento. Esto ocurre por varias razones, como por ejemplo:
- Tu aplicación no está utilizando la última versión del SDK (v4.20.0 o posterior).
- Tu página cambió drásticamente en los últimos tiempos.
La información del usuario no se recopila por defecto. Los mapas de calor utilizan la información de usuario disponible en tus datos de sesión para mostrar información relevante sobre el comportamiento.
Referencias adicionales
Más enlaces, artículos y documentación útiles:
