Experimentación A/B

Pro Feature

Define un experimento en el panel, integra una línea de JavaScript en tu sitio, y Zenovay asignará de forma determinista una variante a cada visitante e informará las tasas de conversión por variante junto con un intervalo de confianza del 95 % sobre el incremento frente a la variante de control.

---

Cómo funciona

La asignación del visitante se calcula localmente en el tracker mediante un hash determinista del ID de visitante, de modo que el mismo visitante siempre ve la misma variante — incluso al recargar la página y (cuando las cookies están habilitadas) entre sesiones. En modo cookieless (predeterminado para los sitios que cargan el tracker con data-cookieless="true"), la asignación queda confinada a la ventana y se reinicia al cerrar la pestaña.

---

Configurar un experimento

1. En el panel, abre tu sitio web → pestaña Experiments → New experiment.
2. Pon nombre al experimento, describe opcionalmente una hipótesis y elige un objetivo entre tus objetivos personalizados existentes.
3. Añade entre 2 y N variantes, marca una como control y define un porcentaje de reparto del tráfico por variante.
4. Guarda como borrador y haz clic en Launch cuando esté listo.

---

Integrar el código

const variant = window.zenovay('experiment', 'checkout-cta-color', ['control', 'green', 'orange']);
if (variant === 'green')   document.querySelector('.cta').style.background = '#22c55e';
if (variant === 'orange')  document.querySelector('.cta').style.background = '#f97316';

Esa es toda la integración del lado del cliente. El tracker gestiona automáticamente la asignación, el registro de exposiciones y la atribución de conversiones — cuando el visitante dispare más tarde el objetivo previsto (a través de tu llamada existente de seguimiento de objetivos), Zenovay atribuirá la conversión a la variante que le había sido asignada.

La llamada window.zenovay('experiment', …) es idempotente — llamarla varias veces en la misma página devuelve la misma variante y registra como máximo una exposición por visitante, por experimento y por sesión. Pasa siempre el mismo arreglo variants en el mismo orden en todas las páginas; el orden forma parte del hash determinista.

---

Ejemplos por framework

El snippet de arriba es JavaScript puro y funciona en cualquier entorno de navegador. A continuación encontrarás patrones para los stacks más habituales.

HTML puro

Pega esto en cualquier lugar debajo de la etiqueta <script> del tracker de Zenovay:

<button class="cta">Buy now</button>

<script>
  // Wait for the tracker to load (it sets window.zenovay on init).
  function applyVariant() {
    if (!window.zenovay) { setTimeout(applyVariant, 50); return; }
    var variant = window.zenovay('experiment', 'checkout-cta-color', ['control', 'green', 'orange']);
    var cta = document.querySelector('.cta');
    if (variant === 'green')  cta.style.background = '#22c55e';
    if (variant === 'orange') cta.style.background = '#f97316';
  }
  applyVariant();
</script>

React / Next.js (client component)

En Next.js App Router, marca el componente con 'use client' y llama a la función dentro de useEffect para que la asignación se ejecute tras la hidratación:

'use client';
import { useEffect, useState } from 'react';

export default function CheckoutCTA() {
  const [variant, setVariant] = useState('control');

  useEffect(() => {
    if (typeof window === 'undefined' || !window.zenovay) return;
    const v = window.zenovay('experiment', 'checkout-cta-color', ['control', 'green', 'orange']);
    setVariant(v);
  }, []);

  const bg = variant === 'green' ? '#22c55e' : variant === 'orange' ? '#f97316' : undefined;
  return <button className="cta" style={{ background: bg }}>Buy now</button>;
}

Para minimizar un parpadeo de la variante de control en el primer renderizado, muestra la variante de control por defecto y deja que useEffect aplique el tratamiento tras el montaje. La exposición se registra la primera vez que se llama a window.zenovay('experiment', …).

Vue / Nuxt

En un componente con <script setup>, ejecuta la llamada desde onMounted:

<script setup>
import { ref, onMounted } from 'vue';

const variant = ref('control');

onMounted(() => {
  if (!window.zenovay) return;
  variant.value = window.zenovay('experiment', 'checkout-cta-color', ['control', 'green', 'orange']);
});
</script>

<template>
  <button
    class="cta"
    :style="{ background: variant === 'green' ? '#22c55e' : variant === 'orange' ? '#f97316' : null }"
  >
    Buy now
  </button>
</template>

Renderizado en el servidor (Next.js, Remix, Nuxt SSR)

La asignación de variantes está confinada a la ventana — el tracker solo existe en el navegador, así que cualquier llamada en el servidor devuelve undefined y en la primera pasada de SSR se pinta la rama de control. El visitante ve luego brevemente el tratamiento cuando vuelve a ejecutarse el useEffect del lado del cliente.

