Benutzerhandbuch Abbrechen

Erstellen von Bewegungs-Tween-Animationen

  1. Adobe Animate-Benutzerhandbuch
  2. Einführung in Animate
    1. Neue Funktionen in Animate
    2. Visuelles Glossar
    3. Systemanforderungen für Animate
    4. Tastaturbefehle für Animate
    5. Arbeiten mit verschiedenen Dateitypen in Animate
  3. Animation
    1. Grundlagen von Animationen in Animate
    2. So verwenden Sie Bilder und Schlüsselbilder in Animate
    3. Einzelbildanimation in Animate
    4. Arbeiten mit klassischen Tween-Animationen in Animate
    5. Pinselwerkzeug
    6. Bewegungsführung
    7. Bewegungs-Tweens und ActionScript 3.0
    8. Bewegungs-Tween-Animationen
    9. Bewegungs-Tween-Animationen
    10. Erstellen von Bewegungs-Tween-Animationen
    11. Verwenden von Eigenschaftenschlüsselbildern
    12. Animieren der Position mithilfe eines Tweens
    13. So bearbeiten Sie Bewegungs-Tweens mit dem Bewegungs-Editor
    14. Bearbeiten des Bewegungspfades einer Tween-Animation
    15. Manipulieren von Bewegungs-Tweens
    16. Hinzufügen von benutzerdefinierten Beschleunigungen
    17. Erstellen und Anwenden von Bewegungsvoreinstellungen
    18. Einrichten von Animations-Tween-Bereichen
    19. Arbeiten mit als XML-Dateien gespeicherten Bewegungs-Tweens
    20. Vergleich von Bewegungs-Tweens und klassischen Tweens
    21. Form-Tweening
    22. Verwenden von Animation mit dem Bone-Werkzeug in Animate
    23. Arbeiten mit Figuren-Rigging in Animate
    24. So verwenden Sie Maskenebenen in Adobe Animate
    25. So arbeiten Sie in Animate mit Szenen
  4. Interaktivität
    1. So erstellen Sie in Animate Schaltflächen
    2. Konvertieren von Animate-Projekten in andere Dokumenttypen
    3. HTML5 Canvas-Dokumente in Animate erstellen und veröffentlichen
    4. Interaktivität mit Codefragmenten in Animate hinzufügen
    5. Erstellen benutzerdefinierter HTML5-Komponenten
    6. Verwenden von Komponenten in HTML5 Canvas
    7. Erstellen von benutzerdefinierten Komponenten: Beispiele
    8. Codefragmente für benutzerdefinierte Komponenten
    9. Empfohlene Verfahren – Anzeigen mit Animate
    10. Authoring und Veröffentlichen für VR
  5. Arbeitsbereich und Arbeitsablauf
    1. Erstellen und Verwalten von Pinseln
    2. Verwenden von Google Fonts in HTML5 Canvas-Dokumenten
    3. Verwenden von Creative Cloud Libraries in Adobe Animate
    4. Bühne und Bedienfeld „Werkzeuge“ in Animate verwenden
    5. Arbeitsablauf und Arbeitsbereich in Animate
    6. Verwenden von Webschriftarten in HTML5 Canvas-Dokumenten
    7. Zeitleisten und ActionScript
    8. Arbeiten mit mehreren Zeitleisten
    9. Festlegen von Voreinstellungen
    10. Verwenden der Animate-Authoring-Bedienfelder
    11. Zeitleisten-Ebenen in Animate erstellen
    12. Exportieren von Animationen für Apps und Game-Engines
    13. Verschieben und Kopieren von Objekten
    14. Vorlagen
    15. Suchen und Ersetzen in Animate
    16. Rückgängigmachen, Wiederholen und das Bedienfeld „Protokoll“
    17. Tastaturbefehle
    18. So verwenden Sie die Zeitleiste in Animate
    19. Erstellen von HTML-Erweiterungen
    20. Optimierungsoptionen für Bilder und animierte GIF-Dateien
    21. Exporteinstellungen für Bilder und GIF-Dateien
    22. Bedienfeld „Elemente“ in Animate
  6. Multimedia und Video
    1. Transformieren und Kombinieren von Grafikobjekten in Animate
    2. Erstellen von und Arbeiten mit Symbolinstanzen in Animate
    3. Bildnachzeichner
    4. So verwenden Sie Sound in Adobe Animate
    5. Exportieren von SVG-Dateien
    6. Erstellen von Videodateien zur Verwendung in Animate
    7. So fügen Sie in Animate ein Video hinzu
    8. Objekte in Animate zeichnen und erstellen
    9. Umformen von Linien und Formen
    10. Striche, Füllungen und Farbverläufe in Animate CC
    11. Adobe Premiere Pro und After Effects
    12. Farb-Bedienfelder in Animate CC
    13. Öffnen von Flash CS6-Dateien mit Animate
    14. In Animate mit klassischem Text arbeiten
    15. Platzieren von Bildern in Animate
    16. Importierte Bitmaps in Animate
    17. 3D-Grafiken
    18. Arbeiten mit Symbolen in Animate
    19. Zeichnen von Linien und Formen mit Adobe Animate
    20. Mit Bibliotheken in Animate arbeiten
    21. Exportieren von Sounds
    22. Auswählen von Objekten in Animate CC
    23. Arbeiten mit Adobe Illustrator AI-Dateien in Animate
    24. Anwenden von Mischmodi
    25. Anordnen von Objekten
    26. Automatisieren von Aufgaben mit dem Menü „Befehle“
    27. Mehrsprachiger Text
    28. Verwenden der Kamera in Animate
    29. Grafikfilter
    30. Sounds und ActionScript
    31. Zeichnungsvoreinstellungen
    32. Zeichnen mit dem Stiftwerkzeug
  7. Plattformen
    1. Konvertieren von Animate-Projekten in andere Dokumenttypen
    2. Unterstützung benutzerdefinierter Plattformen
    3. HTML5 Canvas-Dokumente in Animate erstellen und veröffentlichen
    4. Erstellen und Veröffentlichen eines WebGL-Dokuments
    5. So packen Sie Apps für AIR for iOS:
    6. Veröffentlichen von Apps für AIR for Android
    7. Veröffentlichen für Adobe AIR für den Desktop
    8. ActionScript-Veröffentlichungseinstellungen
    9. Empfohlene Verfahren – Organisieren von ActionScript in einer Anwendung
    10. So verwenden Sie ActionScript mit Animate
    11. Eingabehilfen für den Animate-Arbeitsbereich
    12. Schreiben und Verwalten von Skripts
    13. Aktivieren der Unterstützung für benutzerdefinierte Plattformen
    14. Unterstützung benutzerdefinierter Plattformen – Übersicht
    15. Arbeiten mit Plug-ins zur Unterstützung benutzerdefinierter Plattformen
    16. Debuggen von ActionScript 3.0
    17. Aktivieren der Unterstützung für benutzerdefinierte Plattformen
  8. Exportieren und Veröffentlichen
    1. So exportieren Sie Dateien aus Animate CC
    2. OAM-Veröffentlichung
    3. Exportieren von SVG-Dateien
    4. Exportieren von Grafiken und Videos mit Animate
    5. Veröffentlichen von AS3-Dokumenten
    6. Exportieren von Animationen für Apps und Game-Engines
    7. Exportieren von Sounds
    8. Empfohlene Verfahren – Tipps zum Erstellen von Inhalten für mobile Geräte
    9. Empfohlene Verfahren – Videokonventionen
    10. Empfohlene Verfahren – Authoring-Richtlinien für SWF-Anwendungen
    11. Empfohlene Verfahren – Strukturierung von FLA-Dateien
    12. Empfohlene Verfahren für die Optimierung von FLA-Dateien für Animate
    13. ActionScript-Veröffentlichungseinstellungen
    14. Veröffentlichungseinstellungen für Animate festlegen
    15. Exportieren von Projektor-Dateien
    16. Exportieren von Bildern und animierten GIF-Dateien
    17. HTML-Veröffentlichungsvorlagen
    18. Adobe Premiere Pro und After Effects
    19. Schnelles Teilen und Veröffentlichen Ihrer Animationen
  9. Fehlerbehebung
    1. Behobene Probleme
    2. Bekannte Probleme

