Benutzerhandbuch Abbrechen

So arbeiten Sie in Animate mit klassischen 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

Klassische Tweens sind die ältere Methode zur Erstellung getweenter Animationen in Animate. Diese Tweens ähneln den neueren Bewegungs-Tweens, sind aber komplizierter zu erstellen und weniger flexibel. Klassische Tweens bieten jedoch durchaus einige Steuerungsmöglichkeiten für Animationen, die in Bewegungs-Tweens nicht zur Verfügung stehen. Die meisten Benutzer arbeiten lieber mit den neueren Bewegungs-Tweens, doch gibt es einige Benutzer, die die klassischen Tweens noch verwenden möchten. Weitere Informationen finden Sie unter Unterschiede zwischen Bewegungs-Tweens und klassischen Tweens.

Bevor Sie beginnen:

Folgende Punkte sind bei der Arbeit mit klassischen Tweens zu beachten:

  • Klassische Tweens sind die ältere Methode zur Erstellung getweenter Animationen in Animate. Die neuere, einfachere Methode ist die Verwendung von Bewegungs-Tweens. Weitere Informationen finden Sie unter Animationen anhand von Bewegungs-Tweens.

  • 3D-Eigenschaften lassen sich mit klassischen Tweens nicht tweenen.

Beispiele für die klassische Tween-Animation finden Sie auf der Seite mit Animate-Beispielen unter www.adobe.com/go/learn_fl_samples_de. Die folgenden Beispiele stehen zur Auswahl:

  • Animierter Schlagschatten: Laden Sie die komprimierte Samples-Datei herunter, dekomprimieren Sie sie und wechseln Sie in den Ordner Graphics\AnimatedDropShadow, um auf das Beispiel zuzugreifen.

  • Animation und Farbverläufe: Laden Sie die komprimierte Samples-Datei herunter, dekomprimieren Sie sie und wechseln Sie in den Ordner Graphics\AnimationAndGradients, um auf das Beispiel zuzugreifen.

 Wie bei den meisten Aktionen in Animate wird für Animationen kein ActionScript benötigt. Sie können Animationen aber auch mit ActionScript erstellen, wenn Sie das bevorzugen.

Erstellen und Bearbeiten von Schlüsselbildern für klassische Tween-Animationen

Änderungen an einer klassischen Tween-Animation werden in einem Schlüsselbild definiert, während Sie bei einem Bewegungs-Tween nur an den Stellen Schlüsselbilder definieren müssen, die für den Bewegungsablauf von besonderer Bedeutung sind, und die Zwischenbilder von Animate automatisch hinzufügen lassen können. Die interpolierten Bilder einer Tween-Animation werden hellblau dargestellt und mit einem Pfeil gekennzeichnet, der jeweils von einem Schlüsselbild zum nächsten zeigt. Da alle in einem Schlüsselbild enthaltenen Formen im Animate-Dokument gespeichert werden, sollten Sie nur an den Stellen Ihrer Animation Schlüsselbilder einfügen, an denen sich wirklich etwas ändert.

Schlüsselbilder werden in der Zeitleiste besonders hervorgehoben. Ein Schlüsselbild mit Inhalt ist durch einen ausgefüllten und ein leeres Schlüsselbild durch einen leeren Kreis vor dem Bild gekennzeichnet. Nachfolgende Bilder, die Sie in derselben Ebene hinzufügen, weisen denselben Inhalt auf wie das Schlüsselbild.

In einem klassischen Tween können nur Schlüsselbilder bearbeitet werden. Sie können getweente Bilder zwar anzeigen, Sie aber nicht direkt bearbeiten. Wenn Sie getweente Bilder bearbeiten möchten, müssen Sie entweder eines der beiden Schlüsselbilder der Animationssequenz ändern oder zwischen dem Anfangs- und dem Endschlüsselbild ein neues Schlüsselbild einfügen. Ziehen Sie Elemente aus dem Bedienfeld „Bibliothek“ auf die Bühne, um sie in das aktuelle Schlüsselbild einzufügen.

Wie Sie mehrere Bilder gleichzeitig anzeigen und bearbeiten können, erfahren Sie unter Verwenden des Zwiebelschaleneffekts.

 In diesem Thema geht es um die Erstellung von Schlüsselbildern für die älteren klassischen Tweens. Weitere Informationen zu Eigenschaften-Schlüsselbildern für die neueren Bewegungs-Tweens finden Sie unter Erstellen von Tween-Animationen.

Erstellen von Keyframes

  1. Führen Sie einen der folgenden Schritte aus:
    • Klicken Sie in der Zeitleiste auf ein Bild und wählen Sie Einfügen > Zeitleiste > Schlüsselbild.

    • Klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) auf ein Bild in der Zeitleiste und wählen Sie den Befehl „Schlüsselbild einfügen“.