Dos patrones prácticos:

1. Aceptar el parpadeo de control. Para cambios visuales (color, copy) suele ser irrelevante — a la velocidad típica de hidratación, el cambio resulta invisible.
2. Renderizar el tratamiento solo en el cliente. Envuelve el bloque experimental en una frontera client-only para que el SSR no emita nada y el tratamiento se pinte una sola vez en la hidratación. Eso elimina el parpadeo a cambio de un cambio de layout.

'use client';
import dynamic from 'next/dynamic';

const ExperimentalCTA = dynamic(() => import('./CheckoutCTA'), { ssr: false });

export default function Page() {
  return <ExperimentalCTA />;
}

En V1 no existe un endpoint de asignación en el edge o en el servidor.

Google Tag Manager (GTM)

Envuelve la llamada en una etiqueta Custom HTML que se dispare después de tu etiqueta del tracker de Zenovay, y empuja la variante al dataLayer para que otras etiquetas de GTM puedan leerla:

<script>
  (function () {
    if (!window.zenovay) return;
    var variant = window.zenovay('experiment', 'checkout-cta-color', ['control', 'green', 'orange']);
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({ event: 'zenovay_experiment', experiment_id: 'checkout-cta-color', variant: variant });
  })();
</script>

Otras etiquetas de GTM (por ejemplo, una etiqueta de reescritura CSS) pueden entonces dispararse con el evento zenovay_experiment y leer {{ DLV - variant }} para aplicar el cambio visual.

---

Cómo se calcula la significación

Las tasas de conversión por variante se agregan en el servidor. El panel muestra un test z bilateral de dos proporciones para cada tratamiento frente al control, con corrección de Bonferroni sobre todas las comparaciones del experimento. Aparece un distintivo "winner" cuando se cumplen todas las siguientes condiciones:

• p-valor corregido por Bonferroni < 0,05
• Ambas variantes han alcanzado al menos el tamaño mínimo de muestra configurado (predeterminado: 100 visitantes por variante)
• El lift del tratamiento sobre el control es positivo

Es un test frecuentista de tamaño de muestra fijo. No es un test secuencial — mirar los resultados antes de que termine el experimento aumenta el error de tipo I.

---

Leer el panel

El panel de Experiments muestra un resumen de una línea por variante:

El gráfico inferior representa la tasa de conversión acumulada por variante a lo largo del tiempo, para que puedas ver cuándo empezaron las variantes a divergir (o si siguen yendo casi a la par).

---

Flujo recomendado

1. Un solo cambio por experimento. Si cambias el color del CTA y el titular a la vez, ya no sabrás cuál movió la métrica. Mantén todo lo demás constante.
2. Elige el objetivo antes de lanzar. Añadir o cambiar el objetivo durante el experimento invalida todo lo recogido hasta el momento — Zenovay te avisará y exigirá un relanzamiento.
3. Estima la muestra que necesitas. Un lift del 5 % sobre una tasa base del 2 % suele necesitar unas 30 000 visitas por variante para alcanzar significación. Usa una calculadora de tamaño muestral antes de lanzar y lanza solo experimentos que tu tráfico pueda terminar.
4. No espíes en busca de ganadores. El test frecuentista solo es válido si decides una regla de parada por adelantado. Mirar el panel a diario y detener el experimento en cuanto un tratamiento cruza p < 0,05 incrementa fuertemente la tasa de falsos positivos.
5. Archiva — no borres. Cuando termine un experimento, archívalo desde el menú. Borrar elimina también las asignaciones históricas que alimentan informes de embudo o ingresos posteriores.

---

Límites por plan

---

Privacidad y cumplimiento

La experimentación A/B está diseñada para respetar la postura de privacidad de Zenovay:

• Modo cookieless: la asignación de variantes está confinada a la ventana (solo en memoria). No se crean nuevas cookies ni entradas en localStorage.
• Los datos de asignación de variantes se incluyen en tu exportación gratuita de datos personales conforme al artículo 20 del RGPD.
• La eliminación de la cuenta cascadea sobre experimentos, variantes y asignaciones.
• La retención sigue el nivel de tu plan (Free 365 días, Pro 730 días, Scale 1.460 días).

---

Lo que no incluye la V1

• Multi-armed bandits, muestreo de Thompson, intervalos de credibilidad bayesianos — solo frecuentista.
• p-valores secuenciales / always-valid — solo muestra fija.
• Decisión de variante en servidor / edge — la asignación es del lado del cliente.
• Reglas de segmentación (geo, dispositivo, solo visitantes recurrentes) — solo asignación aleatoria.
• Grupos de experimentos mutuamente excluyentes.

---

Resolución de problemas

Mis variantes siempre devuelven null o siempre control

Las causas más probables, por frecuencia:

