PAGE online

So tauchen Sie mit HTML5 in fotorealistische Unterwasserwelten ab

Wie die Bremer Produktionsfirma Kubikfoto das Optimum aus geringer Datenmenge und visueller Qualität ermittelt …

Technik_Kubikfoto_Creator_Greenpeace_Teaser
© Kubikfoto

Vor 30 Jahren fiel die Rainbow Warrior, ein Schiff von Greenpeace, einem grausamen Anschlag zum Opfer. Bevor es aus dem Hafen von Auckland, Neuseeland zu einem geplanten Protest gegen französische Atombombentests auslaufen konnte, versenkten zwei Sprengsätze des französischen Geheimdienstes das Schiff. Anlässlich des 30. Jahrestages dieses schrecklichen Ereignisses haben Greenpeace und die Bremer Produktionsfirma Kubikfoto zu Ehren der Rainbow Warrior ein Web-Projekt ins Leben gerufen.

Auf der Website rainbow-warrior.info kann man interaktive Tauchgänge in die Unterwasserwelt starten und die Rainbow Warrior erkunden. Nach insgesamt sechs Tauchgängen vor Ort, Retusche, Postproduktion und HTML-Programmierung ist das Projekt nun fertig. Die Entwickler von Kubikfoto haben eigens dafür eine auf HTML5 basierende Software entwickelt.

Was der »Kubikfoto Creator« kann und wie er funktioniert, erzählte mir der Informatiker Thorsten Schomburg, Leitung Entwicklung und Mitgesellschafter von Kubikfoto GmbH in Bremen, im Interview.

(Sehen Sie zudem weiter unten in der Galerie mehr Bilder des Web-Projektes und des Making-ofs.)

Was kann der Kubikfoto Creator und wofür hat Kubikfoto ihn entwickelt?

Thorsten Schomburg: Um dem Besucher eines Kubikfotos das Gefühl zu geben, dass er sich durch eine interaktive Welt bewegt, werden hunderte Bilder und Media-Dateien miteinander verknüpft und in eine logische Struktur gebracht.
Diese Logik ist in ihrer Gesamtheit recht komplex und kann nicht mehr mit »einfachen Mitteln« programmiert und verwaltet werden.
Wir haben deshalb im Laufe der letzten Jahre den »Kubikfoto³ Creator« für uns entwickelt. Dieser ist in Wirklichkeit eine Sammlung aus einer Reihe verschiedener Software-Module.

Wie sieht das praktisch während einer Konzeptionsphase aus? An welchen Stellen hilft der Creator insbesondere?

Unser Kubikfoto³ Creator unterstützt uns schon während der Konzeption beziehungsweise der Storyboardingphase. Im Programm kann die Struktur schon vor dem Shoot angelegt werden, mit Layoutbildern oder Skizzen versehen werden. Das ist einerseits für Abstimmungen wichtig, aber vor allem für den Shoot on Location, alle erforderlichen Fotos und Videosequenzen sind dort dann vermerkt.
Shoots für diese interaktiven Projekte sind in erster Linie sehr kompliziert, da die verschiedenen Szenen räumlich zusammenhängen (mit sogenannten Transitions verbunden sind) und die Zeit ja quasi »eingefroren ist«. So muss vor Ort oftmals mit mehreren Kamerateams gleichzeitig produziert werden.

Wie funktioniert denn die Darstellung eines Kubikfotos?

Zur Darstellung eines Kubikfotos haben wir eine eigene Engine in Javascript programmiert. Basierend auf dem HTML5-Standard erkennt und nutzt unsere Engine die vorhandenen Features in dem jeweilig verwendeten Browser bzw. Device.
Die Engine bietet eine abstrakte Logik-Ebene, auf der es zum Beispiel egal ist, in welchem Format ein Video verwendet werden muss.
Wichtig ist für uns auf dieser Ebene nur noch, was soll wann und wodurch geschehen. Soll also ein Video nach einer Interaktion des Besuchers, nach einem Timeout oder gar nur zu einer bestimmten Tageszeit abgespielt werden.
Wir haben durch die Realisierung der zahlreichen Projekte die Engine mittlerweile um einige zusätzliche interaktive Objekte erweitert, die wir ebenso in einer standardisierten Form verwenden können.

Die aufgenommenen Fotos und Videos müssen ja noch bearbeitet und in eine Struktur gebracht werden. Wie geht das?

Hierzu bietet uns der Kubikfoto³ Creator eine automatisch erstellte Ordnerstruktur, in der die Dateien abgelegt werden. Diese kann in jedem Entwicklungsstadium als Map visualisiert werden.
Für die Retusche nutzen wir Standards wie Photoshop und Adobe After Effects. Dafür haben wir diese um eigene PlugIns erweitert oder verwenden sie etwas »ungewöhnlich«. So haben beispielsweise die Namen der Groups und Layer in Photoshop eine spezielle Syntax. Diese wird vom Kubikfoto³ Creator später ausgelesen und in Befehls-Sequenzen für unsere Engine übersetzt. Das heißt, in erster Linie bekommen bei uns somit die Fotografen und Post Productioner die Möglichkeit, den wesentlichen Teil der Logik in ihrem gewohnten Umfeld festzulegen.

Und wenn mal eben schnell Änderungen zu erledigen sind – kann der Kubikfoto Creator das umsetzen?

Im Laufe der Projektrealisierung kommt es natürlich immer wieder zu Anpassung und Verbesserungen. Deshalb überprüft ein weiteres Modul des Kubikfoto³ Creators ständig auf Änderungen und konvertiert die neuen Dateien automatisch in alle notwendigen Web-Formate, optimiert sie und legt sie in der Kubikfoto-Struktur ab.

Ich würde gerne noch wissen, ob Sie die Module ständig erweitern oder ob der Creator so bleibt wie er jetzt ist?

Da wir jedes unserer Projekte individuell für den Kunden erstellen und dabei sehr gerne »unseren Standard« verlassen, sind die Kubikfoto³ Creator Module durch unsere Programmierer leicht erweiterbar. So ist auch der Tauchgang um das Rainbow Warrior Wrack extra für dieses Projekt entwickelt worden. Erweiterungen, die sich bewährt haben, gehen dann später in den Standard über.
Bei all der Strukturierung und Automatisierung, die es uns erlaubt schnell zu guten Resultaten zu kommen, ist es für uns sehr wichtig, überall individuelle Anpassungen vornehmen zu können. So können wir immer das Optimum aus geringer Datenmenge und visueller Qualität ermitteln.

Technik_kf_editor
Screenshot aus dem Kubikfoto Creator
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
1/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
2/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
3/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
4/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
5/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
6/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
7/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
8/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
9/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
10/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
11/18
Kubikfoto Creator
Web-Projekt – Bild: @ Kubikfoto
12/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
13/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
14/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
15/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
16/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
17/18
Kubikfoto Creator
Making-of – Bild: @ Kubikfoto
18/18
Produkt: Download PAGE - Animierte Illustrationen im Trend - kostenlos
Download PAGE - Animierte Illustrationen im Trend - kostenlos
Animation ist unverzichtbarer Teil des Designalltags

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Das könnte dich auch interessieren