Einfügen von Bildern in die Zeitleiste

  • Zum Einfügen eines neuen Bildes wählen Sie Einfügen > Zeitleiste > Bild.

  • Zum Erstellen eines Schlüsselbildes wählen Sie Einfügen > Zeitleiste > Schlüsselbild oder klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) auf das Bild, um das Schlüsselbild zu platzieren. Wählen Sie Schlüsselbild einfügen.

  • Zum Erstellen eines leeren Schlüsselbildes wählen Sie Einfügen > Zeitleiste > Leeres Schlüsselbild oder klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) auf das Bild, um das Schlüsselbild zu platzieren. Wählen Sie Leeres Schlüsselbild einfügen.

Löschen oder Ändern von Bildern oder Schlüsselbildern

  • Zum Löschen eines Bilds, eines Schlüsselbilds oder einer Bildsequenz markieren Sie das Objekt, klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) und wählen Sie „Bild entfernen“. Die umliegenden Bilder bleiben unverändert.

  • Zum Verschieben eines Schlüsselbilds oder einer Bildsequenz samt Inhalt ziehen Sie das Schlüsselbild oder die Bildsequenz mit der Maus an die gewünschte Position in der Zeitleiste.

  • Zum Ändern der Dauer eines Schlüsselbilds ziehen Sie das Schlüsselbild am Ende der Sequenz bei gedrückter Alt-Taste (Windows) bzw. Wahltaste (Macintosh) an die gewünschte Position in der Zeitleiste.

  • Zum Kopieren und Einfügen eines Bildes oder einer Bildsequenz markieren Sie das Bild oder die Bildsequenz und wählen Sie Bearbeiten > Zeitleiste > Bilder kopieren. Wählen Sie ein Bild oder eine Sequenz und dann Bearbeiten > Zeitleiste > Bilder einfügen. Um die exakte Anzahl kopierter Frames in der Ziel-Zeitleiste durch Einfügen zu ersetzen, verwenden Sie die Option Einfügen und Bilder überschreiben.

  • Zum Umwandeln eines Schlüsselbildes in ein Bild klicken Sie auf das gewünschte Schlüsselbild und wählen Sie Modifizieren > Zeitleiste > Schlüsselbild löschen oder klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) auf das Schlüsselbild und wählen Sie im Kontextmenü Schlüsselbild löschen. Das gelöschte Schlüsselbild sowie alle folgenden Bilder bis zum nächsten Schlüsselbild werden durch den Inhalt des vor dem gelöschten Schlüsselbild liegenden Bildes ersetzt.

  • Zum Kopieren eines Schlüsselbilds oder einer Bildsequenz per Drag & Drop halten Sie die Alt-Taste (Windows) bzw. Wahltaste (Macintosh) gedrückt und ziehen Sie das Schlüsselbild oder die Bildsequenz an die gewünschte Position in der Zeitleiste.

  • Zum Ändern der Dauer einer Tween-Animation ziehen Sie das Schlüsselbild am Anfang oder Ende der entsprechenden Bildsequenz nach links oder rechts.

  • Zum Einfügen eines Bibliothekselements in das aktuelle Schlüsselbild ziehen Sie das gewünschte Element aus dem Bedienfeld „Bibliothek“ auf die Bühne.

  • Zum Umkehren einer Animationssequenz wählen Sie die gewünschten Bilder auf einer oder mehreren Ebenen aus und wählen Sie anschließend Modifizieren > Zeitleiste > Bilder umkehren. Die Sequenz muss sowohl am Anfang als auch am Ende durch ein Schlüsselbild begrenzt sein.

Hinzufügen klassischer Tweens zu einer Instanz, einer Gruppe oder Text

 In diesem Thema geht es um die Erstellung älterer klassischer Tween-Animationen. Weitere Informationen zum Erstellen der neueren Bewegungs-Tweens finden Sie unter Erstellen von Tween-Animationen.

Um die Änderungen der Eigenschaften von Instanzen, Gruppen und Text zu tweenen, können Sie ein klassisches Tween verwenden. Animate kann die Position, Größe, Drehung und Neigung von Instanzen, Gruppen und Text tweenen. Außerdem ist Animate in der Lage, die Farbe von Instanzen und Text zu tweenen, um eine allmähliche Farbveränderung zu erzielen oder eine Instanz ein- bzw. auszublenden.

Wenn Sie die Farbe von Gruppen oder Text tweenen möchten, müssen Sie diese Elemente zunächst in Symbole umwandeln. Bevor Sie einzelne Zeichen eines Textblocks animieren, müssen Sie diese in separate Textblöcke platzieren.

Wenn Sie ein klassisches Tween anwenden und die Anzahl der Bilder zwischen dem Anfangs- und dem Endschlüsselbild der Animation ändern, werden die Bilder automatisch von Animate erneut getweent. Das Gleiche gilt, wenn Sie die Gruppe bzw. das Symbol in einem der beiden Schlüsselbilder verschieben.

 

