Wege weg von Flash: Videos und Animationen konvertieren und ersetzen

12.08.2016 | Kurzmeldung

Es gab Zeiten, da war Flash notwendig, wenn man interaktive oder multimediale Elemente in Webseiten einbinden und nutzen wollte. Von Videos über Animationen bis zu vollständigen Benutzeroberflächen wurden bewegte Elemente für Webseiten in Adobe (Macromedia) Flash erstellt. Auch in Lernmanagement-Systemen kommt Flash zum Einsatz. Doch inzwischen können mit der Unterstützung von HTML5 in modernen Browsern viele Anwendungsszenarien mit anderen Mitteln abgedeckt werden.

Hauptbild des Beitrags

Aus einer Flash-Animation erstelltes GIF

Die weitgehende Verwendung von HTML5-Techniken für die Bereitstellung von Videos und Animationen erleichtert die Anwendungsentwicklung und macht Webseiten weniger anfällig für Abstürze und Sicherheitslücken. Schon im April 2010 äußerte sich Steve Jobs in seinem Beitrag Thoughts on Flash kritisch gegenüber Flash . Darin führt er unter anderem an, dass Adobe’s Flash Produkte 100% proprietär seien, was nicht zu der sonst üblichen Verwendung offener Standards für Internetanwendungen passe. Performance- Stabilitäts- und Sicherheitsprobleme führten zu einer Verschlechterung des Nutzererlebnisses. Zudem sei die Technik für mobile Geräte ungeeignet.

Inzwischen ist Einsatz von Flash im Netz rückläufig, verschiedene Browserhersteller schränken die Unterstützung von Flash ein und wollen sie in Zukunft ganz unterbinden. Google kündigte kürzlich an, dass der Chrome-Browser die meisten Flashinhalte bereits ab September 2016 standardmäßig blockieren wird; auf Firefox sollen  laut einer Ankündigung Flashinhalte ab 2017 nur noch nach individueller Zustimmung des Nutzers gezeigt werden, und auch andere große Plattformen wie Youtube oder Facebook verabschieden sich von der Technik. 

Gerade für Betreiber von Webseiten, die schon länger online sind, stellt sich die Frage: Was kann man tun, um möglicherweise vorhandene alte Videos und Animationen weiterzunutzen?

Werden Flash-Anwendungen nur für die Darstellung von Videos oder Animationen genutzt, können Flash-Dateien in kurze Videos oder animierte GIFs umgewandelt und mit Mitteln von HTML5 in die Website eingebunden werden. Um dies zu erreichen, müssen unter Umständen Zwischenschritte eingelegt werden. Da dies auch e-teaching.org betrifft, haben wir nun zwei verschiedene Wege getestet:

1. Konvertierung von SWF-Dateien in Videos oder animierte GIFs

Ein Weg besteht darin, aus den von Flash erzeugten SWF-Dateien mehrere Einzelbilder zu erstellen und diese später wieder zu einem Film zusammenzusetzen.

Das ist allerdings nicht so einfach, wie es zunächst scheint, denn das proprietäre SWF-Format ist kein offener Standard. Zudem kann es Vektorgrafiken und Animationen, verschiedene Bild- und Videoformate integrieren.

Bei SWF-Dateien handelt sich um kein klassisches Video-Format, auch wenn das Ergebnis im Browser als kurze Animation oder Video zu sehen ist. Dementsprechend kompliziert ist die Konvertierung. Zwar gibt es einige Konverter, wie beispielsweise die freien SWFTOOLS. Die Ergebnisse können aber je nach Ausgangsdatei qualitativ unterschiedlich ausfallen. Die folgenden Schritte können auf einem Ubuntu-Linux für Installation und Konvertierung durchgeführt werden. Nutzer von Windows oder MAC-Systemen müssen sich die Software herunterladen und installieren. Anschließend entfällt Schritt 1:

1. sudo apt-get install swftools ffmpeg
2. swfrender video.swf -X 500 -Y 500 -o out_file.png
3. ffmpeg -loop 1 -i white-back.png -i out_file-%d.png \
-filter_complex overlay=shortest=1 video.gif

