Kontakt aufnehmen

Flash: Animationen von Objekten erzeugen

Um einem Film ein gewisses visuelles Leben einzuhauchen sind animierte Bildsequenzen nahezu unerlässlich. Flash unterscheidet dabei im Wesentlichen drei Verfahren zum Erstellen von Animationen.

Einzelbildanimationen

Wie der Name bereits verrät, muss zum Erstellen einer Animation mithilfe dieses Verfahrens jedes Bild einzeln erstellt bzw. bearbeitet werden. Dazu muss jedes Einzelbild in ein Schlüsselbild umgewandelt werden, so dass dessen Objekte separat auf der Bühne schrittweise bearbeitet werden können. Dieses Verfahren eignet sich vor allem für aufwendigere Animationen, bei denen es erforderlich ist, einzelne Fragmente eines Objektes zu verändern (z.B. zu verformen). In diesem Zusammenhang ist jedoch zu erwähnen, dass derartige Animationen verhältnismäßig speicherintensiv sind, da Flash für jedes Bild die vollständigen Informationen zu deren Konstruktion speichern und beim Abspielen des Films in den Flash player übertragen muss.

Tweens

Möchte man hingegen eher einfachere Animationen erstellen, um beispielsweise die Größe oder Position einer Symbolinstanz zu verändern, kann man auf ein sehr komfortables Animationsverfahren in Flash zurückgreifen: das Tweening. Hier muss man lediglich die gewünschten Zustände des Objekts für das Anfangs - und das Endbild definieren. Die für die Animation erforderlichen Zwischenbilder berechnet Flash dann voll automatisch, so dass eine scheinbare Animation entsteht.
Das Tweening - Verfahren nimmt im Vergleich zur Einzelbildanimation deutlich weniger Speicherplatz für sich in Anspruch, da Flash nur die Informationen für die Zustandsänderungen des Objekts zwischen den Einzelbildern der Animation für deren Berechnung speichern muss.
Beim Tweening unterscheidet man in Flash wiederum zwischen zwei Verfahren: das Motion Tweening sowie das Form Tweening.

Motion Tweens erstellen

Motion Tweens können generell nur für gruppierte Objekte, Instanzen und Texte erstellt werden. Das Erzeugen eines solchen Tweens ist verhältnismäßig trivial, da lediglich die Eigenschaften des zu tweenenden Objekts wie etwa Position oder Größe für das Ausgangs - und das Endbild (jeweils Schlüsselbilder) definiert werden müssen.

Motion Tween
Darstellung: Motion Tween

Soll beispielsweise eine Instanz eines Symbols so getweent werden, dass sie eine lineare Bewegung ausführt und dabei ausgeblendet wird, sind die folgenden Schritte erforderlich:

1. Instanz in Schlüsselbild auf Bühne platzieren und gewünschten Deckkrafteffekt (Alpha) definieren

2. Neues Schlüsselbild in Zeitleiste der Instanz definieren, Instanz neu platzieren und Alpha wie gewünscht verändern

3. Erstes Schlüsselbild (Anfangsbild) auswählen und anschließend im Eigenschaftsinspektor bei Tween Bewegung selektieren

Gegebenenfalls können auch noch Einstellungen für Drehung und Beschleunigung/Bremsung des Objekts sowie Sound des Objekttweenings vorgenommen werden. Erscheint in der Zeitleiste ein Pfeil auf blauem Hintergrund (wie oben gezeigt), hat Flash die Zwischenbilder der Animation erfolgreich berechnen können. Andernfalls erscheint anstelle des Pfeils eine gestrichelte Linie, was heißt, dass die Schlüsselbilder fehlerhaft und noch einmal zu überprüfen sind.
Darüber hinaus ist es auch möglich den Farbton von Instanzen, gruppierten Objekten und Texten zu tweenen. Zu beachten bleibt, dass Gruppen und Texte zuvor in Symbole umgewandelt werden müssen.

Motion Tween an Pfaden ausrichten

Ein Motion Tweening muss nicht zwangsläufig linear, sondern kann auch auf beliebig definierbaren Wegen (Pfaden) ausgeführt werden. Dafür ist es erforderlich, den (zuvor erstellten) Tween mit einer so genannten Pfadebene (Führungspfad) zu verknüpfen. Flash berechnet dann ebenfalls selbständig die Bewegung. So erstellt man einen pfadorientierten Motion Tween:

1. Bewegung zunächst wie im Kapitel "Motion Tweens erstellen" gezeigt definieren

2. In den Eigenschaften des Tweens (Anfangsschlüsselbild) die Option "An Pfad ausrichten" wählen.

3. Der Ebene mit dem Tween in der Zeitleiste einen Pfad zuweisen, indem man im Menü Einfügen > Pfad auswählt oder einfach das zweite kleine Symbol in der Zeitleiste ("Pfad Ebene Einfügen") anklickt.

4. In der oberhalb der Tweenebene eingefügten Pfadebene mit einem geeigneten Zeichenwerkzeug (z.B. Stift oder Pinsel) den Pfad zeichnen.

5. Zum ersten Schlüsselbild des Tweens wechseln und den Mittelpunkt des zu tweenenden Objekts auf die gewünschte Startposition des Pfades verschieben (Objekt springt auf Pfad).

6. Analog zu 5. die Endposition des Objekt im Endschlüsselbild des Tweens definieren.

Die so erzeugte pfadgebundene Bewegung kann noch zusätzlich mit Hilfe der Eigenschaft "Ausrichten" beeinflusst werden.

Form Tweens erstellen (Morphing)