Erstellen klassischer Tween-Animationen

  1. Zum Definieren einer Ebene als aktive Ebene klicken Sie auf einen Ebenennamen und wählen Sie in dieser Ebene ein leeres Schlüsselbild aus, um zu beginnen. Dieses Bild wird das erste Bild des klassischen Tweens.

  2. Führen Sie einen der folgenden Schritte aus, um dem ersten Bild des klassischen Tweens Inhalt hinzuzufügen:
    • Erstellen Sie mit dem Stift-, Ellipsen-, Rechteck-, Freihand- oder Pinselwerkzeug ein Grafikobjekt und wandeln Sie es in ein Symbol um.

    • Erstellen Sie eine Instanz, eine Gruppe oder einen Textblock auf der Bühne.

    • Ziehen Sie eine Symbolinstanz aus dem Bedienfeld „Bibliothek“ auf die Bühne.

     Um ein Tween zu erstellen, darf die Ebene nur ein Element enthalten.

  3. Erstellen Sie ein zweites Schlüsselbild, bei dem die Animation enden soll, und lassen Sie das neue Schlüsselbild ausgewählt.
  4. Führen Sie einen der folgenden Schritte aus, um das Element im abschließenden Bild zu ändern:
    • Verschieben Sie das Element an eine neue Position.

    • Ändern Sie die Größe, Drehung oder Neigung des Elements.

    • Ändern Sie die Farbe des Elements (nur für Instanzen oder Textblöcke). Führen Sie bei allen Elementen außer Instanzen und Textblöcken mithilfe des Form-Tweenings ein Farben-Tween durch.

  5. Führen Sie einen der folgenden Schritte aus, um das klassische Tween zu erstellen:
    • Klicken Sie auf ein beliebiges Bild im Bildbereich des Tweens und wählen Sie Einfügen > Klassisches Tween.

    • Klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Ctrl-Taste (Macintosh) auf ein beliebiges Bild im Bildbereich des Tweens und wählen Sie im Kontextmenü „Klassisches Tween erstellen“.

    Wenn Sie in Schritt 2 ein grafisches Objekt erstellt haben, wandelt Animate dieses automatisch in ein Symbol um und weist ihm den Namen tween1 zu.

  6. Um die Größe des ausgewählten Elements zu tweenen, wählen Sie im Eigenschafteninspektor im Bereich „Tweening“ die Option zum Skalieren aus. Vorher müssen Sie jedoch in Schritt 4 die Größe des Elements ändern.

  7. Wenden Sie Beschleunigung auf das klassische Tween an, um ein realistischeres Gefühl von Bewegung zu erzeugen. Um Beschleunigung auf ein klassisches Tween anzuwenden, verwenden Sie im Eigenschafteninspektor im Bereich „Tweening“ das Feld „Beschleunigung“. Verwenden Sie das Dialogfeld Benutzerdefinierte Beschleunigung, um die Geschwindigkeit des klassischen Tweens genauer zu steuern.

    Um die Änderungsrate zwischen den getweenten Bildern anzupassen, ziehen Sie den Wert in das Feld „Beschleunigung“ oder geben Sie einen Wert ein.

    • Geben Sie einen negativen Wert zwischen ‑1 und ‑100 ein, um das klassische Tween langsam zu beginnen und gegen Ende der Animation zu beschleunigen.

    • Geben Sie einen positiven Wert zwischen 1 und 100 ein, um das klassische Tween schnell zu beginnen und gegen Ende der Animation zu verlangsamen.

    • Um eine komplexere Änderung der Geschwindigkeit innerhalb des Tween-Bereichs zu erzeugen, klicken Sie neben dem Feld „Beschleunigung“ auf die Schaltfläche „Bearbeiten“. Daraufhin wird das Dialogfeld Benutzerdefinierte Beschleunigung geöffnet.

      In der Standardeinstellung ist die Änderungsrate für Zwischenbilder konstant. Wenn Sie jedoch die Beschleunigungsfunktion verwenden, wirkt die Animationen in vielen Fällen natürlicher, da das animierte Objekt allmählich in Bewegung gesetzt und abgebremst wird.

  8. Um das ausgewählte Element während des Tweens zu drehen, wählen Sie eine Option aus dem Menü „Drehen“ im Eigenschafteninspektor aus:
    • Wählen Sie „Keine“ (Standardeinstellung), um das Element nicht zu drehen.

    • Wählen Sie „Automatisch“, um das Objekt einmal in die Richtung zu drehen, die die geringste Bewegung erfordert.

    • Wählen Sie „Nach rechts“ oder „Nach links“, um die Drehrichtung des Objekts festzulegen, und geben Sie die gewünschte Anzahl der Umdrehungen ein.

     Die an dieser Stelle definierte Drehung erfolgt zusätzlich zu der Drehung, die Sie in Schritt 4 auf das Objekt im Endbild angewendet haben.

  9. Wenn Sie einen Bewegungspfad verwenden, wählen Sie im Eigenschafteninspektor „An Pfad ausrichten“, um die Position des getweenten Elements am Bewegungspfad auszurichten.
  10. Wählen Sie im Eigenschafteninspektor die Option Synchronisation, um die Animation einer Grafiksymbolinstanz mit der Hauptzeitleiste zu synchronisieren.

     Die Optionen „Symbole synchronisieren“ und „Synchronisation“ bewirken, dass die Anzahl der Bilder in einer Tween-Animation an die Anzahl der für die Animation vorgesehenen Einzelbilder angepasst wird. Verwenden Sie die Option „Synchronisation“, wenn die Bilder in einer Animationssequenz kein gerades Vielfaches der Anzahl der Einzelbilder in der grafischen Instanz sind.

  11. Wenn Sie einen Bewegungspfad verwenden, wählen Sie Ausrichten, um den Registrierungspunkt des getweenten Elements an seinem Bewegungspfad auszurichten.