Bevor Sie beginnen

 Bevor Sie mit dem Erstellen von Animationen beginnen, sollten Sie die folgenden Begriffe verstehen:

Voraussetzungen

Beschreibung

Bevor Sie mit Bewegungs-Tweens arbeiten, sollten Sie mit der Verwendung der Zeitleisten- und Bearbeitungseigenschaften vertraut sein. Einzelne Eigenschaftenschlüsselbilder lassen sich auf der Bühne, im Eigenschafteninspektor oder im neu gestalteten Bewegungs-Editor bearbeiten.

In Animate können nur Symbolinstanzen und Textfelder getweent werden. Alle anderen Objekttypen werden in ein Symbol eingeschlossen, wenn Sie ein Tween darauf anwenden. Die Symbolinstanz kann verschachtelte Symbole enthalten, die auf ihren eigenen Zeitleisten getweent werden.

Der kleinste Baustein auf einer Tween-Ebene ist ein Tween-Bereich. Eine Tween-Folge auf einer Tween-Ebene kann nur eine Symbolinstanz oder ein Textfeld enthalten. Die Symbolinstanz wird als Ziel des Tween-Bereichs bezeichnet. Ein einzelnes Symbol kann jedoch viele Objekte enthalten.

Wenn Sie dem Tween-Bereich ein zweites Symbol oder Textfeld hinzufügen, wird das ursprüngliche Symbol durch dieses ersetzt. Verwenden Sie eine der folgenden Methoden, um das Zielobjekt eines Tweens zu ändern:

  • Ziehen Sie ein anderes Symbol aus der Bibliothek auf den Tween-Bereich in der Zeitleiste.
  • Verwenden Sie den Befehl „Modifizieren“ > „Symbol“ > „Symbol austauschen“.

