Animationen mit Flash 5

Animation: Heft 02/2001 (S. 136) 7 Seiten

Eine realistisch hüpfende Kugel animieren

Flash bietet zwar keine direkten Funktionen an, um dreidimensionale Objekte zu erstellen - mit einigen wenigen Kniffen können Sie dieses Manko aber umgehen. In diesem Workshop wollen wir unter anderem eine dreidimensionale Kugel durch das Bild hüpfen lassen

Als Erstes wird für den Workshop ein neues Dokument benötigt, das Sie am schnellsten mit der Tastenkombination Strg+N erstellen. Das Standardmaß wird anschließend mit der Funktion "Modifizieren/Film" angepasst. Stellen Sie in dem Dialogfeld ein Format von 468 Pixeln Breite und einer Höhe von 120 Pixeln ein. Als Hintergrundfarbe wird der Rot-Ton mit dem hexadezimalen Wert #CC, 00, 00 verwendet. Die Bildrate beträgt 15 Bilder pro Sekunde.

Eine dreidimensionale Kugel erstellen

Als Vorbereitung für die Animation soll nun eine dreidimensionale Kugel erstellt werden. Um dreidimensionale Wirkungen zu erzielen, müssen Sie sich immer etwas einfallen lassen, da Flash an und für sich keine 3-D-Effekte anbietet. Durch den geschickten Einsatz von Farben und Füllungen können Sie aber eine räumliche Wirkung vortäuschen. Gehen Sie dazu in den folgenden Arbeitsschritten vor: Erstellen Sie mit dem Ellipsenwerkzeug einen Kreis, die Füllfarbe ist dabei erst einmal egal. Eine Kontur erhält der Kreis nicht. Denken Sie daran, beim Aufziehen des Kreises die Umschalt-Taste gedrückt zu halten, damit keine Ellipse, sondern ein Kreis entsteht. Ziehen Sie den Kreis dabei in einer Größe von 60 Pixeln auf. Sie können die Größe im Info-Bedienfeld ablesen.

Die Plastizität wird über eine kreisförmige Verlaufsfüllung erreicht. Dafür finden Sie in der Füllungspalette wieder einige verschiedenfarbige Muster. Verwenden Sie die blaue Variante. Rufen Sie nun den Farbeimer zum Füllen des Kreises auf. Klicken Sie im Kreis auf die Stelle, an der Sie die blaue Farbe des radialen Verlaufs unterbringen wollen - in dem Beispiel im oberen, linken Bereich.

Natürlicher "Lichteinfall"

Objekte wirken am natürlichsten, wenn das Licht von oben links einfällt. Deshalb ist es sinnvoll, den imaginären Lichtreflex - der helle Farbton - oben links auf der "Kugel" zu platzieren. Die "Kugel" sieht nach dem Füllen schon leicht plastisch aus, dafür sorgt der scheinbare Schatten auf der Oberfläche, der durch das Schwarz im Verlauf entsteht. Das Ergebnis ist zwar schon akzeptabel - so richtig dreidimensional sieht es aber noch nicht aus. Das liegt daran, dass es auch dort noch Licht gibt, wo Schatten ist. Von Licht ist aber in dem Beispiel noch nichts zu sehen.

Das können Sie ändern, indem der Verlauf entsprechend angepasst wird. Öffnen Sie dazu das Füllung-Bedienfeld. Klicken Sie auf das blaue Farbfeld und ziehen Sie das Farbfeld mit gedrückter linker Maustaste nach rechts. Die genaue Position ist dabei nicht so wichtig. Sie können die ungefähre Position in der Abbildung sehen. Damit wird ein größerer Bereich blau getönt, bevor er in den schwarzen Farbton übergeht. Um nun den Lichtreflex einzufügen, klicken Sie links außen unter den Vorschaubalken, um dort einen neuen Farbmarker einzufügen. Er erhält automatisch die Farbe, die sich an der angeklickten Stelle im Vorschaubalken befand.

Stellen Sie für den neuen Farbmarker Weiß ein. Wählen Sie den neuen Farbton aus der Palette aus, die Sie mit einem Klick auf das Farbfeld rechts neben dem Vorschaubild öffnen. Nun kann der neue Verlauf ausprobiert werden. Klicken Sie also mit dem Fülleimer wieder auf die Stelle, wo der Lichtreflex positioniert werden soll - oben links im Kreis.

Falls der Verlauf noch nicht perfekt passt, korrigieren Sie einfach die Einstellungen und weisen Sie den Verlauf erneut zu. Die Farbe der Kugel können Sie leicht ändern, indem Sie die mittlere Farbe anpassen. Wählen Sie beispielsweise den Blau-Ton mit dem Wert #33, 99, FF. Das dazugehörende Ergebnis sehen Sie in der Abbildung. Es sieht schön plastisch aus. Und das eigentlich mit recht simplen Mitteln und sehr wenigen Arbeitsschritten.