Erwecken Sie die Zeichen mit Classic Tweening zum Leben

Zeichen werden durch Classic Tweening lebendig. Möchten Sie Ihren Animationen Leben einhauchen? Sehen Sie sich einfach das Tutorial am Ende dieses Beispiels an und befolgen Sie die Schritte:

  1. Wählen Sie das Objekt aus und klicken Sie auf Ändern.

  2. Wählen Sie In Symbol konvertieren... und setzen Sie die folgenden Optionen:

    • Name: Geben Sie den Namen des Symbols ein.
    • Typ: Wählen Sie in der Dropdown-Liste Grafik aus.
  3. Klicken Sie auf OK und wählen Sie das Werkzeug Freie Transformation aus.

  4. Ziehen Sie den weißen Punkt in der Mitte, wenn Sie das Objekt verzerren wollen.

  5. Klicken Sie mit der rechten Maustaste auf den Rahmen und wählen Sie Classic Tween erstellen.

So erwecken Sie Ihre Zeichen mit Classic Tweening zum Leben

Sehen Sie sich das Video an, um zu erfahren, wie Sie eine Bewegung zur Animation erstellen.

Arbeiten mit als XML-Dateien gespeicherten klassischen Tweens

In Animate können Sie mit klassischen Tweens als XML-Dateien arbeiten. Animate ermöglicht Ihnen nativ, die folgenden Befehle auf beliebige klassische Tweens anzuwenden:

  • Bewegung als XML kopieren

  • Bewegungs-XML exportieren

  • Bewegungs-XML importieren

Bewegung als XML kopieren

Ermöglicht Ihnen das Kopieren von Bewegungseigenschaften, die in einem bestimmten Frame auf ein beliebiges Objekt auf der Bühne angewendet werden. 

  1. Erstellen Sie ein klassisches Tween.

  2. Wählen Sie einen beliebigen Keyframe auf der Zeitleiste aus.

  3. Gehen Sie zu Befehle > Bewegung als XML kopieren.

Die Bewegungseigenschaften werden als XML-Daten in die Zwischenablage kopiert. Sie können die XML-Datei anschließend mit einem beliebigen Text-Editor bearbeiten.

Bewegungs-XML exportieren

Ermöglicht Ihnen den Export von Bewegungseigenschaften, die auf ein beliebiges Objekt auf der Bühne angewendet werden, in eine XML-Datei, die gespeichert werden kann.

 

  1. Erstellen Sie ein klassisches Tween. 

  2. Gehen Sie zu Befehle > Bewegungs-XML exportieren.

  3. Wählen Sie das Verzeichnis, in dem die Datei gespeichert werden soll.

  4. Geben Sie einen Namen für die XML-Datei ein und klicken Sie auf Speichern.

    Das klassische Tween wird im angegebenen Verzeichnis als XML-Datei gespeichert.

Bewegungs-XML importieren

Ermöglicht Ihnen den Import einer vorhandenen XML-Datei, in der Bewegungseigenschaften definiert sind.

  1. Markieren Sie auf der Bühne ein Objekt.

  2. Gehen Sie zu Befehle > Bewegungs-XML importieren.

  3. Gehen Sie zum entsprechenden Speicherort und wählen Sie die XML-Datei aus. Klicken Sie auf OK.

  4. Wählen Sie im Dialogfeld Spezielle Bewegung einfügen die Eigenschaften aus, die auf das ausgewählte Objekt angewendet werden sollen.

  5. Klicken Sie auf OK.

Erstellen von Pfadebenen

Mithilfe einer besonderen Art der Führungsebene, der so genannten Pfadebene, lassen sich auch die Bewegungen der Objekte in einer klassischen Tween-Animation steuern.

Es ist nicht möglich, eine Bewegungs-Tween-Ebene oder eine Inverse-Kinematics Posenebene auf eine Führungsebene zu ziehen.

  1. Ziehen Sie stattdessen eine normale Ebene auf eine Führungsebene. Dadurch wird die Führungsebene in eine Pfadebene umgewandelt und die normale Ebene wird mit der neuen Pfadebene verknüpft.

     Um ein versehentliches Umwandeln zu verhindern, empfiehlt es sich daher, die Führungsebenen ganz unten in der Zeitleiste anzuordnen.

