Frame Slider

The Nielsen Company ist für die marketingorientierte Auswertung aufgenommener Sportveranstaltungen verantwortlich. Die Videoanalyse überprüft die zu erbringende Leistung.

Das in die Jahre gekommene Werkzeug zur Videoanalyse Nielsens sollte durch eine cloudbasierte App ersetzt werden. Ziel war es, die in der Cloud bereitzustellenden Videos framegenau auszulesen und innerhalb von Videos einfacher zu navigieren. In seinen grundlegenden Analysefunktionen orientierten wir uns am bestehenden Werkzeug. Eine zentrale Änderung ergab sich im Aufbau der Benutzeroberfläche. In diese sollten die ausgelesenen Frames integriert werden, um die bisherige Lösung eines Pop-up-Players für die Videos zu ersetzen.

Für die Projektdauer wurde ein Team von Frontend und Backend Developern sowie Testern unserem Kunden zur Verfügung gestellt. Die Videos werden zunächst vom Server in ein S3 Bucket geladen. Um die auf dem Server befindlichen Videos auch für den Browser optimiert verwenden zu können, erstellten wir einen Frame Worker, der aus den Videos Einzelbilder extrahiert und im Bucket speichert. Über eine SQS Queue wird der Frame Worker darüber informiert, dass neue Videos in den Bucket hochgeladen werden. Die SQS Queue gruppiert die Videos nach dem Prinzip „First in, First out“.

Nielsen entwickelte unabhängig von unserem Entwicklerteam eine GraphQL API, die für unsere Arbeit eine zentrale Schnittstelle darstellte. Zur Kommunikation mit der GraphQL API erstellten wir ein Backend For Frontend (BFF), die die ausgelesenen Daten für das GUI aufbereitet. Das BFF ist außerdem mit einem Frame Server verbunden, der wiederum eine Verbindung mit dem Bucket unterhält, auf dem die Videos gespeichert sind. Das BFF liest die im Frontend notwendigen Frames aus und übermittelt diese.

Um während der Entwicklung des Tools nicht auf Cloud-Dienste oder Deployments warten zu müssen, richteten wir neben dem S3 Bucket auch einen lokalen minIO Server ein. Die Entwickler können so per Konfiguration zwischen Cloud-basierten Diensten und lokalem Server nach Bedarf wechseln.

Für eine benutzerfreundliche Möglichkeit der Videoanalyse stellten wir Nielsen den Frame Slider zur Verfügung. Dieser stellt im Frontend das Video in einzelnen Frames dar, sodass nur ein kleiner Teil der Videodatei tatsächlich ausgelesen werden muss, um eine Funktionalität zu gewährleisten. Das Programm entwarfen wir in Canvas, bevor es in die Benutzeroberfläche integriert wurde. Diese wurde zudem um zahlreiche Funktionen erweitert, die beispielsweise die Konfiguration der Benutzeroberfläche betreffen.

Die Autorisierung von Benutzern für das Videoanalysetool findet über Okta per single sign on statt. Zusätzlich erstellten wir ein Grafana Dashboard, über das Daten und Logs visualisiert und überwacht werden können.

Die benutzerfreundliche Videoanalyse erfolgt über den Frame Slider. Das zu analysierende Video wird per Websocket gestreamt. In der Benutzeroberfläche werden lediglich die anzuzeigenden Frames ausgelesen, um das anfallende Datenvolumen so gering wie möglich zu halten. Die Benutzeroberfläche des vorher verwendeten Werkzeugs wurde adaptiert und um den Analysealltag erleichternde Funktionen ergänzt. Neue Benutzer können sich leicht in die Funktionalität des Frame Sliders über eine interaktive Tour einarbeiten.