«Ich möchte, dass ca. 3 Bilder hintereinander animiert dargestellt werden und zwar mit Indesign 5.» Gemeint war natürlich InDesign CS 5 (InDesign 7) – ein Hilferuf im Fachforum hilfdirselbst.ch (HDS).

Er wird nicht der letzte Hilferuf dieser Art gewesen sein. Manche der neuen, interaktiven InDesign-Funktionen bauen vor dem Eintritt in einfache Flash*-Produktionen erst einmal einige Hürden vor den Layoutern auf.

Aber sie sind zu meistern, wie Sie gleich sehen werden und wie die Diskussion, die sich auf HDS entspann, zeigt. Beherrschen Sie den Vorgang, müssen Sie für solche kleinen Aufgaben nicht mehr die Software wechseln, sondern können in Ihrer vertrauten InDesign-Umgebung bleiben.

Schritt 1: Planung der Show

Wie sieht die Reihenfolge der Bildauftritte aus? Wie lang soll sich jedes einzelne Bild zeigen? Sollen Übergänge sichtbar sein – und wenn ja, wie lang?

Wir wollen, dass jedes Bild 4 Sekunden gezeigt wird, mit einem anschliessenden Übergang von 2 Sekunden.

Da Übergänge sichtbar werden sollen (statt einer harten Abfolge der Bilder), benötigen wir die doppelte Bildrahmenzahl. Denn: Wir können einem einzelnen InDesign-Rahmen leider noch nicht sagen, «bleib 4 Sekunden stehen, dann blende innert 2 Sekunden aus». Fürs «Stehenbleiben» benötigen wir einen Rahmen, und fürs Ausblenden ebenfalls.

Um bei der geplanten Schleife, der automatischen Wiederholung der Show den Bruch zwischen Ende und Anfang zu überbrücken, schummeln wir: Wir teilen die Zeigedauer des Startbildes auf. Die erste Hälfte der 4 Sekunden lassen am Anfang ablaufen, die anderen 2 Sekunden folgen am Schluss. Nach einem ersten Durchgang der Schleife fällt das niemandem mehr auf.

Schritt 2: Format und Dokument

Jetzt entscheiden Sie sich für Breite und Höhe Ihres Banners oder Ihrer Show. In beiden Fällen ist das Mass der Dinge das Pixel. Also Zielmedium = «Web»!

Entscheidender Trick: Definieren Sie eine Dokumenthöhe, in der alle Bildelemente der Show untereinander Platz haben. Das wird die Arbeit sehr vereinfachen. Erst am Schluss, wenn alles funktioniert, schieben wir die Elemente zu einem kompakten Stapel zusammen.

Wie hoch muss das Dokument sein? Schon eine Mini-Show mit 3 Bildern, die in einer fortwährenden Schleife und mit Übergängen wiederholt werden soll, besitzt 7 Elemente. Beträgt die Bannerhöhe 100 px, sollte das Dokument also mindestens 700 px hoch sein.

Schritt 3: Platzieren der Bilder

Und los geht’s mit unserer 3-Bilder-Show.

Wenn wir die Bilder in der Reihenfolge ihres Auftritts als «1», «2» und «3» adressieren, ergibt sich diese Stapelung:

Bild 1:  2 sec zeigen
Bild 1:  2 sec ausblenden
Bild 2:  4 sec zeigen
Bild 2:  2 sec ausblenden
Bild 3:  4 sec zeigen
Bild 3:  2 sec ausblenden
Bild 1:  2 sec zeigen

Da InDesign Objekte in der Reihenfolge stapelt, in der sie erstellt werden, beginnen wir beim Erstellen der Rahmen mit dem zuunterst liegenden Bild und arbeiten uns in dem streifenartigen Dokument schrittweise nach oben.

Schritt 4: Benennen der Seitenelemente

Nutzen Sie ab jetzt intensiv das Bedienfeld Ebenen. Seit CS 5 können Sie jede Ebene aufklappen, die Stapelung aller Elemente einsehen und umbenennen (Doppelklick auf die Bezeichnung; ist das Objekt schon hellblau markiert, genügt ein Klick). Vorschlag für Benennungen:

1 – zeigen halb 1
1 – aus
2 – zeigen
2 – aus
3 – zeigen
3 – aus
1 – zeigen halb 2

Schritt 5: Animieren