Erstellen klassischer Tween-Animationen entlang einem Pfad

 In diesem Thema geht es um den Einsatz älterer klassischer Tween-Animationen. Weitere Informationen zum Verwenden neuerer Bewegungs-Tweens finden Sie unter Bearbeiten des Bewegungspfades einer Tween-Animation.

Mithilfe von Pfadebenen können Sie Pfade festlegen, die die Bewegung getweenter Instanzen, Gruppen oder Textblöcke während der Animation bestimmen. Wenn mehrere Objekte demselben Pfad folgen sollen, können Sie auch mehrere Ebenen mit einer Pfadebene verknüpfen. Eine normale Ebene, die Sie mit einer Pfadebene verknüpfen, wird als geführte Ebene bezeichnet.

Bewegungspfad
In diesem Beispiel sind zwei Objekte auf verschiedenen Ebenen demselben Bewegungspfad zugeordnet.

Erstellen eines Bewegungspfades für eine klassische getweente Animation

  1. Erstellen Sie eine klassische getweente Animationssequenz.

    Wenn Sie im Eigenschafteninspektor die Option An Pfad ausrichten wählen, wird die Position des getweenten Elements am Bewegungspfad ausgerichtet. Wenn Sie die Option „Ausrichten“ wählen, wird der Registrierungspunkt des getweenten Elements am Bewegungspfad ausgerichtet.

  2. Klicken Sie mit der rechten Maustaste (Windows) bzw. bei gedrückter Control-Taste (Macintosh) auf den Namen der Ebene, die das klassische Tween enthält, und wählen Sie „Klassischen Pfad hinzufügen“.

    Animate fügt über der Ebene mit dem klassischen Tween eine Pfadebene hinzu und rückt den Namen der Ebene mit dem klassischen Tween ein. Damit wird angezeigt, dass sie an die Pfadebene gebunden ist.

     Wenn Sie in der Zeitleiste bereits eine Führungsebene haben, können Sie eine Ebene, die das klassische Tween enthält, unter die Führungsebene ziehen. Dadurch wird die Führungsebene in einen Bewegungspfad umgewandelt und an das klassische Tween gebunden.

    Pfadebene
    Eine Pfadebene über der Ebene, die das klassische Tween enthält.

  3. Um der Pfadebene einen Pfad hinzuzufügen, wählen Sie die Pfadebene aus und verwenden Sie das Stift-, Freihand-, Linien, Kreis-, Rechteck- oder Sprühen-Werkzeug.

    Sie können auch einen Strich auf der Pfadebene einfügen.

  4. Ziehen Sie das Objekt, das Sie tweenen, um es mit dem Anfang des ersten Bildes oder dem Ende des letzten Bildes auszurichten.

    Eine Grafik, die am Anfang eines Führungsstrichs ausgerichtet ist
    Die Grafik eines Autos, die am Anfang eines Führungsstrichs ausgerichtet ist.

     Das beste Ergebnis erzielen Sie hierbei, wenn Sie das Symbol an seinem Transformationspunkt auf den Pfad ziehen.

  5. Um die Pfadebene und den Pfad auszublenden, klicken Sie auf der Pfadebene in die Spalte mit dem Augensymbol. In diesem Fall sind beim Arbeiten nur die Bewegungen des Objekts sichtbar. 

    Die Gruppe oder das Symbol folgt während der Wiedergabe der Animation exakt dem von Ihnen festgelegten Pfad.

Weitere Informationen zu auf variabler Strichbreite und Strichfarbe basierenden Animationsleitlinien finden Sie unter Animationsleitlinie.

  1. Führen Sie einen der folgenden Schritte aus:
    • Ziehen Sie eine vorhandene Ebene unter die Pfadebene. Die Ebene wird unter der Pfadebene eingerückt dargestellt. Alle Objekte auf dieser Ebene werden automatisch am Bewegungspfad ausgerichtet.

    • Erstellen Sie eine Ebene unterhalb der Pfadebene. Objekte, die Sie auf dieser Ebene tweenen, werden automatisch am Bewegungspfad ausgerichtet.

    • Wählen Sie eine Ebene unter einer Pfadebene aus. Wählen Sie Modifizieren > Zeitleiste > Ebeneneigenschaften und dann Führungsebene.

  1. Zum Aufheben der Verknüpfungen wählen Sie die Ebene aus und führen Sie einen der folgenden Schritte durch:

    • Ziehen Sie die Ebene in der Zeitleiste an eine Position oberhalb der Pfadebene.

    • Wählen Sie Modifizieren > Zeitleiste > Ebeneneigenschaften und dann Normal als Ebenentyp.

