Conmutadores de características

Los conmutadores de características te permiten habilitar o deshabilitar a distancia la funcionalidad para una selección específica o aleatoria de usuarios. Y lo que es más importante, te permiten activar y desactivar una característica en producción sin necesidad de desplegar código adicional ni actualizar la tienda de aplicaciones. Esto te permite desplegar nuevas características con seguridad y confianza.

Consejo

Cuando estés listo para crear tus propios conmutadores de características, consulta Crear conmutadores de características.

Requisitos previos

Estas son las versiones mínimas del SDK necesarias para empezar a usar los conmutadores de características:

Ejemplos

Lanzamientos graduales

Usa los conmutadores de características para habilitar gradualmente características para una muestra de la población. Por ejemplo, puedes lanzar de forma preliminar una nueva característica para tus usuarios VIP primero. Esta estrategia ayuda a mitigar los riesgos asociados con el envío de nuevas características a todos a la vez y ayuda a detectar errores tempranamente.

Por ejemplo, supongamos que hemos decidido añadir un nuevo enlace de “Soporte por chat en vivo” a nuestra aplicación para un servicio de atención al cliente más rápido. Podríamos lanzar esta característica a todos los clientes a la vez. Sin embargo, un lanzamiento amplio conlleva riesgos, como:

• Nuestro equipo de soporte todavía está en capacitación y los clientes pueden abrir tickets de soporte después de que se lance. Esto no nos da ningún margen en caso de que el equipo de soporte necesite más tiempo.
• No estamos seguros del volumen real de nuevos casos de soporte que recibiremos, por lo que es posible que no tengamos el personal adecuado.
• Si nuestro equipo de soporte se ve desbordado, no tenemos una estrategia para desactivar rápidamente esta característica de nuevo.
• Podrían introducirse errores en el widget de chat y no queremos que los clientes tengan una experiencia negativa.

Con los conmutadores de características de Braze, podemos lanzar la característica de forma gradual y mitigar todos estos riesgos:

• Activaremos la característica “Soporte por chat en vivo” cuando el equipo de soporte diga que está listo.
• Habilitaremos esta nueva característica solo para el 10 % de los usuarios para determinar si tenemos el personal adecuado.
• Si hay algún error, podemos desactivar rápidamente la característica en lugar de apresurarnos a publicar una nueva versión.

Para lanzar gradualmente esta característica, podemos crear un conmutador de características llamado “Live Chat Widget”.

En el código de nuestra aplicación, solo mostraremos el botón Start Live Chat cuando el conmutador de características de Braze esté habilitado:

• javascript
• java
• kotlin
• swift

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

import {useState} from "react";
import * as braze from "@braze/web-sdk";

// Get the initial value from the Braze SDK
const featureFlag = braze.getFeatureFlag("enable_live_chat");
const [liveChatEnabled, setLiveChatEnabled] = useState(featureFlag.enabled);

// - Available in version 7.0.0+
// Listen for events from the Braze SDK
braze.subscribeToFeatureFlagsEvents((event) => {
  switch (event.type) {
    case braze.ChannelEventType.CACHE_REPLAY:
    case braze.ChannelEventType.CACHE_LOAD:
    case braze.ChannelEventType.DATA_UPDATED: {
      const flag = event.cacheSnapshot.featureFlags.find((f) => f.id === "enable_live_chat");
      setLiveChatEnabled(flag ? flag.enabled : false);
      break;
    }
    case braze.ChannelEventType.ERROR:
      if (event.reason === braze.ChannelErrorReason.FEATURE_DISABLED) {
        setLiveChatEnabled(false);
      }
      break;
  }
});

// Listen for updates from the Braze SDK
braze.subscribeToFeatureFlagsUpdates(() => {
    const newValue = braze.getFeatureFlag("enable_live_chat").enabled;
    setLiveChatEnabled(newValue);
});

// Only show the Live Chat if the Braze SDK determines it is enabled
return (<>
  Need help? <button>Email Our Team</button>
  {liveChatEnabled && <button>Start Live Chat</button>}
</>)

