labvanced logoLabVanced
  • Research
    • Publications
    • Researcher Interviews
    • Use Cases
      • Developmental Psychology
      • Linguistics
      • Clinical & Digital Health
      • Educational Psychology
      • Cognitive & Neuro
      • Social & Personality
      • Arts Research
      • Sports & Movement
      • Marketing & Consumer Behavior
      • Economics
      • HCI / UX
      • Commercial / Industry Use
    • Labvanced Blog
    • Services
  • Technology
    • Feature Overview
    • Code-Free Study Building
    • Eye Tracking
    • Mouse Tracking
    • Generative AI Integration
    • Multi User Studies
    • More ...
      • Reaction Time/Precise Timing
      • Text Transcription
      • Heart Rate Detection (rPPG)
      • Emotion Detection
      • Questionnaires/Surveys
      • Experimental Control
      • Data Privacy & Security
      • Desktop App
      • Mobile App
  • Learn
    • Guide
    • Videos
    • Walkthroughs
    • FAQ
    • Release Notes
    • Documents
    • Classroom
  • Experiments
    • Cognitive Tests
    • Sample Studies
    • Public Experiment Library
  • Pricing
    • Licenses
    • Top-Up Recordings
    • Subject Recruitment
    • Study Building
    • Dedicated Support
    • Checkout
  • About
    • About Us
    • Contact
    • Downloads
    • Careers
    • Impressum
    • Disclaimer
    • Privacy & Security
    • Terms & Conditions
    • Third-Party Licenses
  • Appgo to app icon
  • Logingo to app icon
Learn
Guía
Videos
Guías paso a paso
Preguntas Frecuentes
Archivo de Boletines
Documentos
Aula
  • 中國人
  • Deutsch
  • Français
  • Español
  • English
  • 日本語
Guía
Videos
Guías paso a paso
Preguntas Frecuentes
Archivo de Boletines
Documentos
Aula
  • 中國人
  • Deutsch
  • Français
  • Español
  • English
  • 日本語
  • Guía
    • EMPEZANDO

      • Editor de Tareas
      • Presentación de Estímulos
      • Correctitud de la Respuesta
      • Objetos
      • Eventos
      • Variables
      • Asistente de Tareas
      • Sistema de Ensayos
      • Diseño del Estudio
        • Tareas
        • Bloques
        • Sesiones
        • Grupos
    • TEMAS DESTACADOS

      • Aleatorización y Equilibrio
      • Seguimiento Ocular
      • Cuestionarios
      • Aplicación de Escritorio
      • Estudios de Ejemplo
      • Reclutamiento de Participantes
      • Acceso a la API
        • REST API
        • API de Webhook
        • API de WebSocket
      • Otros Temas

        • Tempos Precisos de Estímulos
        • Estudios Multicuerpos
        • Seguimiento de Cabeza en Labvanced | Guía
    • PESTAÑAS PRINCIPALES DE LA APLICACIÓN

      • Descripción General: Pestañas Principales
      • Tablero
      • Mis Estudios
      • Estudios Compartidos
      • Mis Archivos
      • Biblioteca de Experimentos
      • Mi Cuenta
      • Licencia y Servicios
    • PESTAÑAS DEL ESTUDIO

      • Descripción General: Pestañas Específicas del Estudio
      • Diseño del Estudio
        • Tareas
        • Bloques
        • Sesiones
        • Grupos
      • Editor de Tareas
        • Controles de la Tarea
        • El Sistema de Ensayos
        • Marcos de Canvas y Página
        • Objetos
        • Tablas de Propiedades de Objetos
        • Variables
        • Tablas de Variables del Sistema
        • El Sistema de Eventos
        • Funciones del Editor de Texto
        • Seguimiento ocular en una tarea
        • Seguimiento de Cabeza en una Tarea
        • Estudios de Múltiples Usuarios
      • Configuraciones
      • Variables
      • Medios
      • Textos y Traducción
      • Lanzar y Participar
      • Gestión de Sujetos
      • Vista de Datos y Exportación
        • Vista de Datos y Selección de Variables y Tareas (Versión ANTIGUA)
        • Accediendo a Grabaciones (Versión ANTERIOR)
  • Videos
    • Descripción General del Video
    • Introducción a Labvanced
    • Creación de Tareas
    • Videos de Elementos
    • Eventos y Variables
    • Temas Avanzados
  • Guías
    • Introducción
    • Tarea de Stroop
    • Tarea de Decisión Léxica
    • Tarea de Señalización de Mirada de Posner
    • Paradigma de Parpadeo de Ceguera al Cambio
    • Estudio de Seguimiento Ocular
    • Estudio de Seguimiento Ocular en Bebés
    • Estudio de Captura de Atención con Seguimiento de Ratón
    • Presentación Visual Serial Rápida
    • Estudio de ChatGPT
    • Demostración de Seguimiento Ocular: SVG como Zonas de Interés
    • Demostración Multicusuario: Mostrar los Cursors de Sujetos
    • Controlador de Gamepad / Joystick - Configuración Básica
    • Estudio de Aplicación de Escritorio con Integración de EEG
    • Equilibrio de Grupos entre Sujetos y Configuración de Variables
  • Preguntas Frecuentes
    • Características
    • Seguridad y Privacidad de Datos
    • Licencias
    • Precisión de Labvanced
    • Uso Programático y API
    • Uso de Labvanced sin Conexión
    • Resolución de Problemas
    • Preguntas sobre la Creación de Estudios
  • Archivo de Boletines
  • Documentos
  • Aula