Sie können das Symbol aus einem Tween-Bereich löschen, ohne das Tween zu entfernen oder zu teilen. Sie können dann zu einem späteren Zeitpunkt eine andere Symbolinstanz zum Tween hinzufügen. Sie können auch den Typ des Zielsymbols ändern oder das Symbol jederzeit bearbeiten.

Wenn ein Tween Bewegung enthält, wird auf der Bühne ein Bewegungspfad angezeigt. Der Bewegungspfad zeigt in jedem Frame die Position des getweenten Objekts an. Sie können den Bewegungspfad direkt auf der Bühne bearbeiten, indem Sie an seinen Steuerpunkten ziehen. Zu einer Tween-/Inverse Kinematics-Ebene können Sie keinen Pfad hinzufügen. 

Siehe auch

Komponenten von Bewegungs-Tweens

Tween-Bereich:

  • Eine Gruppe von Bildern in der Zeitleiste, in denen ein Objekt im Laufe der Zeit in mindestens einer Eigenschaft geändert wird.
  • Ein Bewegungs-Tween-Bereich erscheint in der Zeitleiste als Gruppe von Bildern auf einer einzelnen Ebene mit einem blauen Hintergrund.
  • Sie können die Tween-Bereiche als einzelnes Objekt auswählen und von einer Position auf der Zeitleiste an eine andere oder auch in eine andere Ebene ziehen.
  • Sie können in jedem Tween-Bereich nur ein Objekt auf der Bühne animieren. Dieses Objekt wird als Zielobjekt des Tween-Bereichs bezeichnet.

