¡Hola! Ahora puedes usar Hotjar en español 🇪🇸 Empieza gratis.

Aprende / Guías / Guía de heatmaps

Volver a las guías

4 casos prácticos de heatmaps

Los heatmaps o mapas de calor son una herramienta muy potente. Por si no te lo crees, las aplicaciones reales de los mapas de calor que se describen en los siguientes casos prácticos te lo demuestran.

Última actualización

9 oct 2023

Tiempo de lectura

5 min

Compartir

Regístrate para obtener una cuenta gratuita de Hotjar, añade el código de seguimiento a tu sitio web y empieza a utilizar heatmaps hoy mismo.

Caso práctico de heatmap 1: una corrección de 5 minutos que mejoró la conversión en un 40 %

El contexto: Taskworld es una solución de gestión de proyectos que utiliza principalmente su página de registro para convertir leads en usuarios y clientes. El equipo quería entender cómo interactuaba la gente con la página y encontrar oportunidades de mejora, así que colocaron un mapa de calor en ella:

<

Los insights que aportó el análisis del heatmap: Con el mapa de clics se observaron tres problemas. ¿Eres capaz de identificarlos?

  • CTA infrautilizado: a pesar de que la página está dirigida específicamente a usuarios nuevos, el CTA secundario para iniciar sesión (la mancha roja de la parte inferior) registraba más clics que el CTA principal para crear una cuenta.

  • Abandono de los campos: la interacción de los usuarios con cada uno de los cinco campos obligatorios se iba reduciendo progresivamente. Por lo tanto, cada campo suponía una posibilidad de que la gente abandonara la página antes de completar el proceso.

  • Zona horaria como factor bloqueador: los usuarios pasaban por alto el campo obligatorio para seleccionar la zona horaria.

Las medidas y los resultados: Taskworld solo tuvo que invertir 5 minutos en eliminar la opción de iniciar sesión, reorganizar la página en torno a un CTA y reducir los campos de cinco a uno, el del correo electrónico. Así consiguió aumentar la tasa de conversión en un 40 % y reducir los abandonos del proceso en un 4,5 %.

No está mal para haberle dedicado solo 5 minutos, ¿no crees?

→ Leer el caso práctico completo.

Caso práctico de heatmap 2: comprender cómo optimizar una página de inicio para conseguir más registros

El contexto: El equipo de Bannersnack, una herramienta de diseño y creación de banners online, había estado utilizando herramientas de análisis web (como Google Analytics) para hacer un seguimiento y medir el tráfico. Sin embargo, no tenían una idea muy clara de cómo interactuaba la gente con el sitio web, lo que significaba que no sabían por dónde empezar a mejorar las conversiones.

Los insights que aportó el análisis del heatmap: Un conjunto de mapas de calor colocados en la página de inicio indicaron que los usuarios interactuaban más con los elementos adicionales de la página que con el CTA principal:

<

Las medidas y los resultados: Basándose en los insights que adquirieron, el equipo hizo una prueba con un botón CTA más grande y con un mayor contraste. El resultado fue un aumento de los registros en un 25 %.

→ Leer el caso práctico completo.

Caso práctico de heatmap 3: mejora de las páginas de destino utilizando datos y pruebas A/B

El contexto: La compañía CCV Shop, con sede en los Países Bajos, crea y aloja escaparates online para ayudar a más de 17 000 empresas a gestionar sus tiendas de comercio electrónico. CCV Shop captura leads a través de páginas de destino, por lo que el equipo de UX quería entender mejor a sus clientes potenciales y hacer cambios basados en datos para aumentar las conversiones.  

Los insights que aportó el análisis del heatmap: CCV Shop utilizó mapas de calor para obtener una visión global del comportamiento de los clientes en las principales páginas de destino: dónde hacían clic, hasta qué punto de la página se desplazaban verticalmente y cómo interactuaban con los distintos elementos:

<

Además de los mapas de calor, utilizaron otras herramientas para analizar el comportamiento individual de los usuarios, especialmente grabaciones de sesiones. Con ellas, pretendían analizar cómo se comportaba cada usuario en las páginas de destino y así comprender mejor los datos que observaban en los mapas de calor. En las grabaciones de sesiones empezaron también a detectar pequeños errores y problemas que debían solucionar.

Las medidas y los resultados: CCV Shop combinó la información de los mapas de calor y otras fuentes para formular hipótesis comprobables, hacer pruebas A/B y aplicar cambios satisfactorios. Gracias a este proceso, aumentaron la tasa de conversión de su sitio web de marketing en un 38 %, del 1,3 % al 1,8 %, lo que les acercó mucho a su objetivo de conversión del 2 %.

→ Leer el caso práctico completo.

Caso práctico de heatmap 4: aumento de la tasa de conversión móvil en un 63 %

El contexto: La agencia digital Epiphany, con sede en el Reino Unido, recibió el encargo de mejorar el sitio web de su cliente Time4sleep, un comercio online de camas y muebles de dormitorio con más de 200 000 sesiones al mes y una gran audiencia móvil.  

Los insights que aportó el análisis del heatmap: Para conocer al detalle cómo interactuaban los usuarios con su sitio web, el equipo combinó mapas de calor con otras herramientas, como Google Analytics, grabaciones y encuestas (más información a continuación). Los datos que arrojaron esas fuentes les ayudaron a hacer un diagnóstico concreto del problema. Llegaron a la conclusión de que las páginas de categorías existentes no estaban ayudando a la gente a encontrar lo que necesitaba, así que necesitaban una nueva estructura de páginas.

<

El mapa de calor de la izquierda muestra el aspecto que solía tener la página de categorías para móviles. ¿Notas el cambio gradual de color? Significa que la gente tendía a desplazarse hasta muy abajo de la página, pero no era una buena señal. ¿Por qué? Pues porque los visitantes no se desplazaban porque les gustara mucho el contenido, sino porque no encontraban lo que buscaban.

El heatmap confirmó lo que otras fuentes también indicaban a Epiphany, así que el equipo reorganizó la página e incluyó un nuevo sistema de filtrado en la parte superior. Como se observa en el mapa de calor de la derecha, ahora se desplaza mucha menos gente hasta el final de la página, porque encuentra rápidamente en la parte superior lo que necesita.

Las medidas y los resultados: Con este y otros cambios, en los que participaron los equipos de SEO, CRO, diseño, contenido y relaciones públicas, Epiphany probó diferentes versiones de la página y consiguió un aumento general de la tasa de conversión del 19,7 %. Sin embargo, el uso móvil era el verdadero objetivo de Time4Sleep, y Epiphany lo cumplió con creces: consiguió un impresionante aumento del 63 % en la tasa de conversión móvil.

→ Lee el caso práctico completo en el blog de Hotjar.