Mapas de calor del ratón: 8 formas en que pueden mejorar tu producto
Descubre qué hacen realmente los usuarios, no solo lo que dicen: Las encuestas y la analítica solo cuentan parte de la historia. Los mapas de calor del ratón revelan dónde dudan, se traban o interactúan más los usuarios, ayudándote a tomar decisiones basadas en datos con confianza.
Prioriza arreglos y funciones que realmente importan: En lugar de adivinar en qué trabajar a continuación, los mapas de calor muestran dónde pasan tiempo (o se frustran) los usuarios, dándote una dirección clara sobre qué requiere atención primero.
Descubre por qué los usuarios abandonan—y soluciónalo: No todos los abandonos son iguales. Los mapas de calor muestran si los usuarios están pasando por alto llamadas a la acción clave, tienen problemas con los campos de formulario o se confunden, para que elimines obstáculos antes de que se marchen.
Detecta fricciones ocultas en tu embudo de activación: ¿Los usuarios hacen clic donde no deben? ¿Se quedan atascados en pasos clave? Los mapas de calor muestran los cuellos de botella para que puedas suavizar el recorrido y aumentar conversiones.
Probablemente la parte más interesante y gratificante del trabajo de un gerente de producto es aprender sobre la forma en que sus usuarios piensan y actúan cuando utilizan sus productos.
Para ello, normalmente realizamos entrevistas a usuarios, hacemos encuestas y analizamos nuestros datos. Sin embargo, existe otra herramienta valiosa en el arsenal de un PM que puede ayudarte a empatizar con tus usuarios: ¡los mapas de calor del ratón!
Hoy quiero que revisemos los casos de uso prácticos de los mapas de calor del ratón y situaciones efectivas para mejorar tu producto.
Want more from The CPO Club?
Sign up for a free membership to complete reading this article:
Have an account? Log In
¿Qué son los mapas de calor del ratón y cómo funcionan?
Un mapa de calor del ratón (también conocido como mapa de atención) es una herramienta de análisis de productos que visualiza cómo interactúan los usuarios con tu interfaz a través de los movimientos de su ratón. Crea una superposición visual—normalmente utilizando degradados de color—sobre una captura de pantalla de tu interfaz para mostrar dónde los usuarios más se desplazan, mueven o hacen clic.
Esto puede ayudarte a identificar qué elementos llaman la atención, dónde los usuarios dudan o qué se ignora por completo. Los mapas de calor del ratón son especialmente útiles cuando se utilizan junto con otros tipos de mapas de calor, como los mapas de desplazamiento, que capturan hasta dónde hacen scroll los usuarios en la página.
Utilizados conjuntamente, estas herramientas te ofrecen una visión más completa del compromiso del usuario: qué ven, qué se saltan y hacia dónde fluye naturalmente su atención.
Diferentes tipos de mapas de calor son comúnmente utilizados por gerentes de producto y diseñadores UX para obtener información sobre el comportamiento de sus usuarios, incluyendo mapas de desplazamiento, mapas de clics, mapas de atención del usuario, mapas de calor de seguimiento ocular y muchos más ejemplos de mapas de calor. Cada tipo puede brindar perspectivas específicas para aumentar la retención y el compromiso de los usuarios, sin embargo, hoy quiero que profundicemos en un tipo en particular: el mapa de calor del ratón.
Un mapa de calor del ratón es lo que llamaríamos un “agregado”, ya que incluye datos combinados de varios tipos de interacciones de usuario: comportamiento de clic, desplazamiento y movimiento del ratón.
Los mapas de calor del ratón son relativamente nuevos en el mundo del análisis visual de productos porque combinar datos de estos tres distintos comportamientos en una sola visualización es una tarea difícil de lograr y fue la llegada de los modelos de IA la que permitió a las herramientas de análisis hacerlo.
Casos de uso reales para optimizar tu producto usando el seguimiento del ratón
Con una comprensión general de qué son estos mapas de calor, vamos a profundizar en algunos casos reales en los que puedes hacer algo valioso por tu producto observando y analizando tus mapas de calor del ratón.
Cómo utilizan los mapas de calor del ratón los gerentes de producto
Aunque analizar las interacciones de los usuarios puede parecer una tarea más acorde para diseñadores UX, los gerentes de producto también pueden utilizar los mapas de calor del ratón para resolver sus propios problemas. Aquí tienes algunas de las formas en que he utilizado esta herramienta para mejorar mis productos.
#1: Encontrar cuellos de botella en tu embudo de activación
Según mi experiencia enfrentando retos de activación, la optimización de embudos es una de las responsabilidades más complejas pero de mayor impacto para un gerente de producto. Incluso una mejora modesta del 10% en la activación puede generar un efecto dominó en todo el embudo, incrementando mucho la conversión de cuentas gratuitas a pagas.
Sin embargo, la activación no es solo cuestión de números: es un rompecabezas que requiere conocimientos conductuales profundos, experimentación iterativa y disposición a cuestionar las suposiciones sobre cómo interactúan realmente los usuarios con tu producto. La clave no es solo impulsar a más usuarios a través del embudo, sino realmente entender por qué abandonan en primer lugar.
Para esto, el gerente de producto utilizará prácticamente todas las herramientas a su alcance, incluyendo analíticas, encuestas, etc. Los mapas del ratón también están entre estas herramientas. Aquí tienes una de las muchas maneras en que estos pueden ayudar a mejorar la activación.
Imagina que trabajas en Atlassian y has tomado como meta trimestral mejorar la tasa de configuración de Jira Cloud.
Al revisar el embudo de activación usando tu herramienta de analítica, ves que hay una caída significativa en el paso donde los usuarios deben escribir el nombre de su instancia de Jira y crear su sitio de Atlassian.
Para entender qué ha sucedido, puedes abrir tu herramienta de mapas de calor y analizar el mapa de calor del ratón. Lo que ves es que los usuarios pasan mucho tiempo en la página, haciendo clic activamente en el campo del nombre del sitio y en el campo “Comenzar en Jira”.
Esto no es un comportamiento normal, ya que lo ideal es que los usuarios hagan clic en cada campo solo una vez y no pasen más de 10-15 segundos en esa página. Inicias una investigación y solicitas a tu equipo de QA que revise lo que está ocurriendo.
Lo que descubre tu equipo es que, para un determinado grupo de usuarios, el validador de nombre de sitio (que comprueba si el nombre ya existe) lanza un error sin importar lo que escribas.
La razón es que un Google Recaptcha invisible piensa que estos usuarios son bots. Así que, para solucionar esto, hablas con tu equipo de seguridad, entiendes que el umbral de seguridad para recaptcha es más alto de lo necesario y lo reduces.
Como resultado, desbloqueas a tus usuarios, permitiéndoles crear su sitio y mejorando significativamente tu tasa de activación.
#2: Ayuda con la Priorización de Funcionalidades
Cuando se trata de priorizar nuevas funcionalidades, el factor más determinante es el impacto que esa funcionalidad tendrá sobre tus usuarios. Mides este impacto basándote en datos, tu conocimiento de las necesidades del usuario (a partir de encuestas y entrevistas), tu intuición y cómo los usuarios interactúan con tu interfaz.
En esto último es donde tus mapas de calor de clics de ratón resultan útiles.
Volviendo a nuestro ejemplo de Jira. Imaginemos que quieres mejorar la forma en que las personas organizan el backlog y hay más de 20 ideas de funcionalidades para hacerlo. Para priorizarlas según las necesidades del usuario, revisas el mapa de calor de la página del backlog. Tras revisarlo, ves que hay mucha actividad en la sección de filtros rápidos.
Así que accedes a tu herramienta de analítica y extraes un gráfico de la distribución de filtros rápidos que tus usuarios han aplicado con más frecuencia. Al analizar estos datos, ves que cerca del 50% de los usuarios de Jira crean un filtro rápido para mostrar las tareas con el estado “Por Hacer”.
Una gran manera de mejorar la experiencia de usuario en este caso sería añadir un botón de filtro dedicado para los estados. Supongamos que esta idea de funcionalidad ya estaba en tu lista de mejoras, por lo que usas este hallazgo para darle mayor prioridad y subirla al principio del backlog de tu equipo.
#3: Optimización de la Tasa de Conversión
En cuanto a complejidad, la optimización de la tasa de conversión (CR) puede competir fácilmente con los embudos de activación. He pasado meses analizando el CR y métricas similares para mis productos, añadiendo funcionalidades para mejorarlo, dándome cuenta de que no funcionan, probando otras opciones y repitiendo este ciclo hasta conseguir algo que realmente aumente la tasa de conversión.
Al igual que con la activación, los mapas de calor del ratón son una herramienta eficaz para analizar los obstáculos a la conversión en tus productos.
En la mayoría de los casos, el principal beneficio de esta herramienta es identificar cuándo los usuarios hacen clic en los CTAs equivocados e ignoran los que realmente llevan a la conversión. Permíteme demostrarlo en la página de producto de una tienda de equipamiento para cocinas industriales.
Imagina que analizamos el mapa de calor de la web en esta página. Lo más probable es que veamos que cierto número de personas hace clic en el botón “Chat Now” que aparece antes que el principal llamado a la acción (ver producto). Entiendo que la empresa lo ha añadido para convencer a sus usuarios de que sus productos son los más baratos del mercado.
Sin embargo, el problema aquí es que al hacer clic en “Chat Now” se interrumpe el recorrido del usuario que está revisando y comprando el producto, disminuyendo significativamente la tasa de conversión.
Mi sugerencia aquí sería mover este mensaje y CTA a una zona menos prominente de la página, para evitar romper el recorrido de los usuarios.
#5: Test A/B para Validar Funcionalidades
Otra aplicación útil de los mapas de calor del ratón es la validación de funcionalidades mediante test A/B. Aquí, los mapas de calor sirven como fuente valiosa de información al mostrarte visualmente las mejoras (o la falta de ellas) en la interacción de los usuarios con tu funcionalidad.
Lo que se suele hacer en estos casos es ejecutar el test A/B con la funcionalidad activada para la variante A y desactivada para la variante B. Después, te aseguras de que tu herramienta de mapas de calor registre las interacciones en ambas variantes para poder comparar los mapas de calor de cada una.
Al observarlos, puedes detectar fácilmente los cambios en el comportamiento de los usuarios y ver si tu nueva funcionalidad tuvo el impacto esperado.
Un ejemplo de esto sería añadir un botón “Descargar todo” en la página del explorador de archivos de tu producto de almacenamiento en la nube. Si la gente empieza a interactuar activamente con dicho botón en lugar de descargar los archivos uno a uno, tu funcionalidad habrá sido un éxito.
Cómo usan los diseñadores UX los mapas de calor del ratón
Los mapas de calor son una herramienta fantástica para examinar las interacciones de los usuarios. Por ello, considero que es uno de los elementos imprescindibles en el arsenal de los diseñadores UX. Aquí tienes algunas de las formas en que mi equipo de UX ha utilizado mapas de calor de ratón para mejorar sus diseños.
#6: Mejorando la tasa de finalización de formularios
No importa qué tipo de producto tengas, lo más probable es que tengas al menos un formulario en tu embudo de activación o monetización. Además, según mi experiencia, lo más probable es que pierdas personas/conversiones en el paso del embudo donde completan este formulario.
La principal razón por la que los pierdes suele ser una mala experiencia de usuario que los deja aburridos o frustrados. Para entender si esto está ocurriendo en tu formulario y solucionarlo, los diseñadores de productos suelen realizar pruebas de usabilidad y observar de cerca el comportamiento de sus usuarios. El problema con estas pruebas, sin embargo, es que consumen mucho tiempo y recursos.
Sin embargo, los análisis de formularios con mapas de calor de ratón pueden identificar una parte significativa de los problemas de usabilidad a una fracción del costo.
Por ejemplo, si ves una gran caída en tu formulario de registro o de pago y miras el mapa de calor, podrías descubrir que hay una actividad significativa del ratón en los primeros campos, y luego la actividad disminuye repentinamente en el campo de “número de teléfono”.
Esto podría indicar que las personas no se sienten cómodas compartiendo sus números de teléfono contigo y deberías considerar una forma alternativa de identificarlas.
#7: Solucionando problemas de navegación
A veces la disminución en el descubrimiento y uso de tus funciones o secciones del sitio web se debe a que los usuarios no pueden encontrarlas en tu plataforma.
Si tienes una tienda online que acaba de empezar a vender zapatillas deportivas profesionales (por ejemplo, lucha, baloncesto, etc.), lo natural sería añadir una nueva sección en tu navegación existente y dar el día por terminado.
Sin embargo, imagina que el tráfico a tu sección de zapatillas deportivas es mucho menor de lo que esperabas. Tras revisar el mapa de calor del ratón, podrías observar que muy pocas personas pasan el cursor por esa sección deportiva en tu navegación.
Por un lado, esto podría deberse a la falta de interés en zapatillas deportivas. Por otro lado, puede que la gente ni siquiera haya notado que la agregaste, simplemente porque la lista de tipos de calzado que tienes en la navegación es bastante extensa.
Aunque tiene mucho sentido mantener organizadas tus secciones, si añades algo nuevo, deberías ubicarlo en un lugar destacado (al menos al principio). Así, un diseñador UX podría considerar colocar esta nueva sección directamente en la barra de navegación superior. Alternativamente, podría mantenerla en el mismo lugar pero añadirle una etiqueta de “nuevo” para atraer más miradas.
#8: Mejorando la legibilidad
Este caso es especialmente relevante para blogs u otros recursos con contenido extenso. A veces, la forma en que has diseñado tu texto afecta negativamente su legibilidad, provocando que los usuarios abandonen el artículo.
Al igual que en los casos anteriores, esto se puede diagnosticar mediante mapas de calor de ratón. Por ejemplo, si observas el mapa de calor y ves que la gente pasa el cursor del ratón por cada línea de tu texto, puede que la sección de texto sea demasiado ancha para que sigan cada línea con la mirada (por lo que terminan usando el cursor para ello).
Software de mapas de calor que deberías considerar
Ya que hemos cubierto los casos prácticos de uso de mapas de calor de ratón, permíteme hablarte un poco sobre los diferentes productos de análisis de mapas de calor que ofrecen esta herramienta y mostrarte las diferencias en la forma en que lo abordan.
Hotjar
Hotjar no tiene un mapa de calor de ratón como tal. En su lugar, ha dividido la información que normalmente encuentras en un mapa de calor de ratón común en distintos tipos de mapas. Es decir, tienes mapas de clics del ratón, mapas de desplazamiento, mapas de movimiento del ratón y mapas de clics de frustración. Así es como se ve su mapa de movimiento.
Si bien tener mapas separados parece inconveniente a primera vista, son mucho mejores para proporcionarte datos más detallados para cada tipo de interacción (por ejemplo, desplazamiento).
Además, también viene con funcionalidades adicionales, como el conteo en tiempo real de visitantes en el sitio web, repeticiones de sesiones, representación visual de las zonas de interacción en el diseño de la página, etc.
Crazy Egg
Con Crazy Egg, obtienes un mapa de calor que incluye conjuntos de datos tanto de clics de usuarios como de movimientos del ratón. Con sus algoritmos patentados, pueden combinar estos dos tipos de interacciones distintas en un único mapa que muestra las áreas generales de interés para tus usuarios.
Comparado con Hotjar, obtienes un poco menos de granularidad. Sin embargo, este tipo de mapa de calor combinado es bastante útil cuando tu objetivo es obtener una visión general de cómo las personas interactúan con tu experiencia de usuario en lugar de identificar las ubicaciones exactas de los clics, profundidad de desplazamiento, etc.
Al igual que Hotjar, también obtienes grabaciones de sesión y otras capacidades analíticas con Crazy Egg.
Mouseflow
Al igual que Hotjar, Mouseflow te proporcionará 6 tipos distintos de mapas de calor de seguimiento del ratón en lugar de uno solo combinado. Obtienes los tipos habituales, incluyendo mapas de calor de clics, movimientos del ratón y desplazamiento.
Sin embargo, Mouseflow también viene con un tipo especial de mapa de calor que rara vez se encuentra en estas plataformas: el mapa de calor geográfico.
En lugar de visualizar la interacción de los usuarios en tu experiencia de usuario, este mapa de calor te mostrará el mapa mundial y destacará las partes del mundo donde obtienes más usuarios (y más interacciones).
Algo Imprescindible en Entrevistas de Usuario y Pruebas de Usabilidad
Sostengo que las entrevistas con usuarios son la actividad más valiosa que realizan los responsables de producto. Pero, al igual que las pruebas de usabilidad, es una tarea que consume bastante tiempo.
Por eso, considera usar mapas de calor de mouse como una alternativa fantástica (y barata) para responder a algunas de las preguntas más sencillas que tienes sobre tus clientes y así reservar tu valioso tiempo de entrevistas para aquellas preguntas más complejas.
¿Buscas más formas de mejorar tus productos? Refuerza tus conocimientos y habilidades en esta fascinante profesión nuestra suscribiéndote a nuestro boletín. Te mantendrás al día sobre los últimos temas de gestión de producto con nuestro contenido educativo de primer nivel y listas de software.