Probieren Sie doch einmal unterschiedliche Füllpositionen aus. So könnten Sie den Lichtreflex beispielsweise direkt an die Außenkante der Kugel setzen, das sieht auch sehr elegant aus. Die Oberfläche der Kugel können Sie durch den Abstand des weißen zum blauen Farbfeld ändern. Bei "metallenen" Kugeln ist der Abstand sehr klein, bei rauen Oberflächen größer. Nach diesem Prozedere ist es ein Leichtes, andersfarbige Kugeln zu erzeugen.

Einen weichen Schatten anbringen

Im nächsten Schritt soll ein weicher Schatten zu den Kugeln hinzugefügt werden, um den plastischen Effekt zu perfektionieren. Dadurch erhält die Kugel nämlich Tiefe. Es soll erreicht werden, dass es so scheint, als ob die Kugel über dem Untergrund schweben würde. Um dies zu erreichen, markieren Sie die Kugeln und erstellen Sie eine Kopie, die neben dem Original positioniert wird. Achten Sie darauf, dass ausschließlich das Duplikat markiert ist und füllen Sie es mit Schwarz. Rufen Sie die Funktion "Modifizieren/Transformieren/Skalieren" auf. Danach sehen Sie acht Markierungspunkte an den Ecken und in der Mitte der Seiten. Die mittleren Markierungspunkte werden zum Dehnen verwendet. Klicken Sie deshalb den mittleren Markierungspunkt oben an und ziehen Sie den Markierungspunkt mit gedrückter linker Maustaste so weit nach unten, dass aus den Kreisen ganz flache Ellipsen werden. Schieben Sie den Schatten unter die Kugeln. Das Ergebnis sieht gleich noch plastischer aus!

Damit der Schatten noch realistischer erscheint, wird die Ellipse noch mit der Funktion "Modifizieren/Form/Ecken abrunden" weichgezeichnet. Dazu wurden die abgebildeten Werte verwendet. Beachten Sie, dass dort die Verkleinern-Option vorgegeben wurde, damit die Schatten nicht größer werden als die Kreise. Das war es schon. Die realistische Kugel ist fertig. Nun soll sie zum Leben erweckt werden.

Eine Kugel hüpft durch das Bild

Diese dreidimensionale Kugel soll nun durch das Bild hüpfen. Wir benötigen zusätzlich ein getrenntes Symbol für die Kugel und eines für den Schatten, da beide getrennt voneinander animiert werden sollen. Konvertieren Sie dazu die Kugel in ein Symbol und die Schattenelemente in ein weiteres. Denken Sie daran, den weich auslaufenden Schatten mit einem Markierungsrahmen auszuwählen, um alle Objekte der Weichzeichnung zu erwischen. Am schnellsten klappt es, wenn Sie zum Erzeugen der Symbole die F8-Taste verwenden. Aktivieren Sie bei der Umwandlung die Grafik-Option.

Schieben Sie anschließend die Elemente so weit nach links, dass sie gerade nicht mehr auf der Bühne erscheinen. Die Kugel soll nämlich nachher in das Bild hüpfen.

Vorbereitungen zur Bewegung der Kugel

Da Kugel und Schatten in der folgenden Animation getrennt voneinander bewegt werden sollen, müssen sie noch auf unterschiedlichen Ebenen untergebracht werden. Erstellen Sie mit einem Klick auf das Plussymbol im Ebenenfenster eine neue Ebene, die über der bisherigen angeordnet werden sollte. Markieren Sie die Kugel-Instanz und rufen Sie aus dem Kontextmenü der rechten Maustaste die Funktion Ausschneiden auf. Markieren Sie dann die gerade neu erstellte Ebene. Verwenden Sie dort aus dem Kontextmenü der rechten Maustaste die Funktion "An Position einfügen". Damit platziert Flash das ausgeschnittene Objekt auf der neuen Ebene genau an der ursprünglichen Stelle.

Nun geht es an die Animationsarbeit. Zunächst werden einige neue Schlüsselbilder benötigt. Und zwar im Bild 100. Um es so einfach wie möglich zu machen, markieren Sie mit gedrückter Umschalt-Taste beide Ebenen im Bild 100. Sie können nämlich dieselbe Aktion auch für mehrere Filmbilder auf einmal durchführen. Rufen Sie dann aus dem Kontextmenü der rechten Maustaste die Funktion "Schlüsselbild einfügen" auf. Flash fügt das neue Schlüsselbild dann für beide Ebenen ein. Auch beim Erstellen eines Bewegungs-Tweens können Sie mehrere Ebenen auf einmal bearbeiten. Markieren Sie einfach mit gedrückter Umschalt-Taste die beiden letzten Schlüsselbilder dieser Ebenen, wechseln Sie zum Bild 1 und markieren Sie dort - ebenfalls mit gedrückter Umschalt-Taste - die beiden Schlüsselbilder. Um für diesen markierten Bereich jeweils Bewegungs-Tweens zu erstellen, rufen Sie aus dem Kontextmenü die gleichnamige Funktion auf.

