Individualisierung

Text / Bild

Projektart

Video / Website

Aufgabe

Wir sollen ein individualisierbares Promo-Video für ein neues Produkt "Masterprint" von WhiteWall erstellen, dass die Mitarbeiter aus der Marketingabteilung von WhiteWall über eine eigens dafür von uns erstellte Webseite selbst erzeugen können.

Vorbereitung

Das 3D Basisvideo für den individuellen Film wurde von der Agentur Elastique erstellt. Wir hatten vorab gemeinsam abgestimmt in welcher Form Individualisierungen in dem Video möglich sein sollen und wie das Basisvideo beschaffen sein muss, damit wir es entsprechend verarbeiten können. Außerdem wurde abgeklärt was für Material noch für die Umsetzung eines möglichst realistischen Looks notwendig wäre. Licht- und Schattenkanäle sowie entsprechende Spiegelungen.

Text-Individualisierung -
Partnername

Der Text für den Kooperationspartner wird über das entsprechende Eingabefeld “Intro” in der Webseite eingegeben.

ww-createpage-eingabe-ausschnitt-intro1

Partnername - 0:01

Zu Beginn des Filmes wird sowohl der Name des Produkts “WhiteWall Masterprint” als auch der Name des Kooperationspartners erwähnt. Der Text steht zentriert im Bild. Der Text wird zu Beginn eingeblendet und nach einigen Sekunden wieder ausgeblendet.

whitewall-scene-1-before1whitewall-scene-1-after1
  • Position definieren
  • Font auswählen und anpassen
  • Erstellung von zwei Blenden

Text zum individuellen Bild - 1:04

Über dem individuellen Bild kann ein frei wählbarer Text stehen. Dieser wird je nach Format des Userbildes über dem Bild oder rechts neben dem Bild angezeigt. Durch den Kameraschwenk am Anfang ist eine Maske notwendig um die Kante des Durchgangs zu maskieren.

whitewall-scene-2-beforewhitewall-scene-2-after
  • Fläche tracken (Perspective-Tracking) (Import von vorhandenen Trackingdaten von Agentur)
  • Font auswählen und anpassen
  • Maske erstellen

Abschlusstext - 1:17

In der letzten Kameraeinstellung des Filmes besteht die Möglichkeit einen weiteren, frei wählbaren, Text einzufügen, welcher für die letzten 12 Sekunden des Films eingeblendet wird. Der Text wird schnell eingeblendet und ist in seiner Position, Größe und Schriftart an den kurze Zeit später eingeblendeten Link angepasst.

whitewall-scene-4-beforewhitewall-scene-4-after
  • Position definieren
  • Font auswählen und anpassen
  • Erstellung einer Blende

Bild-Individualisierung -
Individuelles Bild

Hier hat der Mitarbeiter WhiteWall die Möglichkeit ein für den Kooperationspartner passendes Bild einzubinden. Er kann dabei frei entscheiden ob es ein Hochformat oder ein Querformat sein soll. Die Webseite analysiert das Bildformat nach dem Hochladen automatisch und stellt alle folgenden Bereiche der Seite entsprechend des Formats dar.

Individuelles Bild - 1:04

Nachdem an einem festgelegten, statischen Bild Vorteile und Besonderheiten der Masterprints aufgezeigt wurden, wird das individuelle Bild im Video angezeigt. Dieses Bild hängt an der Wand. Eine 3D Figur steht im Vordergrund und betrachte das Bild. Damit das individuelle Bild so an der Wand dargestellt werden kann wurden uns von Elastique die Tracking Informationen für den Rahmen übermittelt die wir direkt in das Projekt importieren konnten (AfterEffekts to Impossible FX). Außerdem haben wir eine Maske für die Person im Vordergrund von Elastique geliefert bekommen. Durch die Spiegelung im Fußboden in der 3D Galerie musste das individuelle Bild ebenfalls gespiegelt werden und mit speziellen Filter in den Boden geblendet werden. Das sorgt dann für einen sehr realistischeren Effekt.

  • Tracking Daten importieren
  • Maske importieren
  • Spiegelung des Bildes anlegen
  • verlaufende “Unscharf-Maske” erstellen
  • Anwendung von Blendmodus
whitewall-scene-3-before1whitewall-scene-3-after1

Weitere Beispiele

Vergleichsvideo gekürzte Version

Layout der Webseiten

Das Layout der Erstellungsseite und der Landingpage wurde nach den Stilvorgaben der Whitewall Homepage entworfen und umgesetzt.

Website

Erstellungsseite für Videos mit Bildupload, -skalierung, -format und vier freien Textfeldern. Drei Textfelder für Texte im Video und ein Textfeld für die personalisierte Landingpage. Responsive und personalisierte Landingpage zum Anschauen des individualisierten Videos.

Erstellungsseite

Previewpage des Videos

whitewall-previewpage

Landingpage des Videos

whitewall-landingpage

Technische Details

Das Video wird in FullHD gerendert. Eine Preview wird dem WhiteWall Mitarbeiter umgehend als Streaming Video angezeigt und dem Kunden als MP4 Video in der Landingpage angezeigt.