Optimizely

App Optimizely Cover

Die Optimizely-App ermöglicht es Editor*innen und Content-Manager*innen, auf einfache Weise Experimente mit strukturiertem Content durchzuführen.

Contentful und Optimizely arbeiten zusammen, um Experimente zu ermöglichen, ohne dass Entwickler*innen involviert werden müssen. Dies bedeutet, dass Editor*innen nach der Einrichtung Experimente mit Content mithilfe der Contentful Web-App durchführen können und keine Codeänderungen an Clients anfordern müssen. Dies ermöglicht einen leistungsstarken und flexiblen Workflow für Editor*innen und Content-Manager*innen.

Um Optimizely erfolgreich in Ihr Content-Modell zu integrieren, werden wir die folgenden Topics behandeln:

  • Voraussetzungen

  • Terminologie

  • Installation und Konfiguration

  • Verwendung

  • Integration mit Ihrem Frontend

  • FAQ und Fehlerbehebung

Voraussetzungen

Die Voraussetzungen für die Durchführung von Experimenten mit Optimizely und Contentful sind folgende:

  • Ein Contentful Konto mit einem Space für Ihre Website.

  • Ein Optimizely-Konto mit einem Full-Stack-Projekt.

  • Ein/e Entwickler*in, der/die die erste Lösung in Ihr Frontend integriert.

Terminologie

Wir beginnen mit der Erläuterung der Begriffsdefinitionen.

Was ist eine Variation?

Eine Variation ist einfach eine mögliche Option oder Variante in einem Test. Wenn Sie A/B-Tests durchführen, testen Sie zwei verschiedene Optionen: Option A und Option B. Übersetzt in reale Begriffe: Wenn Sie zwei Varianten einer Schaltfläche haben, möchten Sie vielleicht sehen, welche mehr Klicks erhält.

Was ist ein Referenzfeld?

Ein Referenzfeld ist spezifisch für Contentful. Es ist ein Feld innerhalb eines Contenttyps, das keinen eigenen Wert enthält, sondern auf einen oder mehrere Einträge verweist. In der folgenden Abbildung haben wir einen Contenttyp namens „Seite“. Die Seite hat ein Referenzfeld mit der Bezeichnung „Komponente“. Das Referenzfeld „Komponente“ ist eine Liste von Elementen (Contenttypen), die auf einer Seite zu finden sind.

App Optimizely Static Content Model

Was ist ein Variationscontainer?

Ein Variationscontainer ist ein von der Optimizely-App erstellter Contenttyp, der anstelle eines Werts in einem Referenzfeld verwendet wird. In der folgenden Abbildung haben wir unseren CTA-Eintrag (Call To Action) durch einen Variationscontainer ersetzt, der zwei verschiedene CTAs enthält.

Auf diese Weise transformiert die Optimizely-App Ihr Content-Modell und bereitet es für das Experimentieren vor. Wie im Abschnitt „Was Sie benötigen“ erwähnt, benötigen Sie Entwickler*innen, um die neue Antwort von Contentful zu verarbeiten.

App Optimizely Experimentable Content Model

Schritt 1 – Installieren Sie die App

Optimizely fordert Sie auf, sich anzumelden und den Zugriff auf Ihr Konto zu autorisieren, um es mit Contentful zu verbinden.

Apps Optimizely install

Wählen Sie ein Optimizely Full Stack-Projekt aus, das Sie für Ihre Experimente verwenden möchten.

HINWEIS: Wenn Sie keine Liste der Projekte sehen, bedeutet dies, dass Sie keine Projekte in Optimizely gestartet haben. Sie müssen zunächst ein Projekt starten und ein Experiment erstellen, bevor Sie fortfahren können.

Klicken Sie auf Installieren.

Schritt 2 – Konfigurieren Sie die App

Nachdem die App installiert ist, ist es an der Zeit, ein Experiment einzurichten. Wir werden ein Beispiel-Setup durchgehen, bei dem wir ein Experiment mit der CTA-Schaltfläche einer Seite durchführen.