Eigenschaftenschlüsselbild:

  • Ein Bild innerhalb eines Tween-Bereichs, in dem Sie ausdrücklich eine oder mehrere Eigenschaftenwerte für das Tween-Zielobjekt definieren.
  • Diese Eigenschaften sind u. a. Position, Alphawert (Transparenz), Farbton usw.
  • Jede definierte Eigenschaft verfügt über ihre eigenen Eigenschaftenschlüsselbilder.
  • Wenn Sie in einem Bild mehrere Eigenschaften festlegen, befindet sich das Eigenschaftenschlüsselbild für jede dieser Eigenschaften in diesem Bild.
  • Verwenden Sie den Bewegungs-Editor, um jede Eigenschaft eines Tween-Bereichs und die zugehörigen Eigenschaftenschlüsselbilder anzuzeigen.
  • Um im Kontextmenü des Tween-Bereichs auszuwählen, welche Art von Eigenschaftenschlüsselbildern in der Zeitleiste angezeigt werden soll, klicken Sie mit der rechten Maustaste auf ein Eigenschaftenschlüsselbild und wählen Sie „Schlüsselbilder anzeigen“. 

Zielobjekt eines Tweens

Ein Bewegungs-Tween verfügt über ein einzelnes Objekt in einem Tween-Bereich, das als Zielobjekt des Tweens bezeichnet wird. Ein einzelnes Zielobjekt in einem Tween bietet eine Reihe von Vorteilen:

  • Sie können ein Tween zur erneuten Verwendung als Vorgabe speichern.
  • Sie können Bewegungs-Tweens ganz einfach in der Zeitleiste (durch Ziehen des Tween-Bereichs) oder auf der Bühne bewegen.
  • So wenden Sie eine neue Instanz auf einen vorhandenen Tween an:
    • Fügen Sie sie zum Austauschen auf einem Tween ein.
    • Ziehen Sie eine neue Instanz aus der Bibliothek.
    • Verwenden Sie das Austauschsymbol. 

„Tweenbare“ Objekte und Eigenschaften

Auf folgende Objekttypen können Sie ein Bewegungs-Tween anwenden: Movieclips, Grafiken und Schaltflächensymbole sowie Textfelder. Die Eigenschaften dieser tweenbaren Objekte umfassen Folgendes:

  • 2D X- und Y-Position
  • 3D Z-Position (nur Movieclips)

  • 2D-Drehung (um die z-Achse)

  • 3D X-, Y- und Z-Drehung (nur Movieclips): Wählen Sie in den Veröffentlichungseinstellungen Actionscript 3.0 und Flash Player 10 oder höher als Ziel der FLA-Datei aus. Adobe AIR unterstützt auch 3D-Bewegungen.

  • X- und Y-Neigung

  • X- und Y-Skalierung

  • Farbeffekte: Enthält Alpha (Transparenz), Helligkeit, Farbton und erweiterte Farbeinstellungen. Farbeffekte können nur für Symbole und TLF-Text getweent werden. Durch ein Tweenen dieser Eigenschaften erreichen Sie, dass Objekte eingeblendet werden oder allmählich die Farbe wechseln. Um einen Farbeffekt für klassischen Text zu tweenen, konvertieren Sie den Text in ein Symbol.

  • Filtereigenschaften (Filter können nicht auf Grafiksymbole angewendet werden).

Erstellen von Bewegungs-Tween-Animationen

Sie können eine der folgenden drei Methoden nutzen, um ein Bewegungs-Tween zu erstellen:

  • Erstellen Sie eine Grafik oder Instanz, die Sie tweenen möchten, und klicken Sie dann mit der rechten Maustaste auf ein Bild und wählen Sie „Bewegungs-Tween erstellen“.
  • Wählen Sie die Grafik oder Instanz, die Sie tweenen möchten, und wählen Sie anschließend im Hauptmenü „Einfügen“ > „Bewegungs-Tween“.
  • Erstellen Sie eine Grafik oder Instanz, die Sie tweenen möchten, klicken Sie dann mit der rechten Maustaste auf der Bühne auf die Instanz und wählen Sie „Bewegungs-Tween erstellen“.

 Die Verwendung von ActionScript in einer Animation ist optional.

Erstellen von Bewegungs-Tween-Animationen

Tweenen weiterer Eigenschaften mit dem Eigenschafteninspektor