1. El tracker no se había cargado cuando llamaste a window.zenovay(...). La función window.zenovay la define el stub de carga de forma síncrona, pero solo es útil cuando el bundle del tracker termina de descargarse. Las llamadas anteriores devuelven undefined. Envuelve la llamada en un pequeño bucle de espera (ver el ejemplo de HTML puro) o ejecútala desde un hook del ciclo de vida del framework que se dispare después del montaje.
2. El experimento no está en estado running. El tracker solo asigna variantes a experimentos cuyo estado es running. Los borradores o experimentos en pausa devuelven el control. Abre la pestaña Experiments y comprueba el badge de estado.
3. Has pasado un array de variantes distinto al configurado en el panel. Las variantes que indicas en window.zenovay(...) deben coincidir exactamente con los slugs del panel (también el orden). Una errata como ['control', 'gren'] enviará a todos los visitantes al control.
4. Modo cookieless + cierre de pestaña. Si tu sitio carga el tracker con data-cookieless="true", el ID de visitante está confinado a la ventana — cerrar la pestaña y volver a abrirla cuenta como un nuevo visitante y puede caer en otra variante. Es comportamiento esperado y estadísticamente válido.

No se registran exposiciones tras el lanzamiento

1. El tracker no está cargado en la página donde llamas a experiment(). Comprueba en DevTools si window.zenovay está definida en esa página. Si es undefined, el <script> del tracker de Zenovay no está incluido o no se ha ejecutado todavía.
2. El experimento sigue en draft. Pulsa Launch desde la vista de detalle del experimento — los borradores no registran exposiciones.
3. Un bloqueador de anuncios está descartando la solicitud. Poco frecuente, pero posible si no usas un dominio first-party. Migra a tracking first-party (subdominio personalizado) si tu audiencia tiene muchos bloqueadores.

La atribución de conversión muestra 0 aunque sí veo exposiciones

1. Discrepancia de ID de objetivo. El objetivo seleccionado al crear el experimento debe ser el mismo que dispara tu código (o el auto-tracking de Zenovay). Verifica el slug del objetivo en el panel y observa en el feed en vivo que el objetivo se dispara.
2. La conversión ocurre antes de la asignación. Muy raro, pero posible si tu CTA dispara el objetivo al cargar inicialmente la página y llamas a experiment() con retraso. Llama a experiment() lo antes posible (justo después del stub del tracker).
3. El visitante ha convertido en otro navegador / dispositivo / pestaña. En modo cookieless la asignación no persiste entre pestañas — y el vínculo con la conversión tampoco. El visitante se contará como dos participantes distintos.

La advertencia de Sample-Ratio Mismatch no desaparece

El sample-ratio mismatch (SRM) es la diferencia entre el reparto de tráfico configurado y el reparto real observado — en un experimento 50/50, un 60/40 con muestras sanas es una bandera roja.

1. Una variante falla. Si el JavaScript de tu tratamiento lanza una excepción antes de que el visitante llegue al embudo de conversión, se le atribuirán menos conversiones — pero el conteo de exposiciones debería seguir equilibrado. Revisa tu tracker de errores por si hay un aumento que coincida con el lanzamiento del experimento.
2. Tráfico de bots sesgado a un bucket. Bots que comparten una familia de IDs de visitante (por ejemplo, granjas de crawlers con IPs no aleatorias) pueden caer desproporcionadamente en una variante. El filtro B2B/bot de la pestaña Visitors ayuda a cuantificarlo.
3. Lanzaste, editaste la lista de variantes y volviste a lanzar. Cambiar el orden de las variantes en tu llamada cliente tras el lanzamiento desordena el hash determinista. Si cambias la lista de variantes, relanza siempre como nuevo experimento.

Si el SRM persiste más de 24 horas con tráfico sano, pausa el experimento y abre un ticket de soporte.

---

FAQ

¿Cómo lanzo un test A/B en mi sitio web con Zenovay?

Tres pasos: crea un objetivo que quieras optimizar, define un experimento con 2+ variantes en la pestaña Experiments, y pega una línea de JavaScript en la página donde debe aplicarse la variante. El tracker de Zenovay se ocupa de la asignación aleatoria, del registro de exposiciones y de la atribución de conversiones. El recorrido completo está en la sección «Configurar un experimento» más arriba.

¿Cómo añado el código de seguimiento para variantes A/B?

El tracker de Zenovay ya está en tu página si tienes analytics instalado. Solo añades una línea más donde la variante debe pintarse:

const variant = window.zenovay('experiment', 'your-experiment-id', ['control', 'treatment-a', 'treatment-b']);

Bifurca después tu estilo, copy o componente según el valor devuelto. No hay un SDK aparte para instalar.

¿Cómo decide Zenovay qué variante ve un visitante?