Wir aktivieren das Experimentieren mit dem Komponentenreferenzfeld, indem wir es in der Optimizely-App aktivieren. Wenn Sie auf die Schaltfläche „Contenttyp hinzufügen“ klicken, wird ein Modal angezeigt, in dem wir den Seitencontenttyp auswählen und die „Komponente“ aktivieren.

Apps Optimizely Variation

Wie Sie sich aus unserem obigen Beispiel erinnern werden, ist „Komponente“ ein Referenzfeld:

App Optimizely Static Content Model

In Contentful sieht es folgendermaßen aus:

Apps Optimizely Home Page

Nachdem wir die App installiert und so konfiguriert haben, dass sie mit der „Komponente“ experimentiert, werden wir unseren Content bearbeiten, um den Variationscontainer zu verwenden. Auch hier ist der Variationscontainer ein benutzerdefinierter Contenttyp, der von der Optimizely-App installiert wird.

Apps Optimizely New Create Experiment

Im oben gezeigten Ablauf gehen Sie wie folgt vor:

  1. Fügen Sie unserer „Komponente“ einen Variationscontainer hinzu.

  2. Wählen Sie das CTA-Experiment aus dem Dropdown-Menü in der Optimizely-App-Oberfläche aus.

  3. Wählen Sie den vorhandenen CTA „Jetzt kaufen!“ CTA als unsere Kontrollgruppe.

  4. Erstellen Sie einen neuen CTA-Eintrag mit dem Wert „20 % Rabatt!“ und verwenden Sie das als unsere Variation.

  5. Veröffentlichen Sie den neuen CTA-Eintrag.

  6. Veröffentlichen Sie den Variationscontainer.

  7. Entfernen Sie den alten CTA-Block.

  8. Veröffentlichen Sie unsere Seite.

Editor*innen können Werte einfach austauschen und sie in Variationscontainer verwandeln, wie im obigen Beispiel. Dies macht es einfach, jedes Referenzfeld, das zum Anzeigen von Content verwendet wird, in einen Variationscontainer umzuwandeln, der Content basierend auf einem Experiment anzeigt.

Variationscontainer sind ein neuer Contenttyp, der in die Contentful Antwort eingeführt wird. Es handelt sich um Container, die auf zwei oder mehr tatsächliche Werte verweisen, die wir testen möchten. Wir müssen jetzt unser Frontend mit Optimizely und den Variationscontainern integrieren. An dieser Stelle benötigen wir die Hilfe von Entwickler*innen, um die Funktionsweise unseres Frontends zu ändern, damit es Variationscontainer akzeptiert und programmatisch verarbeitet.

Von hier aus müssen wir uns technisch mit der Einrichtung des Clients und seiner Integration mit Optimizely befassen. Der folgende Leitfaden verwendet dasselbe CTA-Beispiel, das wir bisher verwendet haben. Entwickler*innen sollten sich mit den oben beschriebenen Inhalten vertraut machen, bevor sie mit der folgenden technischen Anleitung fortfahren.

Die Ziele der Einrichtung sind:

  • Ermöglichen Sie serverseitiges Experimentieren, ohne für jedes Experiment neuen Code zu pushen.

  • Trennung von Aufgaben: Kontrolle des Contents in Contentful und der Experimente in Optimizely.

  • Geschwindigkeit: serverseitige Auswahl von Variationen für eine schnelle Bereitstellung und zur Vermeidung des „Flash of Content“.

Wie die Optimizely-App die Contentful API-Antwort ändert

Wie oben erwähnt, erstellt die Optimizely-App einen neuen Contenttyp: den Variationscontainer. Schauen wir uns noch einmal das CTA-Beispiel an, das „Jetzt kaufen!“ lautet:

App Optimizely Static Content Model