Usa subscribeToFeatureFlagsEvents en Web SDK 7.0.0 y posteriores. subscribeToFeatureFlagsUpdates es el patrón anterior, obsoleto a partir de la versión 7.0.0.

Para consultar la lista completa de eventos que puedes recibir, consulta Crear conmutadores de características.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

// Get the initial value from the Braze SDK
FeatureFlag featureFlag = braze.getFeatureFlag("enable_live_chat");
Boolean liveChatEnabled = featureFlag != null && featureFlag.getEnabled();

// - Available in version 44.0.0+
// Listen for events from the Braze SDK
braze.subscribeToFeatureFlagsEvents(event -> {
  if (event instanceof FeatureFlagsEvent.CacheReplay || event instanceof FeatureFlagsEvent.CacheLoad || event instanceof FeatureFlagsEvent.DataUpdated) {
    FeatureFlag newFeatureFlag = braze.getFeatureFlag("enable_live_chat");
    Boolean newValue = newFeatureFlag != null && newFeatureFlag.getEnabled();
    liveChatEnabled = newValue;
  } else if (event instanceof FeatureFlagsEvent.ErrorEvent) {
    FeatureFlagsEvent.ErrorEvent errorEvent = (FeatureFlagsEvent.ErrorEvent) event;
    if (errorEvent.getReason() instanceof ChannelErrorReason.FeatureDisabled) {
      liveChatEnabled = false;
    }
  }
});

// Listen for updates from the Braze SDK
braze.subscribeToFeatureFlagsUpdates(event -> {
  FeatureFlag newFeatureFlag = braze.getFeatureFlag("enable_live_chat");
  Boolean newValue = newFeatureFlag != null && newFeatureFlag.getEnabled();
  liveChatEnabled = newValue;
});

// Only show the Live Chat view if the Braze SDK determines it is enabled
if (liveChatEnabled) {
  liveChatView.setVisibility(View.VISIBLE);
} else {
  liveChatView.setVisibility(View.GONE);
}

Usa subscribeToFeatureFlagsEvents en Android SDK 44.0.0 y posteriores. subscribeToFeatureFlagsUpdates es el patrón anterior, obsoleto a partir de la versión 44.0.0.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

// Get the initial value from the Braze SDK
val featureFlag = braze.getFeatureFlag("enable_live_chat")
var liveChatEnabled = featureFlag?.enabled

// - Available in version 44.0.0+
// Listen for events from the Braze SDK
braze.subscribeToFeatureFlagsEvents { event ->
  when (event) {
    is FeatureFlagsEvent.CacheReplay, is FeatureFlagsEvent.CacheLoad, is FeatureFlagsEvent.DataUpdated -> {
      val newValue = braze.getFeatureFlag("enable_live_chat")?.enabled
      liveChatEnabled = newValue
    }
    is FeatureFlagsEvent.ErrorEvent -> {
      if (event.reason is ChannelErrorReason.FeatureDisabled) {
        liveChatEnabled = false
      }
    }
    else -> {}
  }
}

// Listen for updates from the Braze SDK
braze.subscribeToFeatureFlagsUpdates {
  val newValue = braze.getFeatureFlag("enable_live_chat")?.enabled
  liveChatEnabled = newValue
}

// Only show the Live Chat view if the Braze SDK determines it is enabled
if (liveChatEnabled) {
  liveChatView.visibility = View.VISIBLE
} else {
  liveChatView.visibility = View.GONE
}

Usa subscribeToFeatureFlagsEvents en Android SDK 44.0.0 y posteriores. subscribeToFeatureFlagsUpdates es el patrón anterior, obsoleto a partir de la versión 44.0.0.

Nota

Leer braze.featureFlags.featureFlags o braze.featureFlags.featureFlag(id:) bloquea el hilo de llamada hasta que el SDK haya completado sus operaciones posteriores a la inicialización. Para contextos del hilo principal o sensibles a la latencia, usa getAllFeatureFlags(_:) en su lugar.

1
2
3
4
5