Labvanced Web Bridge — Soporte y Guía de Extensión

¿Necesitas ayuda? Contáctanos en [email protected]

Tabla de Contenidos

  • ¿Qué es Labvanced Web Bridge?
  • Instalación
  • ¿Quién Debería Instalar Esto?
  • Cómo Usarlo — Guía para Investigadores
  • Cómo Usarlo — Guía para Participantes
  • Casos de Uso
  • Datos y Privacidad
  • Solución de Problemas
  • Preguntas Frecuentes
  • Contacto y Soporte

1. ¿Qué es Labvanced Web Bridge?

Labvanced Web Bridge es una extensión de navegador para Google Chrome que conecta la plataforma de experimentos Labvanced (labvanced.com) a sitios web reales. Permite a los investigadores realizar estudios controlados de UX e investigación conductual en los que los participantes interactúan con sitios web en vivo de terceros, mientras Labvanced registra los movimientos oculares (a través de la cámara web), clics del ratón, eventos de desplazamiento y comportamiento de desplazamiento.

Sin esta extensión, los navegadores impiden que los sitios web se incrusten dentro de estudios de investigación debido a restricciones de seguridad estándar. La extensión levanta esas restricciones solo dentro de las sesiones de investigación controladas de Labvanced y añade las capacidades de seguimiento conductual necesarias para medir la interacción del participante en el sitio incrustado.

Un sitio web incrustado en Labvanced usando la extensión de chrome

2. Instalación

Paso a paso

Investigadores

  1. Navega a Google Chrome.
  2. Ve a la página de la Chrome Web Store para Labvanced Web Bridge.
  3. Haz clic en "Añadir a Chrome".
  4. En el cuadro de diálogo de confirmación, haz clic en "Añadir extensión".
  5. Verás el ícono de Labvanced Web Bridge aparecer en tu barra de herramientas de Chrome.

La extensión Labvanced Web Bridge instalada en Chrome

Participantes

  1. Haz clic en Instalar.
  2. Haz clic en "Añadir a Chrome".
  3. En el cuadro de diálogo de confirmación, haz clic en "Añadir extensión".
  4. Regresa al experimento y actualiza la página para comenzar el estudio.

Confirmando que la Extensión está Activa

Investigadores Después de la instalación, navega a la pestaña Dashboard y crea un Nuevo Estudio. Desplázate hacia abajo y activa Track External Website: marcando la casilla e introduce la URL del sitio web objetivo. Si la extensión está correctamente instalada, el editor de Labvanced mostrará una marca de verificación verde y un mensaje de confirmación.

Mensaje de confirmación verde al crear un nuevo estudio en Labvanced que confirma que la Extensión Web Bridge está instalada y funcionando.

Participantes

Al actualizar la página del experimento, el experimento continuará.

Solicitud para que los participantes instalen la extensión de Chrome

