Passer au contenu

Indicateurs de fonctionnalité

Les indicateurs de fonctionnalité vous permettent d’activer ou de désactiver à distance des fonctionnalités pour une sélection spécifique ou aléatoire d’utilisateurs. Point essentiel : ils vous permettent d’activer et de désactiver une fonctionnalité en production sans déploiement de code supplémentaire ni mise à jour sur les boutiques d’applications. Vous pouvez ainsi déployer de nouvelles fonctionnalités en toute sécurité et en toute confiance.

Conditions préalables

Voici les versions minimales du SDK nécessaires pour commencer à utiliser les indicateurs de fonctionnalité :

Cas d’usage

Déploiements progressifs

Utilisez les indicateurs de fonctionnalité pour activer progressivement des fonctionnalités auprès d’un échantillon de population. Par exemple, vous pouvez lancer discrètement une nouvelle fonctionnalité auprès de vos utilisateurs VIP en premier. Cette stratégie limite les risques liés au déploiement simultané d’une nouvelle fonctionnalité pour tout le monde et permet de détecter les bugs plus tôt.

Image animée du curseur de trafic de déploiement passant de 0 % à 100 %.

Imaginons par exemple que nous ayons décidé d’ajouter un nouveau lien « Live Chat Support » dans notre application pour accélérer le service client. Nous pourrions publier cette fonctionnalité pour tous les clients en même temps. Toutefois, un déploiement à grande échelle comporte des risques, par exemple :

  • Notre équipe Support est encore en formation, et les clients pourront ouvrir des tickets dès la publication. Nous n’aurions alors aucune marge si l’équipe Support a besoin de plus de temps.
  • Nous ne savons pas exactement combien de nouvelles demandes de support nous allons recevoir, et nos effectifs risquent d’être insuffisants.
  • Si notre équipe Support est débordée, nous n’avons aucune stratégie pour désactiver rapidement cette fonctionnalité.
  • Le widget de chat pourrait introduire des bugs, et nous ne voulons pas que les clients vivent une expérience négative.

Avec les indicateurs de fonctionnalité de Braze, nous pouvons plutôt déployer la fonctionnalité progressivement et limiter tous ces risques :

  • Nous activerons la fonctionnalité « Live Chat Support » lorsque l’équipe Support se dira prête.
  • Nous activerons cette nouvelle fonctionnalité pour seulement 10 % des utilisateurs afin de vérifier que nos effectifs sont suffisants.
  • En cas de bug, nous pourrons désactiver rapidement la fonctionnalité au lieu de nous précipiter pour publier une nouvelle version.

Pour déployer progressivement cette fonctionnalité, nous pouvons créer un indicateur de fonctionnalité nommé « Live Chat Widget ».

Détails d’un exemple d’indicateur de fonctionnalité nommé Live Chat Widget. L’ID est enable_live_chat. La description indique que le widget de chat en direct s’affichera sur la page de support.

Dans le code de notre application, nous n’afficherons le bouton Start Live Chat que lorsque l’indicateur de fonctionnalité Braze est activé :

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>}
</>)

Utilisez subscribeToFeatureFlagsEvents avec le SDK Web 7.0.0 et versions ultérieures. subscribeToFeatureFlagsUpdates correspond à l’ancienne méthode, obsolète depuis la version 7.0.0.

Pour consulter la liste complète des événements que vous pouvez recevoir, reportez-vous à Créer des indicateurs de fonctionnalité.

// 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);
}

Utilisez subscribeToFeatureFlagsEvents avec le SDK Android 44.0.0 et versions ultérieures. subscribeToFeatureFlagsUpdates correspond à l’ancienne méthode, obsolète depuis la version 44.0.0.

// 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
}

Utilisez subscribeToFeatureFlagsEvents avec le SDK Android 44.0.0 et versions ultérieures. subscribeToFeatureFlagsUpdates correspond à l’ancienne méthode, obsolète depuis la version 44.0.0.

// 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

Utilisez subscribeToEvents(_:) avec le SDK Swift 19.0.0 et versions ultérieures. subscribeToUpdates(_:) correspond à l’ancienne méthode, obsolète depuis la version 19.0.0.

Pour savoir quand chaque événement se déclenche et ce que signifient chaque motif de mise à jour, état de nouvelle tentative, action d’analyse et motif d’erreur, consultez Abonnements aux événements.

Contrôler à distance les variables de l’application

Utilisez les indicateurs de fonctionnalité pour modifier le fonctionnement de votre application en production. C’est particulièrement utile pour les applications mobiles, pour lesquelles les validations des boutiques d’applications empêchent de déployer rapidement des modifications auprès de tous les utilisateurs.

Imaginons par exemple que notre équipe marketing souhaite mettre en avant nos soldes et promotions en cours dans la navigation de notre application. Habituellement, nos ingénieurs ont besoin d’une semaine de délai pour toute modification, plus trois jours pour la validation de la boutique d’applications. Mais avec Thanksgiving, le Black Friday, le Cyber Monday, Hanoukka, Noël et le Nouvel An, le tout en l’espace de deux mois, nous ne pourrons pas tenir ces délais serrés.

Grâce aux indicateurs de fonctionnalité, nous pouvons laisser Braze gérer le contenu du lien de navigation de notre application, ce qui permet à notre responsable marketing d’effectuer des modifications en quelques minutes plutôt qu’en plusieurs jours.

Pour configurer cette fonctionnalité à distance, nous allons créer un nouvel indicateur de fonctionnalité appelé navigation_promo_link et définir les propriétés initiales suivantes :

Indicateur de fonctionnalité avec des propriétés de lien et de texte renvoyant vers une page de soldes générique.

Dans notre application, nous utiliserons les méthodes getter de Braze pour récupérer les propriétés de cet indicateur de fonctionnalité et construire les liens de navigation à partir de ces valeurs :

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>
</>)
// 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"));

// 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")
let featureFlag = braze.featureFlags.featureFlag(id: "navigation_promo_link")
if let featureFlag {
  liveChatView.isHidden = !featureFlag.enabled
} else {
  liveChatView.isHidden = true
}
liveChatView.promoLink = featureFlag?.stringProperty(key: "link")
liveChatView.promoText = featureFlag?.stringProperty(key: "text")

Désormais, la veille de Thanksgiving, il nous suffit de modifier ces valeurs de propriétés dans le tableau de bord de Braze.

Indicateur de fonctionnalité avec des propriétés de lien et de texte renvoyant vers une page de soldes de Thanksgiving.

Ainsi, la prochaine fois qu’une personne ouvrira l’application, elle verra les nouvelles offres de Thanksgiving.

Coordination des messages

Utilisez les indicateurs de fonctionnalité pour synchroniser le déploiement d’une fonctionnalité avec l’envoi de messages et renforcer la collaboration entre les équipes produit et marketing. En coordonnant les lancements de fonctionnalités et les messages grâce aux indicateurs de fonctionnalité, les deux équipes peuvent aligner leurs stratégies et proposer des expériences utilisateur cohérentes.

Imaginons par exemple que nous lancions un nouveau programme de fidélité pour nos utilisateurs. Il peut être difficile pour les équipes marketing et produit de caler parfaitement le calendrier des messages promotionnels sur le déploiement d’une fonctionnalité. Avec les indicateurs de fonctionnalité dans Canvas, notre équipe produit peut toutefois appliquer une logique avancée pour activer une fonctionnalité auprès d’une audience précise, tandis que notre équipe marketing contrôle les messages associés envoyés à ces mêmes utilisateurs.

Pour coordonner efficacement le déploiement de la fonctionnalité et les messages, nous allons créer un nouvel indicateur de fonctionnalité appelé show_loyalty_program. Pour notre première phase de lancement, nous laisserons Canvas déterminer quand et pour qui l’indicateur de fonctionnalité est activé. Pour l’instant, nous laissons le pourcentage de déploiement à 0 % et ne sélectionnons aucun Segment cible.

Un indicateur de fonctionnalité nommé Loyalty Rewards Program. L’ID est show_loyalty_program, et la description indique qu’il affiche le nouveau programme de fidélité sur l’écran d’accueil et la page de profil.

Ensuite, dans Canvas, nous créerons une étape Indicateur de fonctionnalité qui active l’indicateur de fonctionnalité show_loyalty_program pour notre Segment « High Value Customers » :

Exemple de Canvas avec une étape Audience Split dans laquelle le Segment des clients à forte valeur active l’indicateur de fonctionnalité show_loyalty_program.

Les utilisateurs de ce Segment commencent alors à voir le nouveau programme de fidélité et, une fois celui-ci activé, un e-mail et une enquête sont envoyés automatiquement pour aider nos équipes à recueillir des retours.

Expérimentation de fonctionnalités

Utilisez les indicateurs de fonctionnalité pour expérimenter et confirmer vos hypothèses autour de votre nouvelle fonctionnalité. En répartissant le trafic en deux groupes ou plus, vous pouvez comparer l’impact d’un indicateur de fonctionnalité entre les groupes et choisir la meilleure marche à suivre en fonction des résultats.

Pour les expériences d’indicateurs de fonctionnalité, vous pouvez avoir jusqu’à neuf groupes au total : un groupe de contrôle et jusqu’à huit variantes.

Un test A/B est un outil puissant qui compare les réactions des utilisateurs à plusieurs versions d’une variable.

Dans cet exemple, notre équipe a conçu un nouveau parcours de paiement pour notre application eCommerce. Même si nous sommes convaincus qu’il améliore l’expérience utilisateur, nous voulons réaliser un test A/B pour mesurer son impact sur le chiffre d’affaires de notre application.

Pour commencer, nous allons créer un nouvel indicateur de fonctionnalité appelé enable_checkout_v2. Nous n’ajouterons ni audience ni pourcentage de déploiement. Nous utiliserons plutôt une expérience d’indicateur de fonctionnalité pour répartir le trafic, activer la fonctionnalité et mesurer le résultat.

Dans notre application, nous vérifierons si l’indicateur de fonctionnalité est activé ou non, puis nous afficherons le parcours de paiement correspondant à la réponse :

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 />
}
FeatureFlag featureFlag = braze.getFeatureFlag("enable_checkout_v2");
braze.logFeatureFlagImpression("enable_checkout_v2");
if (featureFlag != null && featureFlag.getEnabled()) {
  return new NewCheckoutFlow();
} else {
  return new OldCheckoutFlow();
}
val featureFlag = braze.getFeatureFlag("enable_checkout_v2")
braze.logFeatureFlagImpression("enable_checkout_v2")
if (featureFlag?.enabled == true) {
  return NewCheckoutFlow()
} else {
  return OldCheckoutFlow()
}
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()
}

Nous configurerons notre test A/B dans une expérience d’indicateur de fonctionnalité.

Désormais, 50 % des utilisateurs verront l’ancienne expérience, tandis que les 50 % restants verront la nouvelle. Nous pourrons ensuite analyser les deux variantes pour déterminer quel parcours de paiement a généré le taux de conversion le plus élevé.

Le taux de conversion est le pourcentage de fois où un événement défini s’est produit par rapport à l’ensemble des destinataires d’un message. Cet événement défini est déterminé lors de la création de la Campaign.

Une expérience d’indicateur de fonctionnalité répartissant le trafic en deux groupes de 50 %.

Une fois la variante gagnante identifiée, nous pourrons arrêter cette Campaign et porter le pourcentage de déploiement de l’indicateur de fonctionnalité à 100 % pour tous les utilisateurs, pendant que notre équipe d’ingénierie intègre définitivement cette fonctionnalité dans la prochaine version de l’application.

Segmentation

Utilisez le filtre Indicateur de fonctionnalité pour créer un Segment ou cibler des messages selon que les utilisateurs ont ou non un indicateur de fonctionnalité activé. Supposons par exemple qu’un indicateur de fonctionnalité contrôle le contenu premium de votre application. Vous pourriez créer un Segment qui filtre les utilisateurs pour lesquels cet indicateur n’est pas activé, puis envoyer à ce Segment un message les incitant à passer à un compte supérieur pour accéder au contenu premium.

  1. Ouvrez votre Segment ou l’audience de votre message.
  2. Ajoutez le filtre Indicateur de fonctionnalité.
  3. Sélectionnez l’indicateur de fonctionnalité.
  4. Définissez le comparateur sur est pour inclure les utilisateurs pour lesquels l’indicateur de fonctionnalité est activé, ou sur n’est pas pour inclure ceux pour lesquels il ne l’est pas. Générateur de Segments de Braze utilisant un filtre sur la valeur d’activation d’un indicateur de fonctionnalité.

Pour en savoir plus sur le filtrage des Segments, consultez Créer un Segment.

Limites des forfaits

Voici les limites des indicateurs de fonctionnalité pour les forfaits gratuits et payants.

Fonctionnalité Version gratuite Version payante
Indicateurs de fonctionnalité actifs 10 par espace de travail 110 par espace de travail
Expériences actives de Campaign 1 par espace de travail 100 par espace de travail
Étapes Canvas Indicateur de fonctionnalité Illimité Illimité

Un indicateur de fonctionnalité est considéré comme actif et est comptabilisé dans votre limite si l’une des conditions suivantes s’applique :

  • Le déploiement est supérieur à 0 %
  • Il est utilisé dans un Canvas actif
  • Il est utilisé dans une expérience active

Même si un indicateur de fonctionnalité remplit plusieurs critères, par exemple s’il est utilisé dans un Canvas et que son déploiement est de 50 %, il ne compte que pour 1 indicateur de fonctionnalité actif dans votre limite.

New Stuff!