Mit der Optimizely-App wird das gleiche Content-Modell transformiert. Wo wir ursprünglich den CTA „Jetzt kaufen!“ erhalten haben, erhalten wir jetzt einen Variationscontainer mit allen möglichen CTAs:

App Optimizely Experimentable Content Model

Der Variationscontainer ist einfach ein Contenttyp, der die möglichen Werte für den CTA verschachtelt und Metadaten über das Optimizely-Experiment und die Variationsnamen enthält.

Optimizely verwenden, um die richtige Variation auszuwählen

Wir werden ein Pseudo-Backend erstellen, das die Contentful API-Antwort übernimmt und das Optimizely-SDK verwendet, um zu bestimmen, welche Variante Nutzer*innen angezeigt werden soll.

Schauen wir uns zunächst die JSON-Antwort des Variationscontainers an, die von Contentful zurückgegeben wird. Beachten Sie, dass der Contenttyp eine Meta-Variations- und experimentKey-Eigenschaft enthält.

Optimizely variation container JSON response

Bevor wir auswählen können, welchen Eintrag wir aus unserem Variationscontainer auswählen möchten, müssen wir sehen, wie wir die richtige Variante von Optimizely erhalten. Nachfolgend finden Sie ein Beispiel mit einem fest codierten Test, um eine Variante für eine/n Nutzer*in zu erhalten.

Optimizely variation test

Im obigen Code hat Optimizely festgelegt, dass diese/r Nutzer*in die Option Variation sehen soll. Dies ist ein Wert, den wir aus dem Metafeld des Variationscontainers erhalten können.

Jetzt werden wir unseren Code aktualisieren, um den Variationscontainer selbst und seine Werte zu verwenden, um das Optimizely-Experiment zu füllen.

Optimizely pull variation container

Wir haben jetzt die entryId des CTA-Contentblocks, den wir anzeigen möchten. Das bedeutet, dass der Content, den wir anzeigen sollten, „20 % Rabatt!“ lautet. CTA aus Abb. 1.2 oben. Von hier aus sollten Sie in der Lage sein, minimale Änderungen an Ihrer Anzeigelogik vorzunehmen, um den richtigen Eintrag anzuzeigen.

Wichtige Hinweise zu diesem Beispiel

In diesem Beispiel haben wir userId verwendet. Optimizely erfordert, dass Sie aktuelle Nutzer*innen identifizieren, damit sie bestimmen können, in welche Versuchsgruppe sie platziert werden sollen. Diese ID sollte dem/der Nutzer*in zugeordnet bleiben und ihn/sie in verschiedenen Sitzungen richtig identifizieren. Wenn Sie eine Zufallszahl als ID verwenden, funktioniert Ihr A/B-Test nicht richtig und die Ergebnisse sind bedeutungslos.

Im obigen Beispiel wurde eine Datendatei verwendet, um den Optimizely-Client zu erstellen. Diese wird von Optimizely bereitgestellt und ist für Ihr Projekt einzigartig. Mehr über die Datendatei erfahren Sie hier.

Nur veröffentlichter Content auf Contentful wird im Variationscontainer angezeigt. Mit einer Contentful Umgebung können Sie testen, wie ein Variationscontainer funktioniert, bevor Sie Ihr Experiment in die Produktion überführen.

Full-Stack-Experimentieren vs. Feature-Experimentieren

Informationen darüber, was bei der Migration von Projekten von „Optimizely Full Stack Experimentation“ zu „Feature Experimentation“ zu beachten ist, finden Sie im Migrationshandbuch von Optimizely.

Wie wirkt sich die Optimizely-App auf meine Umgebung aus?

Die App muss einen neuen Contenttyp erstellen, der als Variationscontainer bezeichnet wird. Der Variationscontainer ist ein benutzerdefinierter Typ, der eine benutzerdefinierte Editor-Schnittstelle innerhalb der Web-App verwendet und Daten von Optimizely und Contentful sammelt.

Wo kann ich meine Experimente aktivieren?