Animieren Sie Eigenschaften einer Symbolinstanz oder eines Textfelds mit dem Befehl „Bewegungs-Tween erstellen“. Die Eigenschaften umfassen Drehung, Skalierung, Transparenz und Farbton (nur Symbole und TLF-Text). So können Sie etwa die Eigenschaft „Alpha“ (Transparenz) einer Symbolinstanz ändern, so dass in der Animation das Symbol allmählich auf dem Bildschirm eingeblendet wird.

  1. Wählen Sie auf der Bühne eine Symbolinstanz oder ein Textfeld aus.

    Enthält die Auswahl andere Objekte oder mehrere Objekte aus einer Ebene, bietet Animate Ihnen an, die Auswahl in ein Movieclipsymbol zu konvertieren.

  2. Wählen Sie „Einfügen“ > „Bewegungs-Tween“.

    Wenn das Dialogfeld „Auswahl in Symbol für Tween konvertieren“ erscheint, klicken Sie auf „OK“, um die Auswahl in ein Movieclipsymbol zu konvertieren.

    Wenn Sie ein Tween auf ein Objekt anwenden, das in nur einem Schlüsselbild vorhanden ist, bewegt sich der Abspielkopf zum letzten Bild des neuen Tweens. Andernfalls verschiebt sich der Abspielkopf nicht.

  3. Platzieren Sie den Abspielkopf in dem Bild des Tween-Bereichs, in dem Sie einen Eigenschaftenwert festlegen möchten.

    Sie können den Abspielkopf auch in einem beliebigen anderen Bild des Tween-Bereichs platzieren. Das Tween beginnt mit den Eigenschaftenwerten im ersten Bild des Tween-Bereichs, wobei es sich immer um ein Eigenschaftenschlüsselbild handelt.

  4. Während das Objekt auf der Bühne ausgewählt ist, legen Sie einen Wert für eine Eigenschaft fest, die nicht die Position betrifft, zum Beispiel Alpha (Transparenz), Drehung, Neigen usw. Legen Sie den Wert im Eigenschafteninspektor oder mit einem der Werkzeuge aus dem Bedienfeld „Werkzeuge“ fest.

    Das aktuelle Bild des Bereichs wird zu einem Eigenschaftenschlüsselbild.

     In Tween-Bereichen können Sie verschiedene Arten von Eigenschaftenschlüsselbildern anzeigen. Klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Befehlstaste (Macintosh) auf einen Tween-Bereich und wählen Sie im Kontextmenü „Schlüsselbilder anzeigen“ > Eigenschaftentyp.

  5. Bewegen Sie den Abspielkopf in der Zeitleiste, um eine Vorschau von dem Tween auf der Bühne anzuzeigen.

  6. Um weitere Eigenschaftenschlüsselbilder hinzuzufügen, bewegen Sie den Abspielkopf auf das gewünschte Bild in der Folge und legen im Eigenschafteninspektor einen Wert für die Eigenschaft fest.

Hinzufügen eines Tweens zu einer vorhandenen Tween-Ebene

Sie können zu einer vorhandenen Tween-Ebene zusätzliche Tweens hinzufügen. Dadurch können beim Erstellen von Animate-Inhalten mit Animationen weniger Ebenen verwendet werden.

  1. Führen Sie einen der folgenden Schritte aus:

    • Fügen Sie der Ebene ein leeres Schlüsselbild hinzu („Einfügen“ > „Zeitleiste“ > „Leeres Schlüsselbild“), fügen Sie dem Schlüsselbild Elemente hinzu und tweenen Sie dann die Elemente.
    • Erstellen Sie ein Tween auf einer separaten Ebene und ziehen Sie den Bereich auf die gewünschte Ebene.
    • Ziehen Sie ein statisches Bild von einer anderen Ebene auf die Tween-Ebene und fügen Sie einem Objekt im statischen Bild ein Tween hinzu.
    • Drücken Sie die Alt- (Windows) bzw. Wahltaste (Macintosh) und ziehen Sie, um einen vorhandenen Bereich aus derselben oder einer anderen Ebene zu duplizieren.
    • Kopieren Sie einen Tween-Bereich aus derselben oder einer anderen Ebene und fügen Sie ihn ein.

Schneller und einfacher Hilfe erhalten

Neuer Benutzer?