3. ¿Quién Debería Instalar Esto?

Investigadores

Instala la extensión si estás:

  • Diseñando un estudio que incluye un sitio web real como estímulo (por ejemplo, probando una página de producto, un artículo de noticias, una interfaz de quiosco).
  • Usando el elemento Website Frame en el editor de Labvanced.
  • Previsualizando o pilotando un estudio que incluye sitios web externos.

No necesitas esta extensión para estudios que solo utilizan estímulos estándar de Labvanced (imágenes, videos, texto, formularios, etc.) o si eres el propietario del sitio web que puede editar y controlar directamente tus propios encabezados HTTP para tu sitio web.

Participantes del Estudio

Instala la extensión si:

  • Has recibido un enlace de estudio y se te ha indicado que lo instales antes de comenzar.
  • La página de incorporación del estudio te pide que confirmes que la extensión está instalada.

Si no estás seguro de si la necesitas, la página del enlace de tu estudio te informará antes de que comience el estudio.

4. Cómo Usarlo — Guía para Investigadores

4.1 Agregando un Marco de Sitio Web a Tu Estudio

  1. Abre tu experimento en el editor de Labvanced.
  2. En la Cronología del Ensayo, haz clic en la opción + Website frame.
  3. Selecciona "Website Frame" de los tipos de elementos, luego la opción External Website. Si la extensión está activa, aparecerá el mensaje de confirmación verde. De lo contrario, consulta la sección anterior sobre el procedimiento de instalación.
  4. El sitio web que indicaste al crear la tarea en el paso anterior ahora aparecerá automáticamente.

4.2 Seleccionando Áreas de Interés (AOIs)

Las Áreas de Interés (AOIs) son los elementos específicos en el sitio web incrustado que deseas rastrear. Por ejemplo, una imagen de producto, un titular o un botón de "Añadir al Carrito".

  1. Con el Website Frame activo en el editor y el sitio web mostrando de forma interactiva, haz clic en el objeto Add Website AOI en el menú lateral.
  2. El objeto AOI será añadido y aparecerá en rojo. Haz clic en tu AOI objetivo. La selección ahora se volverá verde.
  • Si deseas modificar la selección de AOI, puedes utilizar el panel de Propiedades del Objeto para ajustar la selección apuntando al Parent de la selección para moverte hacia arriba y seleccionar una parte mayor del sitio web o al Child de la selección para seleccionar un componente más específico. Una vez que el AOI se ha anclado (mostrando en verde) también puedes aumentar su tamaño desplazándolo hacia afuera o disminuyendo los píxeles en las coordenadas x e y por cada lado, así como su posición.
  • También puedes usar la opción Resolution para indicar si el estudio debe ser para escritorio o móvil. En la imagen de abajo, se seleccionó móvil y los AOIs se actualizaron automáticamente.
  1. Repite para elementos adicionales.
  2. Cada AOI aparecerá en la lista de AOI y se rastreará automáticamente durante el estudio.

Incrustación de sitios web basada en móvil y vista previa de AOI

4.3 Qué Se Rastrea

Para cada AOI durante una sesión de estudio, Labvanced proporciona al investigador las siguientes posibilidades para grabar datos conductuales:

Tipo de datoDescripción
Posición del elementoEl cuadro delimitador (x, y, ancho, altura) del elemento en la pantalla, actualizado en tiempo real a medida que el participante se desplaza
Datos de miradaSeguimiento ocular basado en cámara web mapeado a posiciones de elementos (requiere que el seguimiento ocular esté habilitado en la configuración del estudio)
Eventos de clicSi y dónde hizo clic el participante dentro del elemento
Eventos de desplazamientoCuando el ratón del participante entró y salió del elemento
Movimiento del ratónCoordenadas del ratón a medida que el participante se mueve por la página
Posición de desplazamientoEl desplazamiento de la página en cada momento

4.4 Previsualizando Tu Estudio

Antes de publicar, siempre previsualiza tu estudio con la extensión instalada para confirmar:

  • El sitio web se carga correctamente en el marco.
  • Los AOIs están funcionando como se esperaba.

Primero guarda la tarea, luego haz clic en el botón de play de "Previsualizar" en la barra de herramientas del editor bajo Controles de Tarea para abrir una vista previa de participante de la tarea específica.

