Eye-tracking y navegación UX

1) Por qué usar Eye-tracking

El aitrecking muestra exactamente cómo los usuarios escanean la interfaz: que notan que ignoran dónde se pierden. Complementa las métricas de clics y scroll, revelando la ruta de atención y la conformidad de la jerarquía visual con las tareas del usuario.

• Validación de la arquitectura de navegación e información (menús, filtros, búsquedas).
• Validación de la primera pantalla/above el fold y colocación de acentos.
• Comparación de las variantes de tarjetas/directorios/tablas (F-pattern, Z-pattern, diagrama de Gutenberg).
• Diagnóstico de ceguera de pancartas, sobrecarga y «ruido visual».
• Productos con alta tasa de precisión: finanzas, apuestas, mercados en vivo, cacher.

2) Qué artefactos da el aitreking

Heatmap (mapa de calor): intensidad agregada de las fijaciones por área.
Gaze plot/Scanpath: secuencia de fijaciones (puntos numerados) y saccade (flechas).
Métricas AOI: métricas por zona de interfaz dada (botones, campos, menús, banners, tarjetas, tablas).
Matrices transitorias: cómo los usuarios «saltan» entre zonas (hábitos de navegación).
Informes de segmentos: diferencias en la atención por roles/dispositivos/experiencia.

3) Patrones básicos de atención

F-pattern (textos/tablas): fila superior → columna izquierda → horizontal abajo.
Z-pattern (lendings): parte superior izquierda → superior derecha → diagonal → inferior derecha.
Diagrama de Gutenberg: cuadrantes fuertes/débiles, vía natural de lectura.
Zonas ciegas: áreas derecha/inferior en pantallas densas, «ceguera de pancartas».
Anclas competitivas: dados de descuento, elementos parpadeantes, pancartas animadas - «roban» la atención de la CTA.

4) Métricas con las que operamos

• TTFF (Time to First Fixation) - Tiempo hasta la primera fijación en la zona.
• Fixation count/duration - número/duración total de las fijaciones.
• Tiempo de Dwell: tiempo total en la zona (incluidas las entradas repetidas).
• Revisiones - Número de devoluciones a AOI (signo de dificultad/importancia).
• Transition probability - Probabilidad de transición de AOI A a B.
• Sequence score/orden de fijación - qué tan temprano la zona entra en la secuencia.
• Scanpath length/Entropy - Longitud/caótica de la ruta (baja entropía = jerarquía clara).
• Coverage/Convex hull - Área de reconocimiento visual (redundancia = sobrecorriente).

• Bajo TTFF y alto dwell en CTA: bueno (rápidamente notado, pensado y hecho clic).
• El alto TTFF en la navegación es malo (se buscó el menú durante mucho tiempo).
• Muchas devoluciones a un bloque - sospecha de ambigüedad o acción obligatoria sin pistas.

5) Plan de investigación (plantilla)

Objetivo: comprobar si el usuario encuentra elementos clave de navegación de forma rápida y predecible.
Segmentos: 2-3 (principiantes/experimentados; escritorio/móvil).
Muestra: 6-8 por segmento (cualitativamente) o 25-60 (cuasi-cuantitativamente).
Tareas: 5-7 escenarios realistas con inicio controlado (ver más abajo).
Equipo: rastreador fijo/instalación móvil/webcam (ver § 7).
AOI: marcar los elementos clave de antemano (logotipo/búsqueda/menú/filtros/STA/banner/tarjeta/tabla/cacher).
Procedimiento: calibración → tarea → fijación de resultados → debrief corto sin preguntas sugerentes.
Salida: heatmap, scanpath, tabla de métricas AOI, recomendaciones e hipótesis A/B.

Plantilla de scripts de tareas

1. «Localiza y activa el Tema Oscuro (o establece un límite de apuestas)».
2. «Filtre el directorio por proveedor X y ordene por RTP».
3. «Abra el cacher y vea los métodos de salida disponibles».
4. «Localiza el evento en vivo y añade el resultado a betslip».
5. «Encuentra la página de Reglas y Juego Responsable».
Para cada paso, fijamos el TTFF, las transiciones, el éxito y el tiempo de ejecución.

6) Marca AOI: mejores prácticas

Haga que las zonas sean semánticas: «Menú principal en su totalidad», «Buscar», «Filtros», «Carta del juego: portada», «CTA: Jugar», «Banner promo», «Migas de pan».
Separe los informantes (etiquetas, estados) y los interactivos (botones).
En el móvil, tenga en cuenta los paneles ocultos (hamburguesa/cortina) como AOI separados.
Para tablas/coffes: AOI individuales por columnas («Liga», «Indicador en vivo», «Oudof 1X2», «CTA Añadir»).
No triture hasta píxeles: 10-15 AOI por pantalla - óptimo para el análisis.

7) Equipos, precisión y limitaciones

