Eine einkaufbare Videoplattform für AiBUY

Lösung

In vier Jahren intensiver Zusammenarbeit haben wir die folgenden Lösungen und Prozesse umgesetzt:

• ML-basierte Produkterkennung in Bildern und Videos
• Das AiBUY Overlay Management Portal
• Eine Microservices-basierte Architektur
• DevOps-Einrichtung
• Agile Prozessoptimierung für mehrere verteilte Teams

Fähige Video- und Bildeinblendungen

AiBUY Overlay ist eine kundeneigene Webplattform, die es Nutzern ermöglicht, Videos für alle Online-Kanäle zu erstellen, in denen Produkte und Dienstleistungen zusammen mit Handlungsaufforderungen und Interaktionen für einen reibungslosen Kauf präsentiert werden.

Die Lösung nutzt Technologien des maschinellen Lernens. Basierend auf dem in einem Bild oder Video erkannten Artikel, der eingeblendet werden soll, scannt das System, das von einer Computer-Vision-Software angetrieben wird, Bilder, die in Marketing-Partnernetzwerken gefunden wurden, analysiert sie automatisch und liefert die am besten passenden Produkte aus der Datenbank. Die automatischen Erkennungsergebnisse können von den Administratoren moderiert werden, und das zugrunde liegende neuronale Netz kann neu trainiert werden, um es an sich ändernde Geschäftsanforderungen anzupassen.

Unser Team ergänzte die Lösung mit den folgenden Funktionen:

• Angepasste Overlays für die AiBUY-Plattform, YouTube, Bilder, mobile Apps und HTML-Inhalte
• Integration mit führenden E-Commerce-Shops, Shopify und Magento, und dem Zahlungssystem Stripe
• Integration von Video-Playern von Drittanbietern mit Video.js
• Einrichtung und Integration von Salesforce Commerce Cloud

Während unserer Zusammenarbeit haben wir darauf geachtet, das Feedback der Nutzer hinsichtlich möglicher Verbesserungen und Kennzahlen wie Anzahl der Aufrufe pro Video, Konversionen pro Video, Smart-Store-Impressionen, die Anzahl der eindeutigen Nutzer, Aufrufe nach Land usw. zu berücksichtigen. Das Ergebnis ist, dass die AiBUY Overlay Plattform folgende Funktionen bietet:

• In-Media-Checkout: Die Integration mit Shopify, Magento und Stripe ermöglicht das Bezahlen von Artikeln direkt im Overlay.
• Link-out: Nutzer können eine Website eines Drittanbieters besuchen, um zusätzliche Informationen zu erhalten oder einen Kauf zu tätigen.
• Formulare zur Lead-Generierung: Ein praktisches Kommunikationsinstrument, das potenzielle Kunden direkt zum Overlay führt.
• Hot Spots: Administratoren können bestimmte Produkte oder Informationen zu bestimmten Zeitpunkten im Video hervorheben.
• Cue-Points: Admins können Cue-Points zu einem bestimmten Zeitpunkt setzen, damit Betrachter während der Videowiedergabe Nachrichten und Handlungsaufforderungen erhalten.
• Analytik: Das Video- und Smart-Store-Analysesystem ermöglicht es Administratoren, Einblicke in Interaktionen mit Käufern sowie in Umsatz- und Trendkennzahlen zu erhalten.
• Verknüpfte Smart Stores: Zugehörige Stores werden am Ende des Videos oder als Anzeige im Produktreel eingeblendet.

Neugestaltung der Architektur

Als wir anfingen, lief das AiBUY Overlay als Frontend in JavaScript, das Managementportal und der Adminbereich als Middle-Tier in PHP und der monolithische Service Bus als Backend in Java. Dies verursachte einige Probleme:

• Alle Dienste waren um den monolithischen Service Bus gruppiert und hatten unkontrollierten Zugriff auf verschiedene interne und externe Datenquellen und Dienste.
• Um einen bestimmten Teil der Geschäftslogik zu ändern, mussten die AiBUY-Ingenieure mehrere Dienste in verschiedenen Sprachen aktualisieren.
• Die Dienste verwendeten veraltete Versionen von Bibliotheken und Sprachen.
• Ohne Cloud-Umgebung wurden die Dienste auf der unternehmenseigenen Hardware in einem lokalen Rechenzentrum bereitgestellt.
• Aufgrund des hohen Aufwands für externe Dienste und der schwierigen Wartung für interne Dienste gab es keine zentrale Protokollierung und Erfassung von Leistungsmetriken.

Im Zuge der Neugestaltung der Architektur haben wir:

• Einführung von Microservices
• Migration der Lösung in die Cloud
• Integration von Diensten Dritter
• Isolierung der Logik vom Monolithen zu Microservices und Integration des Frontends mit den zugehörigen Diensten, um Logikduplizierung zu vermeiden und die Migration von Legacy-Code zu beginnen
• Refaktorisierung des Java-Codes unter Beibehaltung der wichtigsten Geschäftslogik, wodurch drei Jahre technischer Schulden beseitigt wurden
• Weiteres Minimieren der technischen Schulden durch Abdeckung jeder Iteration mit Unit- und Integrationstests und Neuschreiben von Teilen der verwendeten monolithischen Anwendungen
• Erstellte ein zentrales Repository für Konfigurations- und sensible Daten
• Implementierung eines neuen Kommunikationsansatzes zur Verbindung verschiedener Systemteile mit RabbitMQ
• Standardisierte Entwicklungsansätze

Umzug zu AWS

