Animieren von Flash-Filtern in Motion Tween

• April 28, 2024

Zu diesem Zeitpunkt haben wir einen schönen Kerzenflammenblitz^R. Animation. Der Betrachter kann jedoch die Wiederholung in der Animation weiterhin bemerken. Wir können dies beheben, indem wir das Tween verlängern. Außerdem werden wir dem Boden der Kerze ein Leuchten hinzufügen und dieses Leuchten animieren.

Zuerst werden wir unserem Tween weitere Frames hinzufügen. Eine Möglichkeit, dies zu tun, besteht darin, die Tween-Frames von einer Ebene zu kopieren und auf einer anderen Ebene einzufügen. Sie könnten sich fragen, wie sich dies von der sich wiederholenden Animation unterscheidet, die wir jetzt haben. Der Trick besteht darin, die Tween-Frames für die neue Ebene umzukehren, sodass die Animation in umgekehrter Reihenfolge abgespielt wird. Dies erschwert es dem Betrachter, die Wiederholung zu erkennen.

1. Klicken Sie auf Frame 1 der Ebene back_glow. Klicken Sie in der Menüleiste auf Bearbeiten - Zeitleiste - Rahmen kopieren.

2. Fügen Sie oben in der Zeitleiste eine neue Ebene hinzu. Das erste Tween endet in Frame 56 und wir möchten, dass dieses Tween sofort beginnt. Fügen Sie Frame 57 einen Keyframe hinzu.

3. Klicken Sie auf Frame 57 und dann auf Bearbeiten - Timeline - Frames einfügen. Flash dupliziert das Tween. Sie werden feststellen, dass der Name der neuen Ebene in back_glow geändert wurde. Möglicherweise möchten Sie dem Namen eine "2" hinzufügen, um anzuzeigen, dass dies das zweite Tween ist.

4. Klicken Sie nun mit der rechten Maustaste auf das Tween und wählen Sie Keyframes umkehren.

Wiederholen Sie diesen Vorgang für die Ebenen Flame_shape und Flame_glow.

Jetzt können wir unser Leuchten am Boden der Kerze hinzufügen. Wir haben eine leere Schicht namens bg, die wir für das Leuchten verwenden können.

5. Benennen Sie die BG-Ebene in bottom_glow um. Setzen Sie die Füllfarbe auf # fe7705 und den Strich auf null.

6. Zeichnen Sie mit dem ovalen Werkzeug ein Oval unter die Kerze. Konvertieren Sie das Oval in einen Movieclip namens "bottom_glow".

Um das Oval in ein Leuchten zu verwandeln, fügen wir einen Unschärfefilter hinzu.

7. Fügen Sie im Bedienfeld Filter einen Unschärfefilter hinzu. Stellen Sie die Einstellungen für Unschärfe X und Y auf 56px und die Qualität auf Hoch ein.

Eine letzte Berührung besteht darin, einen kleinen Schatten am Boden der Kerze hinzuzufügen.

8. Fügen Sie eine neue Ebene direkt über der Ebene bottom_glow hinzu und nennen Sie sie "shadow".

9. Stellen Sie die Füllfarbe auf # 000000 und zeichnen Sie ein kleines Oval am unteren Rand der Kerze.

10. Konvertieren Sie das Oval in einen Movieclip namens "Schatten".

11. Fügen Sie diesem Movieclip den Unschärfefilter hinzu. Stellen Sie die Unschärfe X und Y auf 16px und die Qualität auf Hoch.

Fügen Sie der Ebene bottom_glow ein Bewegungs-Tween hinzu. Jetzt können wir den Filmclip bottom_glow animieren. Wir werden die Tween-Bereiche, die wir gerade für die Flamme erstellt haben, als Richtlinie verwenden. Bewegen Sie sich entlang der Timeline und halten Sie an jedem Keyframe auf dem Flammen-Tween an. Fügen Sie dem bottom_glow Tween-Bereich einen Keyframe hinzu. Ändern Sie die Größe des Bottom_glow-Movieclips an jedem Keyframe.

Ein letzter Schritt besteht darin, ein wenig in der Bibliothek zu organisieren. Wir möchten alle Assets für dieses CandleFlame-Fla im Ordner candleFlame Assets. Ziehen Sie die Movieclips shadow und bottom_glow in diesen Ordner.

Copyright 2018 Adobe Systems Incorporated. Alle Rechte vorbehalten. Screenshots von Adobe-Produkten mit Genehmigung von Adobe Systems Incorporated. Adobe, Photoshop, Photoshop-Album, Photoshop-Elemente, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere-Elemente, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst und Flash Paper ist / sind entweder [eine] eingetragene Marke (n) oder eine Marke (n) von Adobe Systems Incorporated in den USA und / oder anderen Ländern.

Video-Anleitungen: Animate CC Einführung: Flash ist tot, es lebe Flash :-) (April 2024).