La asignación de variantes es un hash determinista del ID de visitante módulo los pesos del reparto de tráfico configurados. El mismo ID de visitante hashea siempre a la misma variante para un mismo ID de experimento, así que el visitante ve una experiencia consistente entre cargas de página y (si las cookies están habilitadas) entre sesiones.

¿Por qué mi asignación de variante está vacía o es null?

La causa más común es llamar a window.zenovay('experiment', …) antes de que el tracker termine de cargar. La función está definida de inmediato, pero solo devuelve una variante real cuando el bundle ya está listo. Envuelve la llamada en un hook del ciclo de vida del framework (useEffect, onMounted) o un pequeño setTimeout. Ver la sección de Resolución de problemas para la lista completa.

¿Cómo compruebo la significación estadística?

Abre la página de detalle del experimento. Cada fila de tratamiento muestra un p-valor corregido por Bonferroni frente al control. Aparece un badge winner verde cuando el p-valor está por debajo de 0,05, ambas variantes tienen al menos 100 visitantes y el lift del tratamiento sobre el control es positivo.

¿Cuándo debo terminar mi experimento?

Decide una regla de parada antes de lanzar: o un presupuesto fijo de visitas (por ejemplo, «termina a los 30.000 visitantes por variante»), o una fecha fija. Termina el experimento cuando se cumpla esa regla, independientemente de lo que muestre el panel en ese momento. Detenerse antes porque un tratamiento «parece ganador» dispara la tasa de falsos positivos.

¿Qué pasa si llego al límite de mi plan (por ejemplo 5/5 en Pro)?

No podrás lanzar un nuevo experimento hasta que archives uno existente. Los borradores no cuentan para el límite — solo los experimentos en estado running. Los experimentos archivados conservan sus asignaciones e historial de conversiones; simplemente dejan de contar en el cupo concurrente.

¿Cómo clono un experimento o lo vuelvo a lanzar con otro copy?

Abre el experimento original, pulsa el icono de menú (⋯) y elige Clone. El nuevo experimento hereda el objetivo, la lista de variantes y el reparto de tráfico — edita lo que necesites y pulsa Launch. El experimento clonado tiene su propio ID, así que los visitantes se reasignan de forma independiente al original.

¿Puedo editar un experimento después de lanzarlo?

Solo los experimentos en estado draft son totalmente editables. Tras pulsar Launch, el experimento queda bloqueado: puedes pausarlo, archivarlo o terminarlo, pero no puedes cambiar las variantes, el reparto de tráfico o el objetivo sin invalidar la corrida. Si necesitas cambiar algo, termina y clona.

¿Cómo se atribuyen las conversiones a una variante?

La atribución es automática. Cuando un visitante dispara el objetivo (vía el auto-tracking de Zenovay o tu llamada window.zenovay('event', 'goal-slug')), Zenovay busca la variante que se le había asignado para los experimentos en curso y le imputa la conversión. No se requiere código de atribución manual.

¿Qué es la corrección de Bonferroni y por qué la usa mi plan Pro?

Cuando comparas varios tratamientos contra un control, aplicar de forma ingenua un umbral único de p < 0,05 a cada comparación infla la probabilidad de falso positivo (el efecto «look-elsewhere»). La corrección de Bonferroni divide el umbral por el número de comparaciones — en un experimento con tres tratamientos y un control, cada comparación debe alcanzar p < 0,05 / 3 ≈ 0,017. Todos los planes de Zenovay que admiten A/B testing aplican Bonferroni; no es exclusivo de Pro, es nuestro método estándar de reporte en todos los tiers de pago.

¿Qué es el SRM y cuándo debería preocuparme?

El Sample-Ratio Mismatch (SRM) es la diferencia entre tu reparto configurado y el reparto real observado. En un experimento 50/50 un 50,3/49,7 es razonable, pero 60/40 con muestras sanas indica un bug de despliegue o de asignación. Preocúpate cuando la desviación supere ~5 puntos porcentuales tras los primeros ~10.000 visitantes. El panel lo marca automáticamente.

Modo cookieless + tests A/B — ¿funciona?

Sí. El hash determinista usa el ID de visitante que el tracker tenga configurado — un ID de cookie estable cuando las cookies están habilitadas, o un ID en memoria confinado a la ventana en modo cookieless. El modelo estadístico no cambia; la única diferencia práctica es que un visitante cookieless que cierre y vuelva a abrir la pestaña se reasigna de forma independiente cada vez. Es normal y no invalida el experimento.

---

Próximos pasos

• Objetivos – Define los eventos que medirá tu experimento
• Embudos de conversión – Sigue rutas de conversión de varios pasos
• Conversion Incidents – Recibe alertas cuando el objetivo de un experimento se desplome