Zum Inhalt springen

Feature-Flags

Feature-Flags ermöglichen es Ihnen, Funktionen für eine bestimmte oder zufällige Auswahl von Nutzer:innen aus der Ferne zu aktivieren oder zu deaktivieren. Wichtig ist, dass Sie damit ein Feature in der Produktion ein- und ausschalten können, ohne zusätzlichen Code zu implementieren oder Updates im App Store durchzuführen. Dies erlaubt es Ihnen, neue Features sicher und zuverlässig einzuführen.

Voraussetzungen

Dies sind die Mindest-SDK-Versionen, die für die Nutzung von Feature-Flags erforderlich sind:

Anwendungsfälle

Schrittweise Rollouts

Verwenden Sie Feature-Flags, um Features schrittweise für eine Stichprobengruppe zu aktivieren. Beispielsweise können Sie ein neues Feature zunächst nur für Ihre VIP-Nutzer:innen als Soft-Launch freigeben. Diese Strategie hilft, die Risiken zu mindern, die mit der gleichzeitigen Veröffentlichung neuer Features für alle Nutzer:innen verbunden sind, und ermöglicht es, Fehler frühzeitig zu erkennen.

Animiertes Bild eines Rollout-Traffic-Reglers, der von 0 % auf 100 % bewegt wird.

Nehmen wir zum Beispiel an, wir haben beschlossen, einen neuen „Live-Chat-Support“-Link in unserer App hinzuzufügen, um schnelleren Kundenservice zu bieten. Wir könnten dieses Feature sofort für alle Kund:innen freigeben. Aber eine breite Veröffentlichung birgt Risiken, wie zum Beispiel:

  • Unser Support-Team befindet sich noch in der Schulung, und Kund:innen könnten nach der Veröffentlichung sofort Support-Tickets erstellen. Das gibt uns keinen Spielraum, falls das Support-Team mehr Zeit benötigt.
  • Wir sind uns über das tatsächliche Volumen neuer Supportfälle unsicher und haben möglicherweise nicht genügend Personal.
  • Wenn unser Support-Team überlastet ist, haben wir keine Strategie, dieses Feature schnell wieder zu deaktivieren.
  • Es könnten Fehler im Chat-Widget auftreten, und wir möchten nicht, dass Kund:innen eine negative Erfahrung machen.

Mit Braze Feature-Flags können wir das Feature stattdessen schrittweise ausrollen und alle diese Risiken mindern:

  • Wir werden das „Live-Chat-Support“-Feature aktivieren, wenn das Support-Team bereit ist.
  • Wir aktivieren dieses neue Feature zunächst nur für 10 % der Nutzer:innen, um festzustellen, ob wir ausreichend Personal haben.
  • Falls Fehler auftreten, können wir das Feature schnell deaktivieren, anstatt eine neue Version überstürzt zu veröffentlichen.

Um dieses Feature schrittweise auszurollen, können wir ein Feature-Flag erstellen mit dem Namen „Live Chat Widget.“

Feature-Flag-Details für ein Beispiel mit dem Namen „Live Chat Widget“. Die ID ist enable_live_chat. Die Beschreibung dieses Feature-Flags lautet, dass das Live-Chat-Widget auf der Supportseite angezeigt wird.

In unserem App-Code zeigen wir den Start Live Chat-Button nur an, wenn das Braze Feature-Flag aktiviert ist:

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

Verwenden Sie subscribeToFeatureFlagsEvents ab Web SDK 7.0.0 und höher. subscribeToFeatureFlagsUpdates ist das ältere Muster, das seit Version 7.0.0 veraltet ist.

Die vollständige Liste der Ereignisse, die Sie empfangen können, finden Sie unter Feature-Flags erstellen.

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

Verwenden Sie subscribeToFeatureFlagsEvents ab Android SDK 44.0.0 und höher. subscribeToFeatureFlagsUpdates ist das ältere Muster, das seit Version 44.0.0 veraltet ist.

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

Verwenden Sie subscribeToFeatureFlagsEvents ab Android SDK 44.0.0 und höher. subscribeToFeatureFlagsUpdates ist das ältere Muster, das seit Version 44.0.0 veraltet ist.

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

Verwenden Sie subscribeToEvents(_:) ab Swift SDK 19.0.0 und höher. subscribeToUpdates(_:) ist das ältere Muster, das seit Version 19.0.0 veraltet ist.

Informationen dazu, wann jedes Ereignis ausgelöst wird und was jeder Update-Grund, Retry-Status, Analytics-Aktion und Fehlergrund bedeutet, finden Sie unter Ereignis-Abonnements.