Sinnvolle vorbereitende Arbeiten

Es ist sinnvoll, die Erstellung der Schlüsselbilder zuerst vorzunehmen - ohne dass es irgendwelche Veränderungen im Bild gibt. Sie können nachher noch immer zum entsprechenden Filmbild wechseln, um die Animation einzugeben. Falls irgendetwas "schief geht", haben Sie mit diesem Verfahren deutlich weniger Arbeit, als wenn bereits alle Veränderungen fertig gestellt wären.

Einen Bewegungspfad zeichnen

Nun wird eine interessante Bewegungsart von Flash benötigt: Der Bewegungspfad. Objekte können sich nämlich nicht nur geradlinig durch das Bild bewegen. Sie können auch willkürliche Wege durch das Bild nehmen. Dies soll genutzt werden, um die Kugel hüpfen zu lassen. Platzieren Sie zur besseren Orientierung eine Hilfslinie, die den "Boden" kennzeichnen soll. Dazu müssen Sie zunächst mit der Funktion "Ansicht/Lineale" das horizontale und vertikale Lineal am Rand des Arbeitsbereichs einblenden. Die horizontale Hilfslinie sollte bei ungefähr 100 Pixeln positioniert werden. Sie kann einfach aus dem horizontalen Lineal herausgezogen werden. Achten Sie darauf, dass die Ebene der Kugel markiert ist. In unserem Beispiel ist dies die oberste Ebene.

Klicken Sie auf das rechte der beiden Symbole links in der Fußzeile der Zeitleiste. Damit erstellen Sie eine so genannte Führungsebene. Sie wird automatisch mit der darunter liegenden Ebene gekoppelt - das erkennen Sie an der Einrückung. Beachten Sie auch das neue Symbol der Führungsebene. Sie können übrigens auch mehrere Ebenen mit der Führungsebene koppeln. Ziehen Sie die betreffenden Ebenen einfach per Drag & Drop unter die Führungsebene, so dass sie ebenfalls eingerückt erscheinen. Alle eingerückten Ebenen werden vom Bewegungspfad beeinflusst.

Zeichenhilfen platzieren

Wenn Sie auch für die Breite eine Orientierung beim Zeichnen haben wollen, können Sie auch noch einige vertikale Hilfslinien platzieren, deren Abstand nach rechts immer geringer wird.

Nun benötigen Sie das Freihandwerkzeug aus der Werkzeugleiste, das Sie auch mit der Y-Taste aufrufen können. Damit können Sie freie Linienverläufe zeichnen. Stellen Sie im Optionen-Menü der Werkzeugleiste "Glätten" ein, damit die freihändig gezeichneten Linien nicht "krickelig" aussehen. Nach dem Zeichnen korrigiert Flash dann den Linienverlauf automatisch. Führungspfade dürfen nur mit den folgenden Werkzeugen gezeichnet werden: Linien-, Rechteck-, Kreis-, Freihand- und Pinselwerkzeug. Das praktische Stiftwerkzeug lässt sich dazu leider nicht verwenden.

Die Hilfslinien sollten übrigens zunächst nicht magnetisiert werden, sie dienen nur zur Orientierung beim Zeichnen. Wären sie magnetisiert, ergäben sich unglückliche Ergebnisse, da die Linie beim Annähern an die Hilfslinie anschnappt. Achten Sie also darauf, dass die Funktion "An Hilfslinien ausrichten" im Menü unter "Ansicht/Hilfslinien" deaktiviert ist. Außerdem sollten Sie für eine gute Beurteilung keine allzu dicke Stiftstärke einstellen, eine Breite von einem Pixel reicht aus.

Nun können Sie mit dem Malen beginnen. Achten Sie darauf, dass dabei die Führungsebene markiert ist. Wenn Sie auf die Bühne wechseln, sehen Sie ein Bleistift-Mauszeigersymbol. Klicken Sie ungefähr in Höhe der Kugelmitte auf den Rand des Dokuments und halten Sie die linke Maustaste gedrückt. Zeichnen Sie mit gedrückter Maustaste eine Rundung bis zur ersten vertikalen Hilfslinie. Sie haben keine ruhige Hand zum Zeichnen oder noch nicht so viel Übung beim Freihandzeichnen mit der Maus? Zugegeben: Das ist nicht ganz einfach. Macht aber nichts, da Flash nach dem Loslassen der Maustaste die Rundung wegen der eingeschalteten Glätten-Option korrigiert. Sie brauchen die Gesamtkurve nicht in einem Stück zu zeichnen, da Sie ja auf einer Ebene arbeiten. Flash "addiert" die Linien automatisch. So kommt nun das zweite Teilstück an die Reihe. Die Kurve wird etwas flacher und verläuft bis zur nächsten vertikalen Hilfslinie. Dass die Kurvenform nicht so ganz geglückt ist, macht nichts, sie wird später noch korrigiert. So geht es nun Stück für Stück weiter, bis die immer flacher werdenden Kurvenstücke alle fertig sind. In der Abbildung haben Sie eine Orientierung, wie das Ergebnis beispielsweise aussehen könnte. Ganz exakt kommt es auf die Form noch nicht an, da sie noch korrigiert wird.