Form Tweens können nur auf Formen angewandt werden, so dass Instanzen, Texte, gruppierte Objekte, usw. zuvor mittels Teilung (Shortcut Strg+B oder im Menü Modifizieren > Teilen) in eine solche überführt werden müssen. Diese Morphingeffekte lassen sich ebenfalls sehr leicht erzielen, da man lediglich die Formen des Anfangs - sowie Endzustands in entsprechenden Schlüsselbildern definieren muss.

Form-Tween
Darstellung: Form-Tween

Folgende Vorgehensweise kann zur Erzeugung eines Formtweens angewandt werden:

1. Form im Anfangsschlüsselbild auf Bühne erstellen

2. Neues Schlüsselbild in einem beliebigen Bild der Instanz definieren und darin die gewünschte Endform erstellen

3. Anfangsschlüsselbild aus 1. auswählen und im Eigenschaftsinspektor bei Tween die Option Form auswählen

Neben den bereits oben erwähnten Eigenschaften des Motion Tweens kann man für den Form Tween noch einen anderen Effekt auf die Bewegung anwenden (Voreinstellung verteilt oder winkelförmig). Eine gestrichelte Linie auf grünem Hintergrund anstelle eines Pfeils zwischen den Schlüsselbildern des Form Tweens weist darauf hin, dass die Schlüsselbilder fehlerhaft sind und Flash die Bewegung nicht erzeugen konnte. In diesem Falle sollten die Schlüsselbilder überprüft werden.

Form Tweens mithilfe der Formmarken beeinflussen

Die Formveränderungen eines Form Tweens haben oft die Anmutung einer eher zufälligen und oft ungewollten Verformung. In Flash gibt es jedoch eine Möglichkeit, dieses Morphing zu steuern, indem man so genannte Formmarken einfügt. Stellen, welche durch Formmarken markiert wurden, werden während des Tweens nicht verformt. Darüber hinaus legen deren Verschiebungen vom Anfangs - hin zum Endbild Richtungen fest, welchen während des Morphings gefolgt werden soll. Diese Formmarken können eingefügt werden, indem man im Menü Modifizieren > Form > Formmarke hinzufügen (Shortcut Strg+Umschalt+H) auswählt. Sie werden von Flash automatisch alphabetisch durchnummeriert, so dass sich eine Maximalanzahl von 26 Stück (a bis z) ergibt.
Folgende Schritte sind erforderlich, um Formmarken festzulegen:

1. Form Tween wie in Kapitel "Form Tweens erstellen (Morphing)" beschrieben erzeugen

2. Im Anfangsschlüsselbild des Tweens die erforderliche Anzahl von Formmarken einfügen (Shortcut Strg+Umschalt+H) und an gewünschte Positionen verschieben

3. Im Endschlüsselbild des Tweens die Formmarken auf die jeweilig sinnvolle Endposition verschieben

Das Arbeiten mit Formmarken erfordert etwas Übung. Man sollte stets darauf achten die anfängliche Reihenfolge der Formmarken im ersten Schlüsselbild des Tweens auch im Endschlüsselbild beizubehalten, um ein gutes Ergebnis erzielen zu können.

Gescriptete Animationen

Die oben genannten Methoden zum Animieren von Objekten schränken den Anwender natürlich dahingehend ein, als dass deren Verlauf während des Erstellens des Filmprojekts festgelegt und dann monoton ausgeführt wird. Dies wird gerade dann nicht den Ansprüchen an den Film gerecht, wenn er eher abwechslungsreiche Animation beinhalten soll, bei denen sich die Objekte beispielsweise relativ zueinander bewegen sollen.
Hierfür stellt Flash jedoch eine weitaus flexiblere Methode zur Verfügung, nämlich das Manipulieren von beispielsweise Instanzeigenschaften (Effekten) mittels der programmeigenen Scriptsprache ActionScript . Auf diese Weise lassen sich abwechslungsreiche, auch interaktive Animationen erstellen. Ohne den folgenden Kapiteln etwas vorwegnehmen zu wollen, sei hier ein simples ActionScript gezeigt, welches in einer Schleife die Deckkraft (Alpha) und die Position einer Symbolinstanz namens Kreis iterativ verändert.

for(i = 0; i < 10; i++)
{
 with(_root.Kreis)
 {
 _x += 5;
 _y += 15;
 _alpha -= 5;
 }
        
}

In einer Schleife, deren Unteranweisungen zehnmal ausgeführt werden, wird die Symbolinstanz namens Kreis mithilfe der with-Anweisung angesprochen. In deren Anweisungsblock werden wiederum einige ihrer Eigenschaften manipuliert. Die erste Anweisung erhöht deren Position auf der imaginären x-Achse der Bühne jeweils um 5 Pixel, während die zweite Anweisung die Position auf der y-Achse um jeweils 15 Pixel erhöht. Auf diese Weise findet eine, wenn auch während des Films erst einmal nicht wahrnehmbare Verschiebung (da ohne Verzögerung zwischen den einzelnen Schleifendurchläufen) statt. Währenddessen wird aufgrund der dritten Anweisung dieses Blocks auch noch die Deckkraft der Instanz schrittweise um 5 Prozent verringert. Weitere Erläuterungen zum Verständnis von ActionScript finden sich im entsprechenden Kapitel wieder.

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Weiterlesen: ⯈ Flashfilme in HTML-Dokumente einbinden

Über uns

Stefan Wienströer

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project

Cookie-Einstellungen

Helfen Sie dabei, uns noch besser zu machen. Wir nutzen Cookies und ähnliche Technologien, um die Website auf Ihre Bedürfnisse anzupassen. Zur Datenschutzerklärung

Auswahl speichern