// Non-blocking — completion handler always delivers on the main thread.
braze.featureFlags.getAllFeatureFlags { flags in
  let liveChatEnabled = flags.first(where: { $0.id == "enable_live_chat" })?.enabled ?? false
  liveChatView.isHidden = !liveChatEnabled
}

En Objective-C:

1
2
3

[braze.featureFlags getAllFeatureFlagsWithCompletion:^(NSArray<BRZFeatureFlag *> *flags) {
  // Use `flags` here.
}];

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

// Get the initial value from the Braze SDK
let featureFlag = braze.featureFlags.featureFlag(id: "enable_live_chat")
var liveChatEnabled = featureFlag?.enabled ?? false

// - Available in version 19.0.0+
// Listen for events from the Braze SDK
let cancellable = braze.featureFlags.subscribeToEvents { event in
  switch event {
  case .cacheReplay, .cacheLoad, .dataUpdated:
    let newValue = braze.featureFlags.featureFlag(id: "enable_live_chat")?.enabled ?? false
    liveChatEnabled = newValue
  default:
    break
  }
}

// Listen for updates from the Braze SDK
let cancellable = braze.featureFlags.subscribeToUpdates { _ in
  let newValue = braze.featureFlags.featureFlag(id: "enable_live_chat")?.enabled ?? false
  liveChatEnabled = newValue
}

// Only show the Live Chat view if the Braze SDK determines it is enabled
liveChatView.isHidden = !liveChatEnabled

Usa subscribeToEvents(_:) en Swift SDK 19.0.0 y posteriores. subscribeToUpdates(_:) es el patrón anterior, obsoleto a partir de la versión 19.0.0.

Para saber cuándo se dispara cada evento y qué significan cada motivo de actualización, estado de reintento, acción de análisis y motivo de error, consulta Suscripciones a eventos.

Controlar variables de la aplicación de forma remota

Usa los conmutadores de características para modificar la funcionalidad de tu aplicación en producción. Esto puede ser particularmente importante para las aplicaciones móviles, donde las aprobaciones de las tiendas de aplicaciones impiden implementar cambios rápidamente para todos los usuarios.

Por ejemplo, supongamos que nuestro equipo de marketing quiere listar nuestras ventas y promociones actuales en la navegación de nuestra aplicación. Normalmente, nuestros ingenieros requieren una semana de anticipación para cualquier cambio y tres días para una revisión de la tienda de aplicaciones. Pero con el Día de Acción de Gracias, Black Friday, Cyber Monday, Hanukkah, Navidad y Año Nuevo, todos en un periodo de dos meses, no podremos cumplir con estos plazos tan ajustados.

Con los conmutadores de características, podemos dejar que Braze controle el contenido de nuestro enlace de navegación de la aplicación, permitiendo que nuestro director de marketing haga cambios en minutos en lugar de días.

Para configurar esta característica de forma remota, crearemos un nuevo conmutador de características llamado navigation_promo_link y definiremos las siguientes propiedades iniciales:

En nuestra aplicación, usaremos los métodos getter de Braze para obtener las propiedades de este conmutador de características y construir los enlaces de navegación basándonos en esos valores:

• javascript
• java
• kotlin
• swift

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

import * as braze from "@braze/web-sdk";
import {useState} from "react";

const featureFlag = braze.getFeatureFlag("navigation_promo_link");
// Check if the feature flag is enabled
const [promoEnabled, setPromoEnabled] = useState(featureFlag.enabled);
// Read the "link" property
const [promoLink, setPromoLink] = useState(featureFlag.getStringProperty("link"));
// Read the "text" property
const [promoText, setPromoText] = useState(featureFlag.getStringProperty("text"));

return (<>
  <div>
    <a href="/">Home</a>
    { promoEnabled && <a href={promoLink}>{promoText}</a> }
    <a href="/products">Products</a>
    <a href="/categories">Categories
  </div>
</>)

1
2
3
4
5
6
7
8
9
10