Wenn Sie die Funktion "Bearbeiten/Einstellungen" aufrufen, können Sie übrigens auf der Registerkarte Bearbeitung einstellen, wie die Kurven geglättet werden sollen. Mit der standardmäßig vorgegebenen Normal-Einstellung erzielen Sie aber meist ordentliche Ergebnisse.

Kurvenverläufe korrigieren

Nun, da die Form im Groben fertig ist, kann es an die Feinjustierung gehen. Die Kurvenverläufe sollen jetzt angeglichen und etwaige "Ecken und Kanten" entfernt werden. Dazu haben Sie verschiedene Möglichkeiten, die wir Ihnen nun in den folgenden Arbeitsschritten vorstellen wollen. Rufen Sie das Pfeilwerkzeug auf. Wechseln Sie an die erste Stelle, an der eine Kurvenform zu sehen ist, die korrigiert werden soll. Achten Sie darauf, dass Sie neben dem Mauszeiger ein Kurvensymbol sehen. Verziehen Sie die Form mit gedrückter Maustaste. Währenddessen wird eine Vorschaulinie angezeigt. Korrigieren Sie so Stück für Stück die Kurvenform. Die Spitzen können Sie auch an die Hilfslinie ziehen. Dazu sollten Sie jetzt die Hilfslinien mit der Tastenkombination Strg-Umschalt-Ü magnetisieren. Damit Sie die Hilfslinien nicht versehentlich verschieben, sollten Sie zusätzlich die Tastenkombination Strg-Alt-Ü verwenden, um sie zu sperren. Beachten Sie, dass Sie beim Verschieben der Spitzen das Eckensymbol sehen. Um die Arbeit präzise durchführen zu können, sollten Sie die Darstellungsgröße auf 200 Prozent erhöhen.

Alternativ zum Pfeilwerkzeug können Sie auch das Unterauswahl-Werkzeug verwenden und damit die verschiedenen Knotenpunkte der Kurve verändern. Auch dabei sollten Sie aber nah an die Form heranzoomen, sonst sind die Knotenpunkte schlecht zu erkennen. Ziehen Sie mit diesem Werkzeug den Anfangsknotenpunkt der gezeichneten Linie etwas nach links aus dem Bild heraus, etwa so, wie abgebildet. Klicken Sie dazu den ersten Knotenpunkt an und ziehen Sie ihn mit gedrückter Maustaste nach links. Ist die gezeigte Position erreicht, lassen Sie die Maustaste wieder los. Abschließend sollten Sie in etwa den gezeigten Kurvenverlauf sehen. Ganz perfekt müssen die Kurven nicht sein - schließlich hüpft ein Ball ja auch nicht mathematisch exakt ...

Die Kugel mit dem Pfad verknüpfen

Nun sind alle Vorbereitungen getroffen, damit die Kugel dem Pfad folgen kann. Momentan steht unsere 3-D-Kugel ja die gesamte Zeit über auf derselben Stelle am linken Bildrand. Schieben Sie zuvor aber mit dem Pfeilwerkzeug den gesamten Pfad nach oben. Wir haben dazu die Pfeiltasten verwendet und den Pfad um 29 Pixel nach oben verschoben. Der Pfad wurde während der Konstruktionsphase am "Boden" platziert, so war die Bearbeitung leichter.

Wechseln Sie zu dem Bild, bei dem die Pfadanimation beginnen soll, falls dieses nicht bereits markiert ist. Verschieben Sie die Kugel an den Beginn des Pfads. Sie erkennen, dass sich der Mittelpunkt automatisch an den Pfad anpasst. Wechseln Sie zum Ende der Animation. Im Bild 75 soll nämlich die Pfadanimation abgeschlossen sein. Verziehen Sie das Kugel-Symbol bis an das Ende des Pfads, so dass der Mittelpunkt des Symbols auf dem letzten Knotenpunkt des Pfads platziert wird. Wenn Sie das Symbol in der Mitte anklicken, bevor Sie es verschieben, sehen Sie übrigens einen Kreis um den Mittelpunkt des Symbols. So wird das Positionieren etwas leichter. Dabei muss aber im Menü Ansicht die Ausrichten-Funktion aktiviert sein. Wenn Sie die Maustaste nach dem Verschieben loslassen, schnappt das Kugelsymbol am Pfad an. Nun können Sie ja gleich einmal die Eingabe-Taste drücken. Und tatsächlich. Die Kugel hüpft langsamer werdend durch das Bild, bis sie am Ende liegen bleibt.

Die Animation perfektionieren