4.5 Publicando y Compartiendo

Una vez que tu estudio esté listo:

  1. Ve a la pestaña Lanzar y Participar.
  2. Haz clic en el botón Activar para habilitar las grabaciones de datos para tu estudio.
  3. Bajo Participación en Línea / Estudio Publicado, haz clic en Publicar.
  4. Copia el Enlace de Participación en Línea y compártelo con tus participantes.

5. Cómo Usarlo — Guía para Participantes

Antes del Estudio

  1. Recibirás un enlace directo a un estudio de investigación Labvanced del investigador.
  2. Si la extensión aún no está instalada, la página del estudio mostrará un aviso de instalación con un enlace directo a la Chrome Web Store.
  3. Instala la extensión, luego regresa al enlace del estudio y actualiza la página.
  4. Una vez que el estudio confirme que la extensión está instalada, haz clic en Comenzar para iniciar.```markdown

Durante el Estudio

  • Utiliza e interactúa con el sitio web que se te muestra como lo harías normalmente: navega, haz clic y desplázate según las instrucciones.
  • La extensión funciona silenciosamente en segundo plano. No necesitas interactuar con ella.
  • No hagas clic en el ícono de la extensión durante el estudio; no es necesario.

Después del Estudio

  • Completa cualquier pregunta posterior al estudio si se te solicita.
  • Una vez que el estudio termine, puedes desinstalar la extensión si ya no la necesitas:
    • Haz clic derecho en el ícono de la extensión en la barra de herramientas → "Eliminar de Chrome".

Eliminando la extensión de Chrome de Labvanced.

6. Casos de Uso

6.1 Investigación de UX en E-commerce

Incrusta una página de listado de productos o de pago. Rastrea qué imágenes de productos fijan la atención de los participantes, qué botones de "Añadir al carrito" hacen clic y cuán lejos se desplazan antes de tomar una decisión.

Ejemplo de un sitio web de librería e-shop incrustado en Labvanced

6.2 Estudios de Atención en Noticias y Medios

Incrusta un artículo de noticias o una página de inicio. Mide cuáles titulares atraen más atención, cómo varían los patrones de lectura según la longitud del artículo y qué imágenes llaman la atención primero.

Ejemplo de un sitio web de noticias incrustado en Labvanced

6.3 Pruebas de Navegación y Arquitectura de Información

Incrusta el menú de navegación de un sitio web o un flujo de múltiples páginas. Registra clics y tiempos de permanencia en desplazamiento para evaluar la claridad de las etiquetas del menú y la facilidad de búsqueda.

6.4 Estudios de Comparación (A/B)

Crea dos ensayos con diferentes versiones del sitio web incrustadas. Aleatoriza a los participantes entre las condiciones usando el contrabalanceo incorporado de Labvanced. Compara métricas de AOI entre grupos.

7. Datos y Privacidad

¿Qué datos recopila la extensión?

La extensión recopila lo siguiente solo cuando estás dentro de una sesión de investigación activa de Labvanced:

  • Posiciones de cuadros delimitadores (x, y, ancho, alto) de los elementos de la página seleccionados por el investigador
  • Coordenadas del mouse, posiciones de clics, eventos de movimiento del mouse y trayectorias de movimiento del mouse
  • La posición actual de desplazamiento de la página y la URL de la página
  • Fragmentos de texto visibles de elementos sobre los que se pasa el cursor o se hace clic (cortados a 50 caracteres)

Los campos de contraseña y las entradas de formulario sensibles nunca se leen. La extensión excluye explícitamente <input type="password"> y entradas con atributos de autocompletado sensibles (autocomplete="password", cc-*). Estos devuelven valores vacíos en todos los casos.

¿A dónde van los datos?

Todos los datos se transmiten exclusivamente a la página labvanced.com incrustada a través de la API postMessage del navegador. La extensión no envía ningún dato a servidores externos, no almacena nada localmente y no recopila ningún dato durante la navegación normal fuera de un estudio de Labvanced.

¿La extensión me rastrea en otros sitios web?

No. Los scripts de contenido de la extensión se inyectan en todos los iframes (porque el dominio del sitio web de destino no se puede conocer de antemano), pero salen inmediatamente a menos que location.ancestorOrigins confirme que labvanced.com es un marco antecesor. En cualquier sitio web no incrustado por Labvanced, no se instalan escuchadores, no se lee el DOM y no fluyen datos.

¿La extensión modifica algo fuera de Labvanced?

No. La extensión elimina las restricciones de incrustación de iframes (encabezados X-Frame-Options / Content-Security-Policy) solo en las pestañas del navegador cuya URL de nivel superior es labvanced.com. Todas las demás pestañas quedan completamente afectadas. Estas reglas se almacenan solo en memoria y se eliminan cuando se cierra la pestaña o se navega a otra página.

Política de Privacidad Completa

Consulta la política de privacidad completa en: https://www.labvanced.com/extension-privacy-policy.html

8. Solución de Problemas

El sitio web no carga en mi estudio

Causas y soluciones posibles:

SíntomaCausa probableSolución
Marco blanco en blancoExtensión no instalada o desactivadaVerifica que la extensión esté habilitada en chrome://extensions
El sitio web no es interactivo ni responsivoEl sitio detecta incrustación de iframe a nivel de JSAlgunos sitios no pueden ser incrustados; contacta a [email protected]

El ícono de la extensión muestra una advertencia o está atenuado

  • Haz clic en el ícono para abrir la ventana emergente y leer el mensaje de estado.
  • Asegúrate de estar en una página de labvanced.com o de tener un estudio de Labvanced abierto.
  • Intenta desactivar y volver a activar la extensión desde chrome://extensions.

El selector de elementos no resalta elementos

  • Asegúrate de que la extensión esté habilitada y de que estés en el editor (no en modo de vista previa).
  • Algunos sitios web utilizan estructuras Shadow DOM o iframe dentro de iframes que limitan la selección de elementos. Intenta seleccionar un elemento Padre a través del panel de Propiedades del Objeto.
  • Actualiza el editor y vuelve a intentarlo.

9. Preguntas Frecuentes

P: ¿Es gratuita la extensión? R: Sí. La extensión es gratuita para instalar y usar. Se requiere una cuenta de Labvanced para diseñar estudios.

P: ¿Funciona en otros navegadores (Firefox, Safari, Edge)? R: Actualmente solo se admite Google Chrome. Microsoft Edge (basado en Chromium) puede funcionar, pero no está oficialmente soportado o probado.

P: ¿Necesito dejar la extensión instalada después del estudio? R: No. Los participantes pueden desinstalarla inmediatamente después de completar el estudio. Haz clic derecho en el ícono de la extensión → "Eliminar de Chrome".

P: ¿La extensión ralentizará mi navegador? R: La extensión está inactiva fuera de las sesiones de Labvanced. No agrega ningún tiempo de carga a la navegación normal.

P: ¿Puede ver mis contraseñas o información bancaria? R: No. Los campos de contraseña (<input type="password">) y las entradas de tarjetas de crédito están excluidos explícitamente y devuelven valores vacíos en todos los casos. La extensión nunca lee ni transmite datos sensibles de formulario.

P: Soy investigador, ¿puedo usar esto para rastrear un sitio web que el participante está visitando por su cuenta? R: No. La extensión solo se activa dentro de los iframes incrustados por labvanced.com. No puede rastrear sitios web que los participantes visitan de forma independiente en otras pestañas.

P: La política de TI de mi institución requiere una revisión de la extensión antes de que los empleados puedan instalarla. ¿A quién puedo contactar? R: Contacta con nosotros en [email protected] con tu solicitud.

10. Contacto y Soporte

Correo electrónico: [email protected]

Documentación: https://www.labvanced.com/content/learn/es/en/guide/

Foro comunitario en Discord: https://discord.com/invite/SBpFJnVZah

Informes de errores: Por favor incluye:

  • Tu versión de Chrome (chrome://settings/help)
  • La URL del sitio web que estás tratando de incrustar
  • Una captura de pantalla de cualquier mensaje de error
  • Pasos para reproducir el problema



Labvanced Web Bridge es desarrollado y mantenido por Scicovery GmbH. Para la política de privacidad completa, visita https://www.labvanced.com/extension-privacy-policy.html