// liveChatView is the View container for the Live Chat UI
FeatureFlag featureFlag = braze.getFeatureFlag("navigation_promo_link");
if (featureFlag != null && featureFlag.getEnabled()) {
  liveChatView.setVisibility(View.VISIBLE);
} else {
  liveChatView.setVisibility(View.GONE);
}
liveChatView.setPromoLink(featureFlag.getStringProperty("link"));
liveChatView.setPromoText(featureFlag.getStringProperty("text"));

1
2
3
4
5
6
7
8
9

// liveChatView is the View container for the Live Chat UI
val featureFlag = braze.getFeatureFlag("navigation_promo_link")
if (featureFlag?.enabled == true) {
  liveChatView.visibility = View.VISIBLE
} else {
  liveChatView.visibility = View.GONE
}
liveChatView.promoLink = featureFlag?.getStringProperty("link")
liveChatView.promoText = featureFlag?.getStringProperty("text")

1
2
3
4
5
6
7
8

let featureFlag = braze.featureFlags.featureFlag(id: "navigation_promo_link")
if let featureFlag {
  liveChatView.isHidden = !featureFlag.enabled
} else {
  liveChatView.isHidden = true
}
liveChatView.promoLink = featureFlag?.stringProperty("link")
liveChatView.promoText = featureFlag?.stringProperty("text")

Ahora, el día antes del Día de Acción de Gracias, solo tenemos que cambiar esos valores de propiedades en el panel de Braze.

Como resultado, la próxima vez que alguien cargue la aplicación, verá las nuevas ofertas de Acción de Gracias.

Coordinación de mensajes

Usa los conmutadores de características para sincronizar el lanzamiento de una característica y la mensajería, y para fortalecer la colaboración entre los equipos de producto y marketing. Al coordinar los lanzamientos de características y la mensajería mediante conmutadores de características, ambos equipos pueden alinear sus estrategias y crear experiencias de usuario consistentes.

Por ejemplo, supongamos que estamos lanzando un nuevo programa de recompensas de fidelización para nuestros usuarios. Puede ser difícil para los equipos de marketing y producto coordinar perfectamente la sincronización de los mensajes promocionales con el lanzamiento de una característica. Sin embargo, con los conmutadores de características en Canvas, nuestro equipo de producto puede aplicar una lógica sofisticada para habilitar una característica para una audiencia específica, mientras que nuestro equipo de marketing controla la mensajería relacionada para esos mismos usuarios.

Para coordinar eficazmente el lanzamiento de una característica y la mensajería, crearemos un nuevo conmutador de características llamado show_loyalty_program. Para nuestro lanzamiento por fases inicial, dejaremos que Canvas controle cuándo y para quién se habilita el conmutador de características. Por ahora, dejaremos el porcentaje de lanzamiento en 0 % y no seleccionaremos ningún Segment de destino.

Luego, en Canvas, crearemos un paso de conmutador de características que habilite el conmutador de características show_loyalty_program para nuestro Segment “Clientes de alto valor”:

Ahora, los usuarios en este Segment comienzan a ver el nuevo programa de fidelización y, una vez habilitado, se envían automáticamente un correo electrónico y un cuestionario para ayudar a nuestros equipos a recopilar comentarios.

Experimentación con características

Usa los conmutadores de características para experimentar y confirmar tus hipótesis sobre tu nueva característica. Al dividir el tráfico en dos o más grupos, puedes comparar el impacto de un conmutador de características entre los grupos y determinar el mejor curso de acción basándote en los resultados.

Para los experimentos con conmutadores de características, puedes tener hasta nueve grupos en total: un grupo de control más hasta ocho variantes.

Una prueba A/B es una herramienta potente que compara las respuestas de los usuarios a múltiples versiones de una variable.

En este ejemplo, nuestro equipo ha creado un nuevo flujo de pago para nuestra aplicación de comercio electrónico. Aunque confiamos en que está mejorando la experiencia de usuario, queremos realizar una prueba A/B para medir su impacto en los ingresos de nuestra aplicación.