App-Variablen remote steuern

Verwenden Sie Feature-Flags, um die Funktionalität Ihrer App in der Produktion zu modifizieren. Dies kann besonders wichtig für mobile Apps sein, da App-Store-Genehmigungen das schnelle Ausrollen von Änderungen an alle Nutzer:innen verhindern.

Nehmen wir zum Beispiel an, dass unser Marketingteam unsere aktuellen Angebote und Aktionen in der Navigation unserer App auflisten möchte. Normalerweise benötigt unser Entwicklerteam eine Woche Vorlaufzeit für Änderungen und drei Tage für eine App-Store-Überprüfung. Aber mit Thanksgiving, Black Friday, Cyber Monday, Chanukka, Weihnachten und Neujahr innerhalb von zwei Monaten können wir diese engen Fristen nicht einhalten.

Mit Feature-Flags können wir Braze den Inhalt unseres App-Navigationslinks steuern lassen, sodass unser Marketing-Manager Änderungen in Minuten statt in Tagen vornehmen kann.

Um dieses Feature remote zu konfigurieren, erstellen wir ein neues Feature-Flag namens navigation_promo_link und definieren die folgenden anfänglichen Eigenschaften:

Feature-Flag mit Link- und Text-Eigenschaften, die auf eine allgemeine Angebotsseite verweisen.

In unserer App verwenden wir Getter-Methoden von Braze, um die Eigenschaften dieses Feature-Flags abzurufen und die Navigationslinks basierend auf diesen Werten zu erstellen:

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("link")
liveChatView.promoText = featureFlag?.stringProperty("text")

Jetzt müssen wir am Tag vor Thanksgiving nur noch diese Eigenschaftswerte im Braze-Dashboard ändern.

Feature-Flag mit Link- und Text-Eigenschaften, die auf eine Thanksgiving-Angebotsseite verweisen.

Wenn dann jemand die App das nächste Mal lädt, sieht er die neuen Thanksgiving-Angebote.

Nachrichtenkoordination

Verwenden Sie Feature-Flags, um den Rollout eines Features und das Messaging zu synchronisieren und die Zusammenarbeit zwischen Produkt- und Marketingteams zu stärken. Durch die Koordination von Feature-Veröffentlichungen und Messaging über Feature-Flags können beide Teams ihre Strategien aufeinander abstimmen und konsistente Nutzererlebnisse schaffen.

Nehmen wir zum Beispiel an, dass wir ein neues Kundenbindungs-Rewards-Programm für unsere Nutzer:innen einführen. Es kann für Marketing- und Produktteams schwierig sein, das Timing von Werbebotschaften und dem Feature-Rollout perfekt zu koordinieren. Mit Feature-Flags in Canvas kann unser Produktteam jedoch anspruchsvolle Logik anwenden, um ein Feature für eine bestimmte Zielgruppe zu aktivieren, während unser Marketingteam das zugehörige Messaging für dieselben Nutzer:innen steuert.

Um den Feature-Rollout und das Messaging effektiv zu koordinieren, erstellen wir ein neues Feature-Flag namens show_loyalty_program. Für unsere anfängliche phasenweise Einführung lassen wir Canvas steuern, wann und für wen das Feature-Flag aktiviert wird. Vorerst belassen wir den Rollout-Prozentsatz bei 0 % und wählen keine Ziel-Segmente aus.

Ein Feature-Flag mit dem Namen „Loyalty Rewards Program“. Die ID ist show_loyalty_program, und die Beschreibung besagt, dass das neue Kundenbindungs-Rewards-Programm auf dem Startbildschirm und der Profilseite angezeigt wird.

Dann erstellen wir in Canvas einen Feature-Flag-Schritt, der das Feature-Flag show_loyalty_program für unser Segment „High Value Customers“ aktiviert:

Ein Beispiel für einen Canvas mit einem Zielgruppen-Split-Schritt, bei dem das Segment der hochwertigen Kund:innen das Feature-Flag show_loyalty_program aktiviert.

Jetzt beginnen Nutzer:innen in diesem Segment, das neue Kundenbindungs-Programm zu sehen, und nachdem es aktiviert wurde, werden automatisch eine E-Mail und eine Umfrage versendet, um unserem Team beim Sammeln von Feedback zu helfen.

Feature-Experimentierung

Verwenden Sie Feature-Flags, um Ihre Hypothesen rund um Ihr neues Feature zu experimentieren und zu bestätigen. Indem Sie den Traffic in zwei oder mehr Gruppen aufteilen, können Sie die Auswirkungen eines Feature-Flags über die Gruppen hinweg vergleichen und basierend auf den Ergebnissen die beste Vorgehensweise bestimmen.

