Guía práctica para crear mapas de calor

G

Seguro que has oído hablar más de una vez de los llamados heatmaps, ¿verdad? Los heatmaps, o mapas de calor, son gráficos que nos permiten analizar el comportamiento de una web o página concreta a través del rastreo de la actividad de las personas que la visitan, en base a criterios como los clics o el scroll, entre otros.

Una de las herramientas más conocidas que nos ofrecen análisis para este fin es Lucky Orange. A lo largo de este post veremos cómo utilizar la plataforma para elaborar mapas de calor, así como su previa implementación (algo muy sencillo si además contamos con Google Tag Manager, la herramienta de etiquetado web de Google) y acabaremos con un breve recorrido para familiarizarnos con la herramienta y sus principales secciones.

Fuente: Lucky Orange

First things, first

Evidentemente, lo primero que tendremos que hacer es encargarnos de implementar el seguimiento de Lucky Orange en la web que queremos analizar. A pesar de ser algo técnico, esta tarea no conlleva serios requerimientos de desarrollo que nos puedan causar problemas. Con lo que estamos de suerte, porque cualquier persona que haya tenido un bautismo, o nociones básicas, en Google Tag Manager puede ser capaz de seguir estos sencillos pasos:

  1. Una vez hayamos contratado el servicio, con el plan que más nos convenga (puedes consultar aquí las diferentes tarifas disponibles según el uso) tendremos que ir a la sección de “Tracking Code” dentro del módulo de la configuración general. Copiaremos la líneas de código para emplearlas más adelante.

  1. Nos logaremos en GTM y seleccionamos la cuenta y el contenedor donde tenemos alojada nuestra página. En este paso tendremos que añadir una nueva etiqueta de tipo Custom HTML, donde pegaremos el código de antes. Después tendremos que seleccionar los triggers, o disparadores (en nuestro caso será en todas las páginas vistas).

  1. ¡Guardamos, publicamos los cambios y listo! Ya tendremos nuestro Lucky Orange funcionando.

via GIPHY

Pero, ojo, si todo esto de arriba te ha sonado a élfico, te recomiendo dos opciones:

  1. Pide ayuda. A tu analista técnico, al equipo de desarrollo o a cualquier otra persona que sepas que tenga nociones de GTM. Alguien que sepa más que tú, oye.
  1. Consulta la sección de ayuda a la instalación de Lucky Orange. Aquí encontrarás todas las guías y formas disponibles de instalación, te serán de gran utilidad.

House tour

Ya tenemos la herramienta funcionando ¿pero, y ahora qué?

via GIPHY

Accedemos con nuestras claves a https://www.luckyorange.com/ y llegaremos a la landing donde encontraremos nuestra web. 

Cuando la seleccionemos, llegaremos a la parte del Dashboard. Esta pantalla es un resumen de todas las métricas básicas de performance que nos ofrece Lucky Orange. Se trata de una zona customizable, donde podremos encontrar widgets diversos (usuarios activos en real time, visitas, páginas vistas, información sobre canales, … ).

En el panel superior también nos encontramos con la opción de Live visitors. Aquí es donde podremos analizar en mucho mayor detalle qué está ocurriendo en nuestra web en el mismo momento, caso por caso. Se pueden consultar las grabaciones y también el real time del uso de la web.

Mientras que en el apartado de Recordings nos encontramos con todas las grabaciones del período. Tan sencillo como eso. Además, podemos exportarlas y trabajar con filtros de fecha o segmentos para tener aún más una visión centrada en el usuario.

La sección de Chat nos ofrece una visión totalmente enfocada al customer centric pero además en tiempo real. Sí, es justo lo que te estás imaginando; esta funcionalidad nos permite abrir chats con nuestras visitas, lo cual nos ayudará a mejorar la satisfacción del cliente y favorecer la conversión. ¿No es maravilloso?

Heatmaps

Los mapas de calor, una de las cosas más interesantes que nos ofrece esta herramienta. Para empezar a trabajar con ellos, tendremos que utilizar el buscador para seleccionar la url sobre la cual querremos hacer el análisis:

Y una vez seleccionada, Lucky Orange nos llevará a una landing donde se mostrará nuestro recién creado mapa. Vamos a repasar a continuación los conceptos más interesantes de este tipo de gráficos y cómo podemos explotarlos.

  1. En el primero podremos configurar el tipo de evento a medir (clicks, movimientos de pantalla o scroll) así como la configuración del gráfico (opacidad, fondo, …). 
  1. En el segundo, encontraremos toda la información referente a los formularios, y además nos permitirá crear uno nuevo en caso de que lo necesitemos. 
  1. El tercero nos aporta la información del tipo de evento que hayamos seleccionado rankeada, junto a su peso porcentual. Además, desde aquí podremos descargar el listado o hacerlo visible en el mismo gráfico, como vemos en el ejemplo de abajo:

Una vez tengamos el mapa de calor hecho, podremos descargar la captura completa en formato imagen, filtrar por segmentos o dispositivos, o seleccionar elementos concretos y ver sus respectivas grabaciones, lo que nos ayudará todavía más a entender el comportamiento de quienes nos visitan. Casi mágico, ¿no?

via GIPHY

¿Conoces otras herramientas de mapas de calor? Cuéntanos tus experiencias 🙂

Escribe el primer comentario

Sobre el autor

Blanca Balcells

Analista digital radical y devoradora de hamburguesas y libros profesional. También profesora de analítica y estrategia. Defensora del aprendizaje constante “Never stop learning because life never stops teaching”.

Eloy Urarte

Lead UX & CRO | MA Degree Lecturer. Crítico del “vale más una imagen que mil palabras”. Enamorado del storytelling y la experiencia de usuario.

¿Hablamos?

Si quieres conocerme, insultarme o incluso contratarme...