Die Arbeit ist aber noch nicht erledigt: Es gibt noch sehr viel zu tun, bevor das Ballhüpfen perfekt ist. Das beginnt mit dem Schatten, der ja noch immer links neben dem Bild steht. Er muss natürlich auch animiert werden, schließlich verleiht er ja die erforderliche Tiefe. Wechseln Sie wieder zum Endbild des Films und verschieben Sie den Schatten mit den Pfeiltasten unter die Kugel. Ein erneutes Testen des Films zeigt, dass noch eine ganze Menge Arbeit auf Sie zukommt - der Schatten läuft nämlich vor der Kugel weg. Die Kugel holt den Schatten erst ein, wenn das letzte Bild erreicht ist. Der Grund ist einleuchtend: Der Schatten legt nur einen geraden Weg zurück. Die Kugel muss dagegen durch die Kurven eine viele längere Strecke zurücklegen. Nur im Endbild treffen sich Schatten und Kugel wieder. Das sieht natürlich ziemlich unprofessionell aus. Deshalb soll dieses Manko nun korrigiert werden. Schauen Sie sich die Animation vom ersten Bild beginnend an. Am besten verwenden Sie die Punkt-Taste - damit geht es immer ein Bild vorwärts. Mit der Komma-Taste wechseln Sie zum vorherigen Bild.

Suchen Sie das Bild, in dem die Kugel das erste Mal auf dem Boden landet. In unserem Fall ist dies Bild 24. Die aktuelle Bildzahl lesen Sie übrigens unter der Zeitleiste rechts neben den Schaltflächen ab. Markieren Sie an dieser Stelle das Filmbild in beiden Ebenen. Klicken Sie dazu mit gedrückter Strg-Taste zuerst das Bild einer Ebene und danach mit zusätzlich gedrückter Umschalt-Taste das Bild der anderen Ebene an. Beide Bilder sind dann markiert. Fügen Sie an dieser Stelle über das Kontextmenü neue Schlüsselbilder ein.

Nun die Überlegung, was mit dem Schatten passieren soll: Er muss sich direkt unter der Kugel befinden - sie liegt ja nun am Boden. Markieren Sie also beide Symbole und richten Sie den Schatten horizontal zentriert aus. Durch den Markierungsrahmen ist es am Leichtesten die Ausrichtung mit den Pfeiltasten vorzunehmen. Auch beim ersten Bild der Animation sollten Sie die Objekte ausrichten. Als Nächstes soll der Schatten kleiner werden. Je näher sich das Objekt am Boden befindet, umso kleiner wird der Schatten. Stellen Sie für das Schatten-Symbol einen Transformationswert von 90 Prozent ein. Das Verfahren ist natürlich nicht so ganz realistisch: Der Schatten müsste scharfkantiger werden, wenn er am Boden ist, und weich auslaufender in der Luft. Einen solchen Aufwand soll bei der Beispiel-Animation aber nicht betrieben werden. Wiederholen Sie diese Arbeitsschritte bei allen Phasen, in denen die Kugel auf den Boden trifft - also insgesamt siebenmal. Die dazugehörenden Bildnummern lauten: 45, 63, 77, 87, 94 und 100. In der Zeitleiste hat sich so einiges getan. Sie sollten nun eine ganze Menge neu hinzugekommener Schlüsselbilder vorfinden.

Anpassen der höchsten Punkte

Nachdem die Punkte angepasst sind, an denen die Kugel auf dem Boden auftrifft, können Sie den Film nochmals ansehen. Sie werden dann bemerken, dass noch weitere Bilder angepasst werden müssen. Es gibt nämlich weitere "Pseudo-Schlüsselbilder". Entscheidende Bilder sind auch die, an denen die Kugel den höchsten Punkt erreicht hat. Auch dort muss der Schatten ausgerichtet werden. Außerdem soll der Schatten hier wieder groß sein und nicht vollständig deckend. Das sieht dann etwas realistischer aus. Suchen Sie deshalb das Filmbild, an dem die Kugel das erste Mal den höchsten Punkt erreicht hat. Das ist in unserem Fall das Bild 8. Richten Sie dort Schatten und Kugel wieder zentriert zueinander aus. Zum Ausrichten können Sie auch das Info-Bedienfeld verwenden. Achten Sie darauf, dass dort das Zentrum als Bezug markiert ist, und stellen Sie den x-Wert für die Horizontale so ein wie den entsprechenden Wert der Kugel.

Zusätzlich wird dann der Schatten auf 100 Prozent in der Höhe und Breite vergrößert und erhält im Effekt-Bedienfeld einen Alpha-Effekt von 75 Prozent. Er wird also schwach transparent. Der bearbeitete Schatten sollte dann wie abgebildet aussehen. Auf dieselbe Art müssen jetzt auch die Bilder der anderen "Huckel" bearbeitet werden. Es sind die Bilder mit den Nummern: 34, 54, 70 und 82. Da die letzten beiden Huckel sehr flach sind, haben wir keine Zwischenphase mehr eingefügt, da die Erhebung zu schwach ist.

Anpassen der aufsteigenden Punkte