Einfügen von Eigenschaften klassischer Tween-Animationen

 In diesem Thema geht es um das Einfügen von Eigenschaften älterer klassischer Tweens. Weitere Informationen zum Einfügen von Eigenschaften neuerer Bewegungs-Tweens finden Sie unter Kopieren und Einfügen von Bewegungs-Tween-Eigenschaften.

Mit dem Befehl „Bewegung kopieren“ können Sie klassische Tweens kopieren und bestimmte ausgewählte Eigenschaften auf ein anderes Objekt übertragen.

  1. Markieren Sie in der Zeitleiste die Bilder, die das zu kopierende klassische Tween enthalten. Die markierten Bilder müssen auf einer Ebene liegen. Sie brauchen aber kein einzelnes klassisches Tween zu umfassen. Sie können vielmehr ein vollständiges Tween oder auch mehrere leere Bilder bzw. mehrere Tweens markieren.
  2. Wählen Sie Bearbeiten > Zeitleiste > Bewegung kopieren.

  3. Um das klassische Tween zu kopieren, wählen Sie die Symbolinstanz aus.

  4. Wählen Sie Bearbeiten > Zeitleiste > Spezielle Bewegung einfügen. Wählen Sie nun die speziellen Eigenschaften des klassischen Tweens aus, die in die Symbolinstanz eingefügt werden sollen. Klassische Tweens haben die folgenden Eigenschaften:

    X-Position

    Gibt die Länge der Bewegung in der Horizontalen (X-Richtung) an.

    Y-Position

    Gibt die Länge der Bewegung in der Vertikalen (Y-Richtung) an.

    Horizontal skalieren

    Gibt das Verhältnis zwischen der aktuellen Größe des Objekts und seiner normalen Größe in horizontaler Richtung (X) an.

    Vertikal skalieren

    Gibt das Verhältnis zwischen der aktuellen Größe des Objekts und seiner normalen Größe in vertikaler Richtung (Y) an.

    Drehung und Neigung

    Die Drehung und Neigung des Objekts. Diese Eigenschaften müssen zusammen auf ein Objekt übertragen werden. Die Neigung wird dabei als Drehung in Grad verstanden. Rotation und Neigung beeinflussen sich gegenseitig.

    Farbe

    Alle Farbwerte wie Farbton, Helligkeit und Alpha werden auf das Objekt übertragen.

    Filter

    Alle Filterwerte und -änderungen des Auswahlbereichs. Wenn ein Filter auf ein Objekt angewendet wird, gelten alle seine Werte unverändert und der Status (aktiviert bzw. deaktiviert) wird vom neuen Objekt übernommen.

    Mischmodus

    Wendet den Mischmodus auf das neue Objekt an.

    Skalierungseigenschaften des Zielobjekts außer Kraft setzen

    Wenn diese Option deaktiviert ist, werden alle Eigenschaften relativ zum Zielobjekt eingefügt. Andernfalls setzt die Option die Skalierungseigenschaften des Zielobjekts außer Kraft.

    Drehung bzw. Neigung des Zielobjekts außer Kraft setzen

    Wenn diese Option deaktiviert ist, werden alle Eigenschaften relativ zum Zielobjekt eingefügt. Andernfalls setzen die eingefügten Eigenschaften die vorhandenen Drehungs- und Neigungseigenschaften des Objekts außer Kraft.

    Die erforderlichen Bild-, Tween- und Symbolinformationen werden dem ursprünglichen Tween entsprechend eingefügt.

    Wenn Sie das klassische Tween eines Symbols in das Bedienfeld „Aktionen“ kopieren oder in einem anderen Projekt als ActionScript-Code verwenden möchten, verwenden Sie hierzu den Befehl „Bewegung als ActionScript 3.0 kopieren“.

Erstellen von Beschleunigungsvorgaben

Beschleunigungsvorgaben sind vorkonfigurierte Beschleunigungen, die auf ein Objekt auf der Bühne angewendet werden können.