Im ersten Schritt werden die beiden benötigten Tools SWFTOOLS und FFMPEG installiert. Anschließend werden aus der SWF-Datei, die ein Video enthält, einzelne Bilder (out_file-1.png, out_file-2.png, usw.) in der Größe 500x500 Pixel erstellt. Wenn die Einzelbilder einen transparenten Hintergrund haben, benötigt man für den dritten Schritt noch ein weißes Bild (white-back.png), ebenfalls in der Größe 500x500 Pixel. Dieses erstellt man in einem beliebigen Bildbearbeitungsprogramm und nutzt es im nächsten Schritt als weißen Hintergrund für die Animation. Im dritten Schritt wird nun mithilfe von FFMPEG, dem Hintergrundbild und den entsprechenden Einzelbildern ein animiertes GIF erstellt. In diesem Schritt kann statt eines animierten GIFs durch Ändern der Dateierweiterung auch ein Video erstellt werden. Dazu ersetzt man diesem Schritt einfach den Dateinamen "video.gif" durch "video.mp4".

Versuche mit unterschiedlichem Ausgangsmaterial haben gezeigt, dass dieser Weg nicht immer zu zufriedenstellenden Ergebnissen führt. So kam es bei unseren Versuchen gelegentlich vor, dass bei Rendern im zweiten Schritt die Bilder fehlerhaft erstellt wurden und somit das Gesamtergebnis negativ beeinflusst wurde. Deshalb haben wir noch einen zweiten Weg erprobt.

2. Abfilmen von Videosequenzen in SWF-Dateien

Abfilmen einer Flash-Animation
Abfilmen einer Flash-Animation

Eher unkonventionell, aber durchaus erfolgversprechend ist das schlichte Abfilmen der Animationen oder Videos. Dazu öffnet man die entsprechende SWF-Datei im Browser und lässt die Videosequenz einfach ablaufen, während eine Software vom Bildschirm aufzeichnet. Neben Camtasia 8 oder SimpleScreenRecorder, was bei uns zum Einsatz kam, finden sich beispielsweise im Bereich Video-Capturing auf netzwelt.de noch eine Menge weiterer (kostenloser) Alternativen. Es empfiehlt sich dabei, ein Browserfenster einmal auf die gewünschte Größe einzustellen und nach dem Laden jeder SWF-Datei mit dem Video-Capturing-Programm darin einen bestimmten Ausschnitt zu filmen. Am Besten in einer gängigen Videoauflösung. Anschließend kann das fertige Video noch geschnitten und ggf. in ein animiertes GIF umgewandelt werden. Der entsprechende Befehl für FFMPEG zur Konvertierung eines MP4-Videos in ein animiertes GIF lautet wie folgt:

ffmpeg -i video.mp4 video.gif

Einbindung in Webseiten

Die Einbindung der Videos oder Animationen in eine Webseite kann bei beiden Vorgehensweisen mit einfachen HMTL5-Mitteln per VIDEO- oder IMG-Element erfolgen.

Fazit

Beide im Beitrag vorgestellten Vorgehensweisen haben ihre Vor- und Nachteile, und decken auch nur den Fall ab, dass Videos oder kurze Animationen umgewandelt werden sollen.

Das erste Verfahren, bei dem Dateien konvertiert werden, kann in Stapelverarbeitungsprozesse integriert werden. Es eignet sich damit vor allem für die Verarbeitung großer Mengen von Dateien ähnlicher Art. Je nach Beschaffenheit der Ausgangsdateien können bei der Verarbeitung Fehler auftreten. Eine Nachkontrolle ist daher zu empfehlen.

Das zweite Verfahren, bei dem abgefilmt wird, ist zuverlässiger und lieferte im Test die besten Ergebnisse. Allerdings müssen alle Ausgangsdateien manuell geladen und abgefilmt werden. Hinzu kommt, dass die Videos unter Umständen nachbearbeitet bzw. beschnitten werden müssen.

Gepostet von: mschmidt
Kategorie: Kurzmeldung