Ein erneutes Abspielen zeigt, dass noch weitere Korrekturen nötig sind - beim Aufsteigen und Abfallen der Kugel legt die Kugel ja kaum eine Strecke zurück, der Schatten wandert aber lustig weiter. Da hilft nichts, auch hier müssen Sie eingreifen. Diesen Fehler können Sie beheben, indem Sie zwischen dem höchsten und tiefsten Punkt ein weiteres Schlüsselbild platzieren. Es wird allerdings nicht immer genau aufgehen - dann verwenden Sie ungefähr das mittlere Bild.

Richten Sie hier ebenfalls jeweils den Schatten zur Kugel aus. Für die Kugel wird eigentlich kein Schlüsselbild benötigt, sondern nur für den Schatten. Innerhalb des Bewegungs-Tweens können Sie aber den Kreis nicht auswählen - nur bei den Schlüsselbildern. Deshalb müssen Sie zu einem Trick greifen: Erstellen Sie für beide Ebenen ein Schlüsselbild und richten Sie die Objekte zueinander aus. Ist dies erledigt, löschen Sie das Schlüsselbild für die Kugelebene wieder. Stellen Sie diese neuen Schlüsselbilder für die vier ersten "Huckel" ein, bei den letzten Sprüngen ist dies nicht nötig, da hier keine Fehler mehr auftraten.

Aus einer "Metallkugel" wird ein Ball

Nun sieht das Ergebnis schon sehr gut aus. Die Kugel hüpft ansprechend durch das Bild. Eine Verbesserung wollen wir aber noch anbringen: Die Wahrscheinlichkeit, dass die Kugel hüpfen könnte, ist eher gering: Sie scheint sehr schwer und starr zu sein. Warum? Nun: Sie verformt sich kein Stück, wenn sie auf dem Boden auftrifft. Deshalb soll aus der steifen Kugel jetzt ein Ball werden, der sich beim Aufprall auf den Boden verformt. Das Verfahren dabei ist recht einfach: Wechseln Sie zum ersten Schlüsselbild, in dem die Kugel auf den Boden auftrifft. Gehen Sie von dort ein Bild zurück, am besten mit der Komma-Taste. Fügen Sie dort für die Kugelebene ein neues Schlüsselbild ein. Änderungen brauchen Sie bei diesem neuen Schlüsselbild nicht vorzunehmen. Es soll mit diesem neuen Schlüsselbild nur das dortige Stadium fixiert werden. Wechseln Sie dann mit der Punkt-Taste wieder zum nächsten Schlüsselbild. Stauchen Sie nun über das Transformieren-Bedienfeld die Kugel in der Höhe auf 80 Prozent. Das Optionsfeld Proportion muss dabei deaktiviert sein.

Verschieben Sie die Kugel dann etwas nach unten, um sie wieder auf den Boden zu setzen. Verwenden Sie dazu am besten das Info-Bedienfeld, damit die folgenden Bilder um den gleichen Wert verschoben werden. Oder Sie platzieren eine weitere horizontale Hilfslinie. Die gestauchte Kugel sehen Sie in der Abbildung. Wiederholen Sie diese Schritte in allen anderen Bildern, bei denen die Kugel auf dem Boden auftrifft. Bei den letzten Schlüsselbildern können Sie die Kugel immer weniger stauchen, da sie ja dort nur ein kleines Stück über dem Boden hüpft. Warum diese Arbeitsschritte gemacht wurden? Die Form kann sich ja erst verändern, wenn die Kugel auf dem Boden auftrifft. Wäre das vorherige Bild nicht fixiert, würde sich die Form schon zuvor ändern. Um das Zurückkehren zur ungestauchten Form brauchen wir uns nicht zu kümmern: Bis die Kugel den höchsten Punkt erreicht hat, ist die Normalform wieder erreicht, da dort ja bereits ein Schlüsselbild platziert wurde. Wie Sie in der Abbildung sehen, sind im Laufe der Animationsarbeit jede Menge Schlüsselbilder entstanden. Im Nachhinein ist es schwierig zur erkennen, wie die Animation entstanden ist.

Einen "Ticker" animieren

Dieser Animationsteil ist jetzt abgeschlossen. Als Nächstes soll ein Schriftzug im Bild erscheinen - natürlich auch mit einer besonderen Animation: mit einem "Ticker"-Effekt. Dabei erscheint, wie mit einer Schreibmaschine geschrieben, Buchstabe für Buchstabe nacheinander im Bild, bis der Gesamttext zu erkennen ist. Wechseln Sie zum letzten Bild der Animation. Da der Pfad nun nicht mehr benötigt wird, können Sie diese Ebene mit einem Klick auf das Augensymbol ausblenden.

Damit die Bearbeitung übersichtlich bleibt, können Sie wieder einige vorbereitende Arbeiten durchführen. Damit es in der Zeitleiste nicht so voll bleibt, erstellen Sie über das Szene-Bedienfeld eine neue Szene - extra für den Ticker. Das ist weitaus leichter, als wenn Sie in einer "endlos" langen Zeitleiste arbeiten. Die neu Szene ist erst einmal leer.

