¿Sabes al detalle qué hacen los usuarios cuando entran en tu web?
Lejos de elucubrar, existen herramientas de analítica digital cualitativa que te permiten obtener la respuesta para tomar decisiones estratégicas.
En este artículo, examinamos la herramienta Smartlook, la cual nos permite analizar el comportamiento de los usuarios dentro de nuestra web.
Cuenta con mapas de calor, grabaciones de sesión, funnels y diversos informes.
Eso sí, entre los puntos fuertes de Smartlook destaca su modelo de medición que casa por completo con el nuevo modelo de Google Analytics 4.
María Sánchez, responsable de CRO y UX en Webpositer Agency, da un recorrido completo a este recurso con un completo tutorial de Smartlook para principiantes.
Uso de dashboard en Smartlook
Para mostrarte todos los detalles de Smartlook en el vídeo hemos utilizado una cuenta de prueba de reciente creación y la cuenta “demo” que nos facilita la propia herramienta.
Una vez hayamos instalado el código de Smartlook dentro de nuestra página web, la herramienta empezará a recoger datos en su panel.
Así que lo primero que nos encontramos cuando accedamos a él será la sección de dashboards, en la que podemos ver un pequeño panel de control con las métricas principales del proyecto:
- Landing pages con mayores visualizaciones
- Tipos de dispositivo que más visitas nos traen
- Top de páginas más vistas
- Gráfico de países de procedencia de nuestros usuarios y usuarias
- Listado de navegadores con mayor número de visitantes
Este dashboard inicial se puede personalizar, moviendo las tarjetas a placer y editando o eliminando las existentes.
Además, también podemos añadir nuevas secciones a este dashboard.
Por ejemplo, si quisiéramos añadir una tarjeta más que nos mostrara el porcentaje de visitantes nuevos y recurrentes, podríamos hacer clic en el signo “más” y, en el desplegable que aparece, buscaríamos la opción indicada. Al guardar ya nos aparecería la tarjeta en nuestro dashboard.
¿Para qué sirven las grabaciones de sesión de Smartlook?
La siguiente sección que encontramos es la sección de recordings o grabaciones de sesión, la cual también ofrecen otras herramientas de análisis cualitativo similares.
En el caso de Smartlook, al acceder a ella, encontramos el listado de grabaciones a la derecha de la pantalla con los detalles de cada screencast:
- Fecha
- Número de eventos registrados
- Duración de sesión
- URL visitadas
- Dispositivo y navegador utilizados
- Ubicación
- Referrer
- URL de destino
- Detalles UTM si la URL lo especifica
El volumen de grabaciones que recopila la herramienta es alto, con lo cual, necesitamos tener un buen sistema de filtrado o segmentación para ver solo las grabaciones que nos interesen en cada momento.
Afortunadamente, la herramienta de analítica digital Smartlook cuenta con un sistema de segmentación con muchas opciones.
¿Cómo activar la segmentación en Smartlook?
Haz clic en el botón “Edit segments” y aparecerán todas las opciones de segmentación.
Entre ellas, encontramos las básicas como duración de la sesión, número de páginas por visita o landing page.
También muestra otras interesantes como referrer o las opciones relacionadas con los eventos que nos permitirían filtrar e identificar las grabaciones de sesión en las que se hayan registrado eventos configurados por nosotros mismos o eventos en los que haya habido errores o “rage clics” (clics de rabia).
¿Qué son los rage clics?
Los “rage clics” o clics de rabia son aquellos que se producen en gran cantidad y en un breve período de tiempo.
A menudo, los pueden indicar fallos de funcionamiento, fallos de comprensión de elementos o falta de claridad a la hora de realizar procesos.
Al igual que otras herramientas de análisis web del comportamiento del usuario, Smartlook también permite combinar varios tipos de filtros antes de guardar el segmento.
De esta forma, podríamos identificar, por ejemplo, las sesiones que hayan venido desde un dispositivo mobile, hayan iniciado el proceso de checkout y hayan registrado “rage clics”
Al entrar en cada una de las grabaciones, volvemos a encontrar los detalles del usuario y la grabación en la parte izquierda; en la zona central, podremos ver el propio vídeo de la sesión y debajo del mismo, unos controles.
Controles a tener en cuenta en las grabaciones web de Smartlook
“Report a bug” o reportar un error
Este control permite capturar en directo cualquier error que se haya quedado registrado en la grabación y pasárselo directamente a tu equipo de IT.
De esta forma, ya no tendrás que simular cuál era el problema para intentar explicar qué ocurría, sino que tus programadores podrán verlo en acción y solucionarlo.
“Add to the vault”
Sirve para guardar la grabación dentro de un repositorio y localizarla rápidamente en otro momento.
Sin embargo, hay que puntualizar que esta opción solo está disponible para las versiones de pago de la herramienta de analítica digital Smartlook.
“Devtools”
Accede a este control desde una pestaña llamada “Network” – actualmente en Beta – la cual nos muestra los tiempos de carga de todos los recursos Ajax, Javascript y CSS, a medida que la grabación avanza.
Gracias a este recurso de Smartlook, puedes detectar algún fallo importante respecto a la velocidad de carga de nuestra página.
Ahora que las Core Web Vitals son tan relevantes, esta información sin duda ayuda a mejorar el proyecto.
Cómo usar los headmaps en Smartlook
Dentro de este tutorial sobre Smartlook, dedicamos un repaso rápido a la sección de heatmaps o mapas de calor.
No obstante, como María indica en el vídeo, no ofrece información de especial relevancia frente a otras herramientas de analítica web cualitativa.
Uno de los principales inconvenientes que presenta es el límite de “views” que registra cada heatmap en Smartlook.
Cuando creamos un mapa de calor para una determinada URL, este tiene un límite de visualizaciones (concretamente 1000 para la versión gratuita) y, al llegar a esa cifra, se para y ya no recoge más datos.
El siguiente paso implica activar manualmente dicho heatmap en Smartlook para que vuelva a empezar de nuevo con la recopilación.
En otras herramientas similares se opta por dejar el sistema de mapeado constantemente recopilando y actualizando datos de todo el site.
Así, al consultar el heatmap de cualquier URL, con independencia del momento, siempre está disponible.
¿Cómo crear un mapa de calor en Smartlook?
- Pulsa sobre el botón “Create heatmap” y en la ventana emergente que aparece indica la URL que quieres mapear. Elige el tipo de concordancia deseada.
- A continuación, asígnale un nombre al mapa.
- Selecciona la precisión o límite de visualizaciones.
- Además, tendrás la opción de usar los datos del histórico de la herramienta de analítica web Smartlook sobre esa URL y añadir un filtro.
Consejos para aprovechar la sección Events en Smartlook
Llegamos a la parte más interesante de la herramienta: la sección de “Events”.
Como indica al inicio del vídeo, esta función es muy similar a la que recientemente ha incorporado Google Analytics en su nueva versión 4.
Si has trabajado con Google Analytics 4, habrás visto que todo funciona con eventos. Una visita a una página es un evento; un clic en un elemento es un evento; un movimiento de scroll es un evento, y así con todo.
En la herramienta de analítica web Smartlook la dinámica se mantiene, lo que supone una gran ventaja porque nos permite reproducir exactamente los mismos eventos y conversiones en nuestra herramienta de medición cuantitativa (Google Analytics) y en nuestra herramienta de medición cualitativa (Smartlook). Así, podremos analizar de forma más cohesionada.
Pasos para crear eventos en Smartlook
- Pulsa sobre “create new event” en la sección correspondiente
- Selecciona el tipo de evento a crear desde la ventana emergente
- Visited URL
Imagina que quieres controlar todas las visitas que se han registrado en la página de gracias tras descargar tu catálogo online. Para ello, tendríamos que crear un evento de tipo “visited URL” indicando qué URL queremos medir.
- Clicked-on text
Por el contrario, si deseas conocer cuánta gente pulsa sobre el botón de “Te llamamos gratis”, en ese caso podríamos optar por crear un evento de “Clicked-on text” y, dentro de la configuración, especifica el texto exacto de nuestro CTA, que sería “Te llamamos gratis”.
- Clicked-on CSS selector
Ahora pongamos que en nuestra página web tenemos dos botones de “Te llamamos gratis”; uno en la cabecera de la página y otro en el pie de página.Nos interesa saber cuál de los dos recibe más clics, con lo cual la opción de crear un evento “clicked-on-text” ya no nos serviría, porque se activaría cuando un usuario pulsara sobre cualquier de los dos indistintamente.En ese caso, la opción más idónea sería generar un evento del tipo “Clicked-on CSS selector”.
Este evento lo que hace es detectar el clic en cualquier elemento de nuestra página, ya sea un texto, un botón, un enlace, etc.
- Una vez seleccionado este tipo de evento, la herramienta nos pide que le indiquemos qué selector CSS debe localizar para registrar los clics.
Para incluirlo, deberemos hacer lo siguiente:
Desde el navegador Google Chrome, en primer lugar, localiza el elemento que queremos controlar.
- Visited URL
- Pon el puntero del rato por encima de él y haz clic con el botón derecho del ratón.
- Selecciona la última opción de “inspeccionar”
- En la parte inferior de la pantalla aparecerá una nueva ventana con código y en ella verás un elemento destacado sobre el que deberás hacer clic nuevamente con el botón derecho del ratón.
- Selecciona la opción “Copy” y a continuación “Copy selector”
- Ahora vuelve a Smartlook, pega ese selector y guarda ese evento.
Si no te aclaras mucho con el código, la herramienta de analítica web Smartlook también ofrece una opción más fácil para detectar el selector CSS de tus elementos.
Solo tienes que seguir estos pasos:
- Haz clic sobre el botón “Pick event on page”
- Introduce la URL de tu página y pulsa sobre “Go to page”
¡Importante! La URL que incluyas aquí debe tener insertado el código de Smartlook, de lo contrario este proceso no funcionará.
-
- Ahora Smartlook te redirigirá hacia la página indicada y te mostrará una pequeña ventana en la que deberás pulsar sobre “Pick element”
-
- Al pasar el ratón por los diferentes elementos de tu página, verás que se van encuadrando. Así que sitúa el ratón sobre el elemento que quieras y haz clic con el botón izquierdo.
-
- Ahora verás que en la ventana emergente de Smartlook aparecen los datos registrados sobre ese elemento, incluido su selector CSS.
- A continuación, nombra tu evento, pulsa sobre “Save”y ya tendrás tu nuevo evento creado.
Una vez tengas configurados tus eventos, desde la sección “Events” podrás:
- Ver su evolución en un diagrama temporal
- Compararlos con otros eventos creados
- O incluso ver el detalle de cada evento y averiguar desde qué localizaciones, dispositivos, navegadores o sistemas operativos se han registrado más interacciones del mismo.
Aprende a crear funnels con la herramienta Smartlook
En la sección “Funnels” podrás crear embudos de conversión utilizando los diferentes eventos que previamente has generado.
De esta forma, y al igual que en Google Analytics 4, contarás con funnels que combinarán páginas vistas con eventos de clic, de descarga, de interacción, etc.
En el ejemplo que María muestra en el videotutorial de Smartlook, vemos un funnel en el que aparecen todos visitantes que han visto la ficha de producto de “La liga de la justicia”; que luego hicieron clic en “Añadir al carrito”; visitaron la página del carrito; accedieron al proceso de checkout y finalmente compraron el producto.
Al igual que pasaba con los eventos, dentro de la sección “Funnel” también tenemos la opción de ver el detalle de cada paso y filtrarlo por localización y tecnología.
Lo más interesante de cualquier funnel pasa por ver cuántos visitantes se “caen” de un step a otro del embudo.
En este caso, Smartlook da la oportunidad de ver todas las grabaciones de sesión que coinciden con ese escenario.
Así resultará más sencillo detectar los fallos en nuestros procesos de conversión.
¿Cómo funciona la sección “Behavior flows” en Smartlooks?
Culminamos este tutorial sobre Smartlook, con la funcionalidad “Behavior flows”, muy similar a los “flujos” de Google Analytics 4.
Dentro de estos informes podrás detectar los diferentes caminos que siguen los usuarios dentro de nuestra página web.
Así detectarás aquellos que más afluencia registran para identificar de una forma visual qué flujos interesa potenciar y cuáles no.
Como habrás podido comprobar, la herramienta de analítica web Smartlook encaja muy bien con la nueva interfaz de Google Analytics 4 y todas sus funcionalidades.
Todo ello la convierte en una opción que merece la pena revisar si quieres mantener un sistema de medición y análisis cohesionado.
Deje su comentario