Animiertes GIF

GIF-Animationen findet man heute in allen Formen und mit unterschiedlichen Zielsetzungen im Web. Die große Stärke dieses Formates liegt darin, dass es von nahezu allen Browsern dargestellt werden kann. Es kein Extra-Download eines aktuellen Plug-ins nötig, so wie beispielsweise bei Flash-Animationen. Auf der anderen Seite hat es den Nachteil, dass komplexere Animationen nicht möglich oder aus Gründen der Ladezeit nicht zumutbar sind.

Nachfolgend möchte ich anhand eines Beispieles zeigen, wie man mit dem Picture Publisher eine sehr häufig auftretende GIF-Animationsvariante erstellt: Ein Banner. Und so soll es aussehen:



Wir starten und gehen in das Menü für die Erstellung einer GIF-Animation. Wir erreichen es unter → Ansicht → GIF-Animation. Der nun erscheinende Animations-Assistent ist parallel zum Hauptprogramm geöffnet, kann also auch geöffnet bleiben, während man normal Bilder bearbeite, und besteht aus den folgenden drei Reitern:

• Allgemein: Hier stellt man die globalen Eigenschaften der Animation ein.
• Einzelbild: In diesem Reiter kann man ein paar Eigenschaften eines Einzelbildes festlegen.
• Übersicht: Dieser Reiter dient der Auswahl und der Sortierung der Einzelbilder.

Auf die einzelnen Befehle innerhalb der Reiter gehe ich weiter unten noch ein. Es ist nun schon der Begriff »Einzelbild« gefallen, dazu kurz zur Erläuterung: Eine GIF-Animation ist nichts anderes als eine Sammlung von Einzelbildern, die im Daumenkino-Stil nacheinander eingeblendet werden. Und an die Erstellung dieser Einzelbilder wollen wir uns jetzt machen ...

1) Zunächst legen wir eine neue Animation an (im Assistent wählen → Datei → Neu...) mit Bildgröße 468 mal 60 (Standardformat für ein »Full banner«) und 15 Einzelbilder. Wir aktivieren den Reiter »Übersicht« und sehen: Der Assistent hat automatisch Einzelbild 0 markiert, es ist schwarz sein und zugleich auch unser Startbild.

2) Wir bleiben im Reiter »Übersicht« und klicken dort auf Einzelbild 4. Nun erstellen wir eine neue Datei im Picture Publisher Hauptprogramm, ebenfalls mit der Größe 468 mal 60 und der Hintergrundfarbe Schwarz. Wir fertigen den Schriftzug »Dies ist eine« in gelber Schrift an und zentrieren ihn. Dann binden wir das Objekt ein → Objekt → Einbinden → Alle Objekte und wählen anschließend → Bearbeiten → Kopieren.

3) Wir klicken den Animations-Assistenten an um ihn aktiv zu machen und gehen dort in der Menüleiste auf → Bearbeiten → Einfügen. Wenn nun gefragt wird, welche Palette man verwenden möchten, dann klicken wir auf »Globale Palette«. Theoretisch kann man für jedes Einzelbild eine eigene Palette festlegen, aber das ist viel zu aufwendig ...

Das Bild mit dem Schriftzug sollte nun zu Einzelbild 4 der Animation geworden sein.

4) Nun markieren wir Bild 3 im Reiter »Übersicht« des Assistenten. Wir wechseln in das Hauptprogramm und machen im Bearbeiten-Menü den Befehl »Alle Objekte einbinden« wieder rückgängig. Somit haben wir wieder unseren Schriftzug als Objekt. Dieses verkleinern wir ein Stück, zentrieren es wieder, binden es ein, kopieren es und fügen es wieder im Assistenten ein, diesmal als Einzelbild 3.

Wir wiederholen nun Schritt 4 für die Einzelbilder 2 und 1. Also jeweils weiter verkleinern und in den Animationsassistent einbinden.

Das Zwischenergebnis kann man sich jederzeit über die Abspielen-Taste zeigen lassen (als verkleinerte Vorschau). So sollte es ungefähr aussehen:



Nun lassen wir unsere Schrift zerbröseln, dazu kopieren wir die große Schrift aus Einzelbild 4 in das Hauptprogramm, binden sie ein und lassen sie auch eingebunden. Nachfolgend in Kurzform die Einzelbild-Beschreibung:

Einzelbild 5: Effektfilter »Kristallisieren« mit Wert 1.
Einzelbild 6: Effektfilter »Kristallisieren« mit Wert 5.
Einzelbild 7: Effektfilter »Kristallisieren« mit Wert 10.
Einzelbild 8: Effektfilter »Kristallisieren« mit Wert 15.
Einzelbild 9: Effektfilter »Kristallisieren« mit Wert 30, Helligkeit »-50«.
Einzelbild 10: Dieses soll so bleiben wie es ist (schwarz).

Unser Zwischenergebnis:



Wir gehen auf Bild 14 und drücken den rechts abgebildeten Button. Dadurch haben wir ein zusätzliches Einzelbild 15 erzeugt.

Nun wechseln wir wieder in das Picture Publisher Hauptprogramm, färben den Hintergrund schwarz, erstellen eine rote Schrift »Gif-Animation« und zentrieren diese. Dann binden wir sie wieder ein, kopieren sie und fügen sie als Einzelbild 15 ein.

Einzelbild 14: Gaußsches Verwischen mit Wert »2 Fast« auf Schrift aus Einzelbild 15 anwenden (nicht vergessen: Schrift muss für Effektfilter eingebunden sein).
Einzelbild 13: Gaußsches Verwischen mit Wert »3 Fast« auf Schrift aus Einzelbild 15 anwenden.
Einzelbild 12: Gaußsches Verwischen mit Wert »5 Fast« auf Schrift aus Einzelbild 15 anwenden.
Einzelbild 11: Gaußsches Verwischen mit Wert »7 Fast« auf Schrift aus Einzelbild 15 anwenden.

Unser Zwischenergebnis:



Die Animation ist noch nicht fertig. Denn noch laufen die Bilder ohne Verzögerung nacheinander ab. Deshalb sorgen wir nun für etwas Feintuning:

Wir gehen in den Reiter »Allgemein« und klicken dort beim Menüpunkt »Generelle Verzögerung« auf »Einstellen« und wählen dort den Wert 10 (entspricht ca. einer Zehntelsekunde).

Dann markieren wir die Checkbox "Endlosschleife", damit die Animation unentwegt abäuft.

Wenn wir nun auf »Vorschau in realer Größe« klicken erhalten wir erstmalig auch eine akzeptable große Vorschau. Nun markieren wir Einzelbild 0, gehen in den Reiter »Einzelbild« und stellen dort den Verzögerungswert auf 200. Das Resultat: Die Animation bleibt in Einzelbild 0 ca. 2 Sekunden stehen.

Anschließend stellen wir die Verzögerung in Einzelbild 4 und 10 auf den Wert 100 und in Einzelbild 15 auf 200.

Die Animation ist fertig. Über die Einstellung »X-« bzw. »Y-Abstand« kann man übrigens die Einzelbilder verlagern. Aber Vorsicht: Dadurch verändert sich auch die globale Einstellung der Bildgröße.

Wir können nun die Animation abspeichern. Und so sieht das Endergebnis aus ...



Die Animationsfunktion des Picture Publisher 8 fällt in seiner Leistungsfähigkeit deutlich hinter den Konkurrenzprogrammen zurück. Denn es gibt keine vorgefertigten Animationseffekte und die erzeugten Dateigrößen (im Web eine wichtige Angelegenheit ...) sind immer deutlich größer als bei spezialisierten Animationsprogrammen.