Kehren Sie deshalb zur ersten Szene zurück und kopieren Sie dort im letzten Bild der Animation die Kugel samt Schatten. Fügen Sie sie in der neuen Szene mit der Funktion "An Position einfügen" wieder ein.

Das Textobjekt für den Ticker erstellen

Für den Ticker benötigen wir ein Textobjekt, das wir mit einigen Effekten versehen wollen. Erstellen Sie eine neue Ebene für den Tickertext. Sie wird über der Ebene mit den Hintergrundelementen angeordnet. Geben Sie für den Text die abgebildeten Einstellungen ein. Die Buchstaben wurden über das Zeichenabstand-Eingabefeld ein klein wenig auseinander gezogen, da der Text später eine Kontur erhält. Tippen Sie den Text "www.ball-her.de" ein und platzieren Sie ihn in etwa so, wie es die Abbildung zeigt.

Der Text soll eine Kontur erhalten. Dies ist aber nur möglich, wenn Sie den Text mit "Modifizieren/Teilen" in ein "normales" Objekt umwandeln. Sie erkennen die Umwandlung daran, dass die Buchstaben nun punktiert hervorgehoben werden. Nach der Umwandlung verliert der Text seine Eigenschaften. Sie können danach weder die Schriftattribute noch den eingetippten Text bearbeiten. Deshalb müssen Sie sehr sorgsam mit dieser Funktion umgehen.

Da es sich nun um ein ganz normales Form-Objekt handelt, können Sie es auch mit einer Kontur versehen. Stellen Sie dafür eine sehr dünne weiße Kontur mit einer Stärke von 1.5 Pixeln ein. Heben Sie die Markierung des Textes auf und rufen Sie das Tintenfass-Werkzeug aus der Werkzeugleiste auf. Klicken Sie damit jetzt Buchstabe für Buchstabe an, um die Kontur anzubringen. Aufpassen müssen Sie bei den Buchstaben mit einem Loch wie etwa beim Buchstaben "a". Dort sind zwei Klicks nötig - einer für das Loch innen und einer für die Kontur außen.

Objekte mit harten Schatten versehen

Damit der Schriftzug etwas schicker wird, soll er nun mit einem Schatten versehen werden. Auch hier bietet Flash keine Hilfe an, so dass Sie einen Umweg gehen müssen. Die Arbeitsschritte sind aber recht einfach: Markieren Sie nach dem Aufruf des Pfeilwerkzeugs mit einem Rahmen alle Einzelobjekte des Schriftzugs und kopieren Sie die Markierung mit der Kopieren-Funktion aus dem Kontextmenü. Färben Sie die Füllung dieser markierten Objekte nun ebenso in Schwarz ein wie die Kontur. Diese Objekte sollen nämlich nun den schwarzen Schatten darstellen. Dann muss der Schatten zunächst einmal verschoben werden, und zwar nach rechts unten, damit ein natürlich wirkender Schatteneffekt entsteht. Das erledigen Sie am einfachsten mit dem Info-Bedienfeld. Der Schatten soll um 3 Pixel verschoben werden. Erhöhen Sie den x- und y-Wert um diese Pixelanzahl. Nun können Sie den Inhalt des Zwischenspeichers wieder einfügen. Verwenden Sie dazu die Funktion "An Position einfügen" aus dem Kontextmenü, damit der Schriftzug genau wieder an der Stelle eingefügt wird, wo sich das Original ursprünglich befand. Nach der Abwahl des Schriftzugs wird der darunter liegende Schatten aber zurechtgeschnitten, da ja keine neue Ebene erstellt wurde. Das ist in diesem Beispiel nicht erforderlich. Wir halten es für das Beispiel nicht für nötig: Wenn Sie aber den Schatten noch etwas realistischer gestalten wollen, können Sie wieder die Funktion "Modifizieren/Form/Ecken abrunden" verwenden, um den Schatten weichzuzeichnen. Das vergrößert aber auch die Dateigröße der Filmdatei.

Die Schlüsselbilder für den Ticker