Eine Reihe häufig verwendeter Vorgaben ist für klassische Tweens verfügbar. Sie können die Vorgaben aus einer Liste auswählen und auf die gewünschte Eigenschaft anwenden.

  1. Klicken Sie in der Zeitleiste von Animate auf die Ebene, die ein Tween enthält.

  2. Um die Tweening-Eigenschaften zu öffnen, klicken Sie im Eigenschaftenbedienfeld auf die Kategorie Tweening. Über die Dropdown-Liste für den Beschleunigungstyp können Sie auf die Beschleunigungsoptionen für Eigenschaften zugreifen.

    Für klassische Tweens können Sie Beschleunigungsvorgaben entweder auf alle oder auf einzelne Eigenschaften anwenden. Im Eigenschaftenbedienfeld können Sie eine Beschleunigungsoption für Eigenschaften auswählen. Sie können jede Eigenschaft separat auswählen, um verschiedene Beschleunigungsvorgaben anzuwenden.

    Beschleunigungsvorgaben für Eigenschaften
    Beschleunigungsvorgaben für Eigenschaften

    Sie können individuelle Beschleunigungsvorgaben für Position, Drehung, Skalierung, Farbe und Filter klassischer Tweens auswählen. 

    Position Gibt die Beschleunigungseinstellungen für die Position eines animierten Objekts auf der Bühne an.

    Drehung Gibt die Beschleunigungseinstellungen für die Drehung eines animierten Objekts auf der Bühne an.

    Skalierung Gibt die Beschleunigungseinstellungen für die Skalierung eines animierten Objekts auf der Bühne an.

    Farbe Gibt die Beschleunigungseinstellungen für die Farbübergänge an, die auf ein animiertes Objekt auf der Bühne angewendet werden.

    Filter Gibt die Beschleunigungseinstellungen für die Filter an, die auf ein animiertes Objekt auf der Bühne angewendet werden.

  3. Alternativ dazu können Sie die Option Alle Eigenschaften gemeinsam auswählen, wenn Sie dieselbe Beschleunigung auf alle Tween-Eigenschaften anwenden möchten. Wählen Sie im Popupmenü für den Beschleunigungstyp eine Beschleunigungsvorgabe aus und doppelklicken Sie auf eine Vorgabe, um sie anzuwenden.

    Wenn Sie eine klassische Beschleunigung anwenden möchten, können Sie die Intensität der Beschleunigung zudem erhöhen oder reduzieren, indem Sie den Schieberegler verschieben. 

    Liste der Beschleunigungsvorgaben
    Liste der Beschleunigungsvorgaben

  4. Klicken Sie auf das Symbol „Bearbeiten“ neben Beschleunigung, um eine benutzerdefinierte Beschleunigung anzuwenden.

Wenn Sie den HTML5 Canvas-Dokumenttyp verwenden, können Sie eine optimierte JS-Ausgabedatei für Beschleunigungsvorgaben erhalten. HTML5 Canvas verwendet beim Erstellen einer Ausgabe die Beschleunigungsfunktionen des Tween-JS. 

Anwenden von benutzerdefinierter Beschleunigung auf klassische Tween-Animationen

 In diesem Thema geht es um das Hinzufügen von Beschleunigungen zu älteren klassischen Tweens. Weitere Informationen zum Hinzufügen von Beschleunigungen zu neueren Bewegungs-Tweens erhalten Sie unter Beschleunigen von Tween-Animationen.

Im Dialogfeld Benutzerdefinierte Beschleunigung wird eine Grafik angezeigt, die den Bewegungsgrad im Zeitverlauf darstellt. Die horizontale Achse stellt Bilder dar, und die vertikale Achse stellt den Veränderungsgrad dar. Das erste Schlüsselbild hat den Wert 0 %, das letzte Schlüsselbild den Wert 100 %.

Die Neigung der Diagrammkurve repräsentiert die Änderungsrate des Objekts. Wenn die Kurve horizontal (keine Neigung) ist, die die Geschwindigkeit Null. Wenn die Kurve vertikal ist, liegt eine sofortige Änderungsrate vor.

Speichern von benutzerdefinierten Beschleunigungen

Sie können die benutzerdefinierten Beschleunigungen durch Klicken auf eine Schaltfläche speichern und sie wiederverwenden, indem Sie sie aus der Liste der benutzerdefinierten Beschleunigungen auswählen. Klicken Sie nach Vornahme der Änderungen im Bearbeitungsmodus auf Speichern und anwenden. Der nachfolgende Screenshot zeigt die benutzerdefinierte Beschleunigungsvorgabe mit dem Titel MyEase1.

 Sie können benutzerdefinierte Beschleunigungsvorgaben nur innerhalb desselben Dokumenttyps wiederverwenden.

Sie können die Beschleunigungsvorgaben für mehrere Bereiche der Zeitleiste nutzen, indem Sie die entsprechenden Bereiche auswählen und die Beschleunigung darauf anwenden.

Weitere Steuerelemente im Dialogfeld „Benutzerdefinierte Beschleunigung“

Schaltflächen „Abspielen“ und „Stoppen“

Mit diesen Schaltflächen können Sie eine Vorschau der Animation auf der Bühne anzeigen, wobei alle zu diesem Zeitpunkt im Dialogfeld „Benutzerdefinierte Beschleunigung“ festgelegten Geschwindigkeitskurven angewendet werden.

Löschen

Löscht die aktuelle benutzerdefinierte Beschleunigung. 

Speichern und anwenden

Speichert die Änderungen, die Sie für die Beschleunigungsvorgaben vorgenommen haben, und wendet sie an. 

Schaltfläche „Zurücksetzen“

Mit dieser Schaltfläche können Sie die Geschwindigkeitskurve auf den standardmäßigen, linearen Zustand zurücksetzen.

Position des ausgewählten Steuerpunkts

Rechts unten im Dialogfeld werden mit einem numerischen Wert das Schlüsselbild und die Position des ausgewählten Steuerpunkts angezeigt. Ist kein Steuerpunkt ausgewählt, wird kein Wert angezeigt.