In Optimizely. Wir wollen eine klare Trennung der Aufgaben beibehalten. Das bedeutet, dass Contentful den Content und Optimizely das Experiment steuert. Die Optimizely-App bietet Deep-Links in der Seitenleiste zu den Optimizely-Dashboards, um einen einfachen Zugriff auf Ihre Experimente zu ermöglichen, in denen Sie Experimente einrichten und starten können.

Warum wird meine App-Konfiguration nicht gespeichert?

Sie müssen daran denken, oben rechts in der Optimizely-App auf „Speichern“ zu klicken, um die vollständige Konfiguration zu speichern.

Warum werden eine oder mehrere meiner Variationen nicht angezeigt?

Wenn Sie Variationen innerhalb eines Variationscontainers auswählen, müssen Sie sicherstellen, dass sie veröffentlicht werden und kein Entwurf sind. Darüber hinaus müssen Sie sicherstellen, dass Ihr Variationscontainer selbst veröffentlicht wird, damit er in der API-Antwort angezeigt wird.

Wie kann ich einen Fallback- oder Standardwert für mein Experiment definieren?

Das liegt ganz bei Ihnen. Ein Standardwert oder Fallback ist jedoch in der Regel die Kontrollgruppe. Wenn Sie eine bestimmte Zielgruppe haben, der Sie das Experiment nicht zeigen möchten und die nicht betroffen sein soll, müssen Sie sicherstellen, dass Ihr Frontend das Szenario des Rückgriffs auf Ihre Kontrollgruppe bewältigen kann.

Wie ziele ich auf eine bestimmte Zielgruppe ab?

Dies geschieht in Optimizely. Sie müssen einen eindeutigen Wert (in der Regel eine Nutzer-ID) angeben, damit Optimizely weiß, wer gerade ein Experiment sieht. Wenn Sie eine benutzerdefinierte Lösung benötigen, müssen Sie mehr Datenpunkte bereitstellen, um Ihre Zielgruppe korrekt anzusprechen. Wenn Sie eine Zielgruppe ausschließen möchten, lesen Sie oben, wie Sie einen Standard- oder Fallback-Wert definieren.

Was mache ich, nachdem ein Experiment beendet ist?

Es stehen einige Optionen zur Verfügung. Derzeit bietet Optimizely die Möglichkeit, die gewinnende Variante automatisch anzuzeigen, nachdem Ihr Experiment einen aussagekräftigen Datensatz gesammelt hat. Das bedeutet, dass Sie Ihren Variationscontainer an Ort und Stelle lassen und Optimizely erlauben, immer den Gewinner auszuwählen.

Eine weitere Möglichkeit besteht darin, den Variationscontainer manuell zu entfernen und durch den Wert zu ersetzen, der das Experiment gewonnen hat. Dies kann von Vorteil sein, da Sie sich nicht mehr auf Optimizely verlassen müssen, um den richtigen Content bereitzustellen.

Werden meine Experimente durch die Deinstallation der Optimizely-App beeinträchtigt?

Ihre vorhandenen Experimente werden weiterhin ausgeführt. Wir sagen Optimizely nie, was mit Ihren Experimenten zu tun ist. Wir lesen einfach die Namen der Experimente, die Variationsgruppen und die Traffic-Daten der Experimente. Die Editor-Erfahrung im Umgang mit Experimenten innerhalb der Contentful Web-App wird jedoch stark beeinträchtigt. Variationscontainer existieren weiterhin, aber der benutzerdefinierte Editor, den sie verwenden, wird deinstalliert.

Warum wird der Variationscontainer nicht als Option in meinem Referenzfeld angezeigt?

In Ihrem Referenzfeld sind möglicherweise bestimmte Validierungen aktiviert. Das bedeutet, dass Sie den Variationscontainer als möglichen gültigen Contenttyp für dieses Feld aktivieren müssen. Dies kann in der App erfolgen oder indem Sie den spezifischen Contenttyp finden und die Validierungen so ändern, dass sie den Variationscontainer enthalten.