Rastreadores de hardware (rigas de escritorio/móviles): alta precisión, buenos para UI densos (tablas, coeficientes).
Webcam (remote ET): más barato/más rápido, pero más alto ruido, peor para finalidades menores; es bueno para una jerarquía grosera.
Calibración: crítica: 5-9 puntos; repetición en desplazamiento/fatiga.
Think-aloud puede distorsionar el patrón de la mirada - use mínimamente, mejor interview post-task.

8) Pipeline analítica

1. Calidad de datos: precisión de seguimiento, porcentaje de pérdidas, fijaciones válidas.
2. Resumen de tareas: éxito, tiempo, errores, escalas subjetivas (SEQ/UMUX-Lite).
3. Tabla AOI: TTFF, dwell, revisits, transiciones, entropy - por segmentos y dispositivos.
4. Heatmap + Scanpath: buscando anclajes de atención extra, «zalips», pases.
5. Hipótesis y soluciones: qué reorganizar/ampliar/cambiar de nombre/ocultar; cuáles son las pistas/skefolding.
6. Priorización: Impact × Effort; revisiones rápidas → prototipo → pruebas repetidas de control.
7. Validación: A/B en métricas clave (CTR por navegación, tiempo por tarea, conversión de paso).

9) Hallazgos típicos y cómo reaccionar ante ellos

Alto TTFF en la búsqueda/filtros → hacerlos constantemente visibles, aumentar el contraste/etiqueta.
El banner arrastra la atención desde el CTA primario → reducir el peso visual del banner, intercambiar posiciones, agregar el marco/peso de la fuente CTA.
Scanpath largo por tarjetas → simplificar las primitivas visuales (menos dados/etiquetas), estandarizar la vista previa.
Detección débil de estados/errores → color/iconos + proximidad al campo, etiqueta ARIA, microcopiraiting.
Callejones sin salida de navegación → «devoluciones» explícitas, breadcrumbs, gorra fija duplicando CTA.

10) Para iGaming/IU financiera: ejemplos de AOI y soluciones

Casher: pestañas «Depósito/Retiro», métodos, límites, comisiones, ETA → verificamos el TTFF y el camino a «Confirmar».
Betslip: agregando el resultado, cambiando la suma, las pistas de los coeficientes, los riesgos-varnings → minimizamos las microevoluciones de la mirada.
Mercados en vivo/tablas de dóif: prioridad de la columna de coeficientes, gorra pegajosa, retroiluminación de cambios.
Lobby Slots: tarjeta de proveedor, insignias (jackpot/freespins), filtros mecánicos → evitamos el ruido visual para que el CTA «Play» no se pierda.
Juego responsable: poner límites en la zona de alta atención, no esconderse detrás de la hamburguesa.

11) Plantilla de informe (copiar en wiki)

Contexto: producto/versión/dispositivo

Tareas: lista, criterios de éxito

Segmentos: N por cada

AOI: esquema/lista

Métricas clave: tabla TTFF/dwell/revisits/transiciones

Hallazgos (Top-5): breve + visual (heatmap/scanpath)

Recomendaciones: clasificadas (Impact × Effort)

Experimentos: A/B-plan, efecto esperado, plazo

Riesgos/observaciones: limitaciones de datos/generalidad

12) Lista de comprobación antes del inicio

• Objetivos/cuestiones de investigación formulados
• Las tareas son realistas y atomáticas (≤60 segundos/tarea)
• AOI está marcado, leyenda acordada
• Calibración comprobada, repetición durante el desplazamiento
• Las opciones de interfaz están contrabalanceadas (orden A/B)
• La recopilación de consensos y la política de privacidad están listos
• Plan de análisis/plantillas de tabla preparadas
• Las métricas de control de UX (éxito, tiempo, SEQ) están conectadas

13) Antipattern y trampas de interpretación

Considerar «más fijaciones = mejor». A veces es una confusión.
Sacar conclusiones sólo por heatmap sin secuencia (scanpath).
Mezclar diferentes pantallas/resoluciones en un solo heatmap.
Ignorar el contenido y el contexto de la tarea (el banner puede ser apropiado).
Transferir las conclusiones a todos los usadores sin segmentación/dispositivo.
Sacar conclusiones notorias en 5 participantes como en un estudio cuantitativo.

14) Ética y privacidad

Consentimiento informado: fines, registro, almacenamiento, anonimización.
Minimice el PII, almacene datos crudos de forma limitada, use el ID.
Para escenarios sensibles (finanzas/juegos) - lenguaje suave, la oportunidad de omitir una pregunta, datos de demostración seguros.

15) Inicio rápido (one-pager)

1. Describa 3-5 tareas clave de navegación.
2. Marque 10-15 AOI en las pantallas de destino.
3. Realice 8-10 sesiones (10-12 min cada una): calibración de la tarea → → breve debrief.
4. Combine la tabla AOI (TTFF, dwell, transiciones, entropy) por segmento/dispositivo.
5. Forma Top-5 hallazgos y 3-5 hipótesis A/B (posiciones, dimensiones, copyright, visibilidad).
6. Ejecute revisiones rápidas → aitrecking de control en las mismas tareas.