Klicken Sie einmal auf die Diagonale, um einen neuen Steuerungspunkt zur Linie hinzuzufügen. Sie können an den Positionen der Steuerungspunkte ziehen und dadurch eine sehr genaue Steuerung der Objektbewegung erzielen.

Anhand von Bildmarkierungen (in Form von quadratischen Griffen) können Sie durch Klicken angeben, an welcher Stelle ein Objekt verlangsamt oder beschleunigt werden soll. Durch Klicken auf den quadratischen Griff eines Steuerpunkts wird dieser Steuerpunkt ausgewählt und werden die Tangentenpunkte auf beiden Seiten angezeigt. Tangentenpunkte werden durch leere Kreise dargestellt. Um sie zu positionieren, ziehen Sie den Steuerpunkt oder seine Tangentenpunkte mit der Maus oder mithilfe der Pfeiltasten auf der Tastatur.

Tipp: Standardmäßig werden die Steuerpunkte an einem Raster ausgerichtet. Halten Sie die Taste X gedrückt und ziehen Sie am Steuerpunkt, um das Ausrichten am Raster zu deaktivieren.

Wenn Sie abseits anderer Steuerpunkte auf die Kurve klicken, wird ihr an dieser Stelle ein neuer Steuerpunkt hinzugefügt, ohne dass die Form der Kurve geändert wird. Durch Klicken abseits von Kurve und Steuerpunkten wird die Auswahl des momentan ausgewählten Steuerpunkts aufgehoben.

Hinzufügen von benutzerdefinierten Beschleunigungen

  1. Wählen Sie in der Zeitleiste eine Ebene aus, auf die ein klassisches Tween angewendet wurde.

  2. Klicken Sie im Eigenschafteninspektor neben dem Beschleunigungsschieberegler auf die Schaltfläche „Bearbeiten“.
  3. Klicken Sie bei gedrückter Strg-Taste (Windows) bzw. Befehlstaste (Macintosh) auf die Diagonale, um einen Steuerungspunkt hinzuzufügen.
  4. Ziehen Sie den Steuerungspunkt nach oben, um die Geschwindigkeit des Objekts zu erhöhen, oder ziehen Sie ihn nach unten, um die Geschwindigkeit des Objekts zu verringern.
  5. Ziehen Sie an den Scheitelpunkten, um die Kurve weiter anzupassen und den Beschleunigungswert des Tweens genauer festzulegen.
  6. Klicken Sie unten links auf die Schaltfläche „Abspielen“, um die Animation auf der Bühne anzuzeigen.

  7. Passen Sie die Steuerungen an, bis Sie den gewünschten Effekt erzielen.

 Wenn Sie das Dialogfeld „Benutzerdefinierte Beschleunigung“ verwenden, wird im Feld zum Bearbeiten „--“ angezeigt. Wenn Sie das Textfeld „Bearbeiten“ oder den Popupschieberegler verwenden, wird das Diagramm „Benutzerdefinierte Beschleunigung“ auf die entsprechende Kurve eingestellt und das Kontrollkästchen „Eine Einstellung für alle Eigenschaften verwenden“ wird markiert.

Kopieren und Einfügen einer Beschleunigungskurve

  • Drücken Sie Strg+C (Windows) bzw. Befehlstaste+C (Macintosh), um die aktuelle Beschleunigungskurve zu kopieren.

  • Drücken Sie Strg+V (Windows) bzw. Befehlstaste+V (Macintosh), um die kopierte Kurve in eine andere Kurve einzufügen.

    Sie können die Beschleunigungskurve kopieren und einfügen. Die kopierte Kurve bleibt so lange verfügbar, bis Sie die Animate-Anwendung schließen.

Nicht unterstützte Beschleunigungskurven

Bestimmte Arten von Beschleunigungskurven werden nicht unterstützt. Kein Teil des Diagramms kann eine nichtlineare Kurve (wie etwa ein Kreis) darstellen.

Das Dialogfeld „Benutzerdefiniertes Beschleunigung und Abbremsen“ verhindert automatisch, dass ein Steuerungspunkt oder ein Tangentengriff an eine Position verschoben wird, die zu einer unzulässigen Kurve führen würde.

  • Alle Punkte müssen innerhalb des Diagramms liegen. Steuerungspunkte dürfen nicht außerhalb des Diagramms liegen.

  • Alle Kurvensegmente müssen innerhalb des Diagramms liegen. Die Kurve wird abgeflacht, um zu verhindern, dass sie sich über das Diagramm hinaus erstreckt.

 Adobe

Schneller und einfacher Hilfe erhalten

Neuer Benutzer?

Adobe MAX 2024

Adobe MAX
Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX

Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX 2024

Adobe MAX
Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online

Adobe MAX

Die Konferenz für Kreative

14. bis 16. Oktober in Miami Beach und online