Nun öffnen wir via Fenster > Interaktiv das Bedienfeld Animation. Spätestens jetzt werden Sie sich über das Streifendokument freuen: Sowie Sie im Layout ein Bild markieren, blendet Animation die zugehörigen Einstellungen ein:

Sie dürfen später gern experimentieren: Für den Start arbeiten wir einfach. Das heisst:

• Bei Zeige-Elemente wählen Sie die Vorgabe «Erscheinen», die Dauer «4», die Deckkraft «Ohne» und «Nach der Animation ausblenden».
• Bei Ausblend-Elementen wählen Sie keine Vorgabe, sondern die lediglich die Deckkraft «Ausblenden» und anschliessend die Dauer «2».
• Das oberste Element, wir sagten es, weicht von den anderen Zeige-Elementen nur in der Dauer ab: die Hälfte, also «2».
• Dito das letzte, unterste Element: ebenfalls «2». Ausserdem hat dieses unterste Element noch eine Besonderheit: Es ist das einzige, bei dem wir die Option «Nach der Animation ausblenden» nicht anwählen. Es bleibt immer sichtbar!

Der erste Test: Klicken Sie auf den Abspielknpf ganz links unten in Animation. Nach kurzer Wartezeit sollten in der Vorschau alle Bilder sichtbar sein und sich von oben nach unten ausblenden. Das letzte, unterste, bleibt stehen.

Schritt 6: Wiederholschleife einrichten

Und schon sind wir beim letzten, entscheidenden Schritt zum Einrichten der Animation angelangt: Wir sorgen für die Endlosschleife. Das gelingt bei dieser Aufgabe nur über das Bedienfeld Zeitpunkt. (Animation besitzt diese Option zwar auch, aber wir wollen ja nicht jedes Element für sich in eine eigene Schleife schicken, sondern die gesamte Abfolge sich wiederholen lassen, als Gruppe!) Sie öffnen das Bedienfeld ebenfalls über Fenster > Interaktiv.

Markieren Sie in Zeitpunkt alle Elemente gemeinsam, z.B. mit der Shift- oder Umschalt-Taste. Drücken Sie rechts unten auf den Knopf «Gemeinsam abspielen». Wenn Sie richtig gearbeitet haben, zeigt sich links neben den 7 Elementnamen eine verbindende Klammer:

Klicken Sie erneut auf den Abspielknopf. Alle Animationen starten nun parallel und gleichzeitig: «Gemeinsam abspielen» heisst «Gemeinsam abspielen»! Das Ausblenden aller Ausblend-Elemente beginnt synchron, nach 2 Sekunden veschwindet das oberste Bild, nach weiteren 2 Sekunden auch die beiden «langen» Zeigebilder.

Was InDesign also noch von Ihnen braucht, ist eine Ansage, wo ein «Stop ’n Go» eingebaut werden soll. Aktivieren Sie dazu in Zeitpunkt die Ausblend-Elemente nunmehr einzeln und geben als «Verzögerung» die «Dauer» ein, die das vorhergehende Element in Animation bekam. Ich schreibe Ihnen die Werte noch einmal fett hinter die Elemente, in Klammern:

1 – zeigen halb
1 – aus (2 Sek)
2 – zeigen
2 – aus (4 Sek)
3 – zeigen
3 – aus (4 Sek)
1 – zeigen halb

Logisch? Bis hierhin ja. Die «Verzögerung» hält das ausgewählte Element so lange an, bis das vorauslaufende abgearbeitet ist.

Noch einmal Test?

Anschliessend markieren Sie in Zeitpunkt wie schon einmal wieder alle Elemente gemeinsam und klicken rechts oben auf «Schleife». Sichern.

Schritt 7: Stapeln der Bilder

Nach dem letzten Sichern sichern Sie unter neuem Namen in ein finales Dokument. Alles auswählen. Mit Hilfe des Bedienfelds Ausrichten die Objektmitten an der Seitenmitte ausrichten. Seitenformat verändern: via Datei > Dokument einrichten. Sichern.

Noch einmal ein Probetest. Dann Datei > Exportieren > Flash Player (SWF) mit der Option «SWF nach Export anzeigen.
Das war’s! Wer Ihre Website baut, kann Ihre Show-SWF, Ihre Banner-SWF nun einbinden.

Eine einfachstes Beispielergebnis sehen Sie hier; die zugehörigen InDesign-Dateien laden Sie hier herunter.

Fragen? Nur zu!

* Flash: Das Ausgabeformat, für das viele der neuen interaktiven InDesign-Funktionen erst einmal entwickelt worden sind.