Para empezar, crearemos un nuevo conmutador de características llamado enable_checkout_v2. No añadiremos una audiencia ni un porcentaje de lanzamiento. En su lugar, usaremos un experimento con conmutador de características para dividir el tráfico, habilitar la característica y medir el resultado.

En nuestra aplicación, comprobaremos si el conmutador de características está habilitado o no y cambiaremos el flujo de pago según la respuesta:

• javascript
• java
• kotlin
• swift

1
2
3
4
5
6
7
8
9

import * as braze from "@braze/web-sdk";

const featureFlag = braze.getFeatureFlag("enable_checkout_v2");
braze.logFeatureFlagImpression("enable_checkout_v2");
if (featureFlag?.enabled) {
  return <NewCheckoutFlow />
} else {
  return <OldCheckoutFlow />
}

1
2
3
4
5
6
7

FeatureFlag featureFlag = braze.getFeatureFlag("enable_checkout_v2");
braze.logFeatureFlagImpression("enable_checkout_v2");
if (featureFlag != null && featureFlag.getEnabled()) {
  return new NewCheckoutFlow();
} else {
  return new OldCheckoutFlow();
}

1
2
3
4
5
6
7

val featureFlag = braze.getFeatureFlag("enable_checkout_v2")
braze.logFeatureFlagImpression("enable_checkout_v2")
if (featureFlag?.enabled == true) {
  return NewCheckoutFlow()
} else {
  return OldCheckoutFlow()
}

1
2
3
4
5
6
7

let featureFlag = braze.featureFlags.featureFlag(id: "enable_checkout_v2")
braze.featureFlags.logFeatureFlagImpression(id: "enable_checkout_v2")
if let featureFlag, featureFlag.enabled {
  return NewCheckoutFlow()
} else {
  return OldCheckoutFlow()
}

Configuraremos nuestra prueba A/B en un experimento con conmutador de características.

Ahora, el 50 % de los usuarios verá la experiencia antigua, mientras que el otro 50 % verá la nueva experiencia. Luego podemos analizar las dos variantes para determinar qué flujo de pago resultó en una tasa de conversión más alta.

La tasa de conversión es el porcentaje de veces que se ha producido un evento definido en comparación con todos los destinatarios de un mensaje. Este evento definido se determina cuando construyes la Campaign.

Una vez que determinemos al ganador, podemos detener esta Campaign y aumentar el porcentaje de lanzamiento del conmutador de características al 100 % para todos los usuarios, mientras nuestro equipo de ingeniería lo codifica de forma permanente en nuestra próxima versión de la aplicación.

Segmentación

Usa el filtro Conmutador de características para crear un Segment o dirigir la mensajería a usuarios en función de si tienen un conmutador de características habilitado. Por ejemplo, supongamos que tienes un conmutador de características que controla el contenido premium en tu aplicación. Podrías crear un Segment que filtre a los usuarios que no tienen el conmutador de características habilitado y luego enviar a ese Segment un mensaje instándoles a actualizar su cuenta para ver el contenido premium.

1. Abre tu Segment o audiencia del mensaje.
2. Añade el filtro Conmutador de características.
3. Selecciona el conmutador de características.
4. Establece el comparador en es para incluir a los usuarios que tienen el conmutador de características habilitado, o no es para incluir a los usuarios que no lo tienen.

Para más información sobre el filtrado en Segments, consulta Crear un Segment.

Nota

Para evitar Segments recursivos, no es posible crear un Segment que haga referencia a otros conmutadores de características.

Limitaciones del plan

Estas son las limitaciones de los conmutadores de características para los planes gratuitos y de pago.

Un conmutador de características se considera activo y contará para tu límite si se cumple alguna de las siguientes condiciones:

• El despliegue es superior al 0%
• Se usa en un Canvas activo
• Se usa en un experimento activo

Incluso si el mismo conmutador de características cumple varios criterios, como si se usa en un Canvas y el despliegue es del 50%, solo contará como 1 conmutador de características activo para tu límite.

Nota

Para adquirir la versión de pago de los conmutadores de características, contacta con tu director de cuentas de Braze o solicita una mejora en el panel de Braze.