Das Team von Transition stellte AWS-Beratungsdienste bereit und ersetzte externe Dienste wie CDN und Videotranskodierung durch AWS, um die Infrastruktur zu vereinfachen und die Support- und Nutzungskosten zu senken. Die Dienste kommunizierten nicht mehr direkt miteinander, sondern nutzten stattdessen API Gateway/Load Balancer API und andere Infrastrukturvorteile, um nahtlose Aktualisierungen und bei Bedarf horizontale Skalierung zu ermöglichen. Als Ergebnis war die implementierte Infrastruktur nicht mehr monolithisch, da wir das gesamte Backend in Microservices überführten.

Die Microservices kommunizierten über HTTP, wobei eine synchrone Antwort erforderlich war. Um asynchrone Nachrichten abzudecken, haben wir die Kommunikation über AWS SQS/SNS mit AWS Lambda aktiviert. Nur das Management-Portal und das AiBUY-Overlay wurden öffentlich zugänglich gemacht und über ein CDN verteilt.

Am Ende des Redesigns umfasste das Projekt-Ökosystem 12 Umgebungen, die unabhängig voneinander liefen und jeweils mehr als 30 einzelne Microservices, serverlose Lambdas, Frontend-Single-Page-Anwendungen und PHP-Services enthielten.

Plattformanpassungen für AiBUY-Kunden

Als Teil der laufenden Partnerschaft hilft Itransition AiBUY bei der Bereitstellung kundenspezifischer Funktionen für ihre Kunden. Hier sind Beispiele für die wichtigsten Anpassungen:

Integration für eine mobile Podcast-App

Für einen AiBUY-Kunden mit einer Podcast-Anwendung hat unser Team AiBUY Overlay mit seiner mobilen Lösung verbunden, um den Zuhörern zu ermöglichen, in einem Podcast erwähnte Artikel zu kaufen.

Zu diesem Zweck konfigurierten wir die Overlay-Plattform, entfernten Video-Content-Module und erstellten Produktkauf- und Zahlungsabläufe für die Podcast-Anwendung. Damit Nutzer die in einem Podcast erwähnten Artikel sehen können, haben wir ein Overlay-Widget implementiert, das AiBUY Overlay über eine öffentliche API öffnet. Wenn der Podcast-Hörer auf Stichpunkte für Produkte oder zusätzliche Informationen klickt, zeigt die App den entsprechenden Artikel an oder leitet ihn auf die Informationsseite weiter.

Integration für eine mobile AR-App

Wir haben AiBUY Overlay in eine mobile AR-Anwendung integriert, um Online-Erlebnisse interaktiver zu gestalten. Unser Team passte das Erscheinungsbild von AiBUY Overlay an und implementierte ein Zahlungs-Widget, um den Nutzern zu ermöglichen, Artikel in der App zu kaufen.

Als Ergebnis kann die Anwendung des Kunden auf die Kamera des mobilen Geräts des Nutzers zugreifen und AR-Elemente überlagern, die der Nutzer über das AiBUY-Widget kaufen kann.

Integration für eine Website mit Trainingsvideos

Itransition hat einem weiteren Kunden von AiBUY die Möglichkeit gegeben, Sportartikelwerbung in Trainingsvideos auf seiner Website zu integrieren.

Um dies zu erreichen, implementierten wir ein benutzerdefiniertes Overlay, das mit der Funktionalität des JW Players kompatibel ist, den das Unternehmen als Videoplayer verwendet. Außerdem haben wir das AiBUY Overlay in die JW Player API integriert, das Look and Feel von AiBUY modifiziert und die Möglichkeit geschaffen, einen Link zum Werbevideo manuell hinzuzufügen.

Streaming von Inhalten der New Yorker Modewoche

Eine weitere Integration wurde für die New York Fashion Week implementiert, indem wir AiBUY Overlay mit dem kundenspezifischen Videoplayer verbunden und zwei wesentliche Funktionen hinzugefügt haben.

Die erste Funktion war für das Live-Streaming der Veranstaltung gedacht und ermöglichte es dem Kunden, ein Produkt-Set im Voraus zu erstellen und dann relevante Artikel während der Live-Streams der Runway-Shows zu aktivieren und zu deaktivieren.

Die zweite Funktion generiert automatisch Slide-Outs von Live-Events, die während der Videowiedergabe angezeigt werden. Sie ermöglichte es dem Kunden, Produkte während der Show in On-Demand-Videos wiederholt zu aktivieren und zu deaktivieren, ohne neue Overlays manuell zu erstellen.

 

Ergebnisse

Während der dreijährigen Partnerschaft war Itransition voll verantwortlich für die Entwicklung der Shoppable-Video-Plattform und entwickelte die effektivsten Lösungen für die neuen Ideen von AiBUY.

Während unserer Zusammenarbeit haben wir die folgenden Ergebnisse erzielt:

• Wir haben Funktionen des maschinellen Lernens eingesetzt, die eine automatische Produkterkennung unter 1,5 Millionen Bildern ermöglichen.
• Wir haben die Architektur der Plattform vollständig von einer monolithischen zu einer Microservices-basierten Architektur umgestaltet und eine AWS-Migration in die Cloud durchgeführt.
• Wir integrierten die Lösung mit Zahlungssystemen von Drittanbietern, Videoplattformen, Magento und Shopify.
• Wir beschleunigten die Release-Bereitstellung von 40 Stunden auf 30 Minuten.
• Wir erreichten eine 2,5-fach höhere Produktivität mit besserer Ressourcenauslastung und geringeren Ausfallzeiten.
• Wir führten häufige Feature-Releases ein, wobei die Kosten für die Bereitstellung von Features um 30 % gesenkt wurden.