Nun sind alle Objekte für den Ticker vorhanden. Das Erstellen des Tickers ist recht einfach. Bevor es losgehen kann, werden die neuen Schlüsselbilder benötigt. Hier ist wieder eine Überlegung nötig, die Animationsdesignern "alter Schule" bekannt ist. Multimedia-Freaks tun sich damit erfahrungsgemäß zunächst einmal schwer. Was soll erreicht werden? Im ersten und zweiten Bild soll ein "w" zu sehen sein. Dann erscheint für zwei weitere Filmbilder das nächste "w". Und so geht es im Zweibilderrhythmus weiter, bis alle Buchstaben erschienen sind. Wenn Sie die Buchstaben aufaddieren, kommen Sie so zum Bild 30. In Bild 29 erscheint der letzte Buchstabe und bleibt bis Bild 30 stehen. Vielleicht grübeln Sie nun, wie Sie für jedes Bild deckungsgleiche Objekte erstellen können, und haben schon Bammel vor der vielen Arbeit und etwaigen Ungenauigkeiten. Trickfilmzeichner gehen da ganz anders vor: Sie denken nämlich meist "rückwärts" und gehen vom Endbild aus. Das ist weit einfacher. Wechseln Sie zum zweiten Bild und fügen Sie mit der Kontextmenüfunktion Bild einfügen ein weiteres Filmbild ein, da ja jeder Buchstabe zwei Filmbilder lang zu sehen sein soll. Im dritten Bild soll es nun eine Änderung geben. Deshalb wird hier über das Kontextmenü ein neues Schlüsselbild eingefügt. Achten Sie darauf, dass am Ende wirklich alle Teile der Kontur, Füllung und des Schattens des "e" gelöscht wurden. Einen Markierungsrahmen sollten Sie dabei nicht verwenden, da die Gefahr zu groß ist, dass Sie damit eventuell einen Teil eines anderen Buchstabens mit erwischen, da die Buchstaben doch recht eng zusammensitzen. Da auch dieses Stadium zwei Bilder lang zu sehen sein soll, fügen Sie nun wieder ein Bild in die Zeitleiste ein - kein Schlüsselbild! Und so geht es nun Bild für Bild weiter, bis am Ende bei Bild 30 nur noch ein Buchstabe zu sehen ist. Hier ist ein bisschen Fleißarbeit nötig. Damit der Ball samt Schatten während der gesamten Animation zu sehen ist, platzieren Sie für diese Ebene im Bild 30 mit der Funktion "Bild einfügen" ein Füllbild. Sie können die Animation ja schon einmal ausprobieren. Starten Sie die Animation mit der Eingabe-Taste. Aber das ist doch verkehrt herum, denken Sie vielleicht: Hätten wir doch besser "vorwärts" gearbeitet? Keine Bange. Flash bietet Optionen an, die Bilder umzudrehen. Der Trickfilmzeichner hat bei seiner Arbeit die fertigen Phasen einfach rückwärts aufgenommen. Das können Sie natürlich in Flash nicht - aber so etwas Ähnliches.

Markieren Sie alle Bilder der Ticker-Ebene. Rufen Sie aus dem Kontextmenü die Funktion "Bilder umkehren" auf. In der Zeitleiste verändert sich gar nichts. Wenn Sie aber den Film starten, sehen Sie, dass nun die Animation korrekt abläuft. Damit dreht Flash nämlich die markierten Bilder einmal von vorn nach hinten um. Anschließend ist das letzte Bild das erste und umgedreht. Das Rückwärtsarbeiten ist aber noch nicht ganz abgeschlossen. Wenn Sie den Film mit der Tastenkombination Strg-Enter gestartet haben, haben Sie es sicherlich schon bemerkt: Die Buchstaben sehen ziemlich kaputt aus. Das liegt daran, dass die Textelemente noch gar nicht in Symbole umgewandelt wurden. Aber auch das können Sie nachholen, so herum ist es nämlich viel leichter. Dass die Buchstaben noch nicht in Symbole umgewandelt sind, hatte einen Grund: Es ist einfacher, genauer und schneller, wenn Sie die Symbole erst am Ende erstellen. So brauchen Sie sich nämlich nicht um das korrekte Positionieren zu kümmern - alles steht schon am rechten Fleck.

Es ist empfehlenswert, die Schatten getrennt von dem eingefärbten Schriftzug als Symbol zu speichern, sonst könnten Berechnungsfehler von Flash auftreten. Die Vorgehensweise ist einfach. Sie müssen bei allen Buchstaben dasselbe Prozedere durchführen: Markieren Sie zunächst mit dem Pfeilwerkzeug alle Buchstaben samt weißer Kontur. Achten Sie genau auf die Punktierung, damit auch wirklich alle Teile ausgewählt sind - von dem schwarzen Schatten dürfen keine Teile ausgewählt sein. Wählen Sie zur optimalen Beurteilung am besten eine große Darstellungsgröße - zum Beispiel 200 Prozent. Wandeln Sie nun die markierten Buchstaben in ein grafisches Symbol um. Am schnellsten klappt das, wenn Sie die Funktionstaste F8 verwenden. Markieren Sie dann bei gedrückter Umschalt-Taste mit einem Markierungsrahmen die ganzen Schattenteile. Vergeben Sie bei den Symbolen gleich aussagekräftige Namen - sonst finden Sie sich später nicht mehr zurecht. So können Sie bei den Schatten jeweils einen Buchstaben voranstellen. Wir haben "k" für Kontur gewählt und jeweils die vorhandenen Buchstaben für die Bezeichnungen. Diese Schritte müssen Sie nun bei allen Schlüsselbildern wiederholen.

Wenn Sie dann abschließend die vielen fertig konvertierten Symbole in der Bibliothek noch ordentlich in verschiedenen Ordnern unterbringen, haben Sie es geschafft! Starten Sie die Animation und kontrollieren Sie, ob alles geklappt hat.