Für Feature-Flag-Experimente können Sie insgesamt bis zu neun Gruppen haben: eine Kontrollgruppe plus bis zu acht Varianten.

Ein A/B-Test ist ein leistungsstarkes Werkzeug, das die Reaktionen der Nutzer:innen auf mehrere Versionen einer Variable vergleicht.

In diesem Beispiel hat unser Team einen neuen Checkout-Flow für unsere E-Commerce-App entwickelt. Obwohl wir zuversichtlich sind, dass er das Nutzererlebnis verbessert, möchten wir einen A/B-Test durchführen, um seine Auswirkung auf den Umsatz unserer App zu messen.

Zunächst erstellen wir ein neues Feature-Flag namens enable_checkout_v2. Wir fügen keine Zielgruppe oder Rollout-Prozentsatz hinzu. Stattdessen verwenden wir ein Feature-Flag-Experiment, um den Traffic aufzuteilen, das Feature zu aktivieren und das Ergebnis zu messen.

In unserer App prüfen wir, ob das Feature-Flag aktiviert ist oder nicht, und wechseln den Checkout-Flow basierend auf der Antwort:

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

Wir richten unseren A/B-Test in einem Feature-Flag-Experiment ein.

Jetzt sehen 50 % der Nutzer:innen das alte Erlebnis, während die anderen 50 % das neue Erlebnis sehen. Wir können dann die beiden Varianten analysieren, um festzustellen, welcher Checkout-Flow zu einer höheren Konversionsrate geführt hat.

Die Konversionsrate ist der Prozentsatz der Häufigkeit, mit der ein definiertes Ereignis im Vergleich zu allen Empfänger:innen einer Nachricht eingetreten ist. Dieses definierte Ereignis wird festgelegt, wenn Sie die Campaign erstellen.

Ein Feature-Flag-Experiment, das den Traffic in zwei 50-Prozent-Gruppen aufteilt.

Sobald wir einen Gewinner ermittelt haben, können wir diese Campaign stoppen und den Rollout-Prozentsatz des Feature-Flags für alle Nutzer:innen auf 100 % erhöhen, während unser Entwicklerteam dies fest in unsere nächste App-Version einbaut.

Segmentierung

Verwenden Sie den Filter Feature-Flag, um ein Segment zu erstellen oder Messaging an Nutzer:innen zu richten, basierend darauf, ob ein Feature-Flag für sie aktiviert ist. Angenommen, Sie haben ein Feature-Flag, das Premium-Inhalte in Ihrer App steuert. Sie könnten ein Segment erstellen, das nach Nutzer:innen filtert, bei denen das Feature-Flag nicht aktiviert ist, und diesem Segment dann eine Nachricht senden, die sie zum Upgrade ihres Kontos auffordert, um Premium-Inhalte anzuzeigen.

  1. Öffnen Sie Ihr Segment oder Ihre Nachrichtenzielgruppe.
  2. Fügen Sie den Filter Feature-Flag hinzu.
  3. Wählen Sie das Feature-Flag aus.
  4. Setzen Sie den Vergleichsoperator auf ist, um Nutzer:innen einzuschließen, bei denen das Feature-Flag aktiviert ist, oder auf ist nicht, um Nutzer:innen einzuschließen, bei denen es nicht aktiviert ist. Braze Segment-Builder mit einem Feature-Flag-Filter für aktivierte Werte.

Weitere Informationen zum Filtern von Segmenten finden Sie unter Ein Segment erstellen.

Planbeschränkungen

Dies sind die Feature-Flag-Beschränkungen für kostenlose und kostenpflichtige Pläne.

Feature Kostenlose Version Kostenpflichtige Version
Aktive Feature-Flags 10 pro Workspace 110 pro Workspace
Aktive Campaign-Experimente 1 pro Workspace 100 pro Workspace
Feature-Flag-Canvas-Schritte Unbegrenzt Unbegrenzt

Ein Feature-Flag gilt als aktiv und wird auf Ihr Limit angerechnet, wenn eine der folgenden Bedingungen zutrifft:

  • Der Rollout liegt über 0 %
  • Es wird in einem aktiven Canvas verwendet
  • Es wird in einem aktiven Experiment verwendet

Selbst wenn dasselbe Feature-Flag mehrere Kriterien erfüllt – beispielsweise wenn es in einem Canvas verwendet wird und der Rollout bei 50 % liegt – wird es nur als 1 aktives Feature-Flag auf Ihr Limit angerechnet.

New Stuff!