Handboek Annuleren

Vormen tweenen

Zoeken
  1. Adobe Animate-handboek
  2. Inleiding tot Animate
    1. Nieuw in Animate
    2. Visuele verklarende woordenlijst
    3. Systeemvereisten voor Animate
    4. Animate-sneltoetsen
    5. Werken met meerdere bestandstypen in Animate
  3. Animatie
    1. Grondbeginselen voor animaties in Animate
    2. Frames en hoofdframes gebruiken in Animate
    3. Frame-voor-frame-animaties in Animate
    4. Werken met klassieke tween-animaties in Animate
    5. De tool Penseel
    6. Hulplijnen voor bewegingen
    7. Bewegings-tween en ActionScript 3.0
    8. Informatie over animaties met bewegings-tween
    9. Animaties met bewegings-tweens
    10. Een animatie met bewegings-tween maken
    11. Eigenschapshoofdframes gebruiken
    12. Een positie animeren met een tween
    13. Bewegings-tweens bewerken in de Bewegingseditor
    14. Het bewegingspad van een tween-animatie bewerken
    15. Bewegings-tweens manipuleren
    16. Aangepaste versnellingen toevoegen
    17. Voorinstellingen voor beweging maken en toepassen
    18. Animatietween-reeksen instellen
    19. Werken met als XML-bestanden opgeslagen bewegings-tweens
    20. Bewegings-tweens en klassieke tweens
    21. Vormen tweenen
    22. De tool Bone-animatie gebruiken in Animate
    23. Werken met structuren voor personages in Animate
    24. Maskeerlagen gebruiken in Adobe Animate
    25. Werken met scènes in Animate
  4. Interactiviteit
    1. Knoppen maken met Animate
    2. Animate-projecten converteren naar andere documentindelingen
    3. HTML5 Canvas-documenten maken en publiceren in Animate
    4. Interactiviteit toevoegen met codefragmenten in Animate
    5. Aangepaste HTML5-componenten maken
    6. Componenten in HTML5 Canvas gebruiken
    7. Maken van aangepaste componenten: Voorbeelden
    8. Codefragmenten voor aangepaste componenten
    9. Tips en trucs: Adverteren met Animate
    10. Ontwerp en publicatie van virtual reality
  5. Werkruimte en workflow
    1. Penselen maken en beheren
    2. Google-lettertypen gebruiken in HTML5 Canvas-documenten
    3. Creative Cloud Libraries en Adobe Animate gebruiken
    4. Het werkgebied en het deelvenster Tools voor Animate gebruiken
    5. Workflow en werkruimte in Animate
    6. Weblettertypen gebruiken in HTML5 Canvas-documenten
    7. Tijdlijnen en ActionScript
    8. Werken met meerdere tijdlijnen
    9. Voorkeuren instellen
    10. Deelvensters voor ontwerp in Animate gebruiken
    11. Tijdlijnlagen maken met Animate
    12. Animaties exporteren voor mobiele apps en game-engines
    13. Objecten verplaatsen en kopiëren
    14. Sjablonen
    15. Zoeken en vervangen in Animate
    16. Ongedaan maken, Opnieuw en het deelvenster Historie
    17. Sneltoetsen
    18. De tijdlijn gebruiken in Animate
    19. HTML-extensies maken
    20. Optimalisatieopties voor afbeeldingen en geanimeerde GIF-bestanden
    21. Exportinstellingen voor afbeeldingen en GIF-bestanden
    22. Deelvenster Elementen in Animate
  6. Multimedia en video
    1. Grafische objecten transformeren en combineren in Animate
    2. Symboolinstanties maken in Animate en ermee werken
    3. Afbeeldingen overtrekken
    4. Geluid gebruiken in Adobe Animate
    5. SVG-bestanden exporteren
    6. Videobestanden maken voor gebruik in Animate
    7. Een video toevoegen in Animate
    8. Werken met videoactiepunten
    9. Objecten tekenen en maken met Animate
    10. Lijnen en vormen omvormen
    11. Streken, verlopen en vullingen met Animate CC
    12. Werken met Adobe Premiere Pro en After Effects
    13. Deelvensters voor kleuren in Animate CC
    14. Flash CS6-bestanden openen met Animate
    15. Werken met klassieke tekst in Animate
    16. Illustraties opnemen in Animate
    17. Geïmporteerde bitmaps in Animate
    18. 3D-afbeeldingen
    19. Werken met symbolen in Animate
    20. Lijnen en vormen tekenen met Adobe Animate
    21. Werken met bibliotheken in Animate
    22. Geluiden exporteren
    23. Objecten selecteren in Animate CC
    24. Werken met Illustrator AI-bestanden in Animate
    25. Patronen toepassen met het sproeipenseel
    26. Overvloeimodi toepassen
    27. Objecten rangschikken
    28. Taken automatiseren met het menu Opdrachten
    29. Meertalige tekst
    30. De camera gebruiken in Animate
    31. Animate gebruiken met Adobe Scout
    32. Werken met Fireworks-bestanden
    33. Grafische filters
    34. Geluid en ActionScript
    35. Tekenvoorkeuren
    36. Tekenen met de pen
  7. Platforms
    1. Animate-projecten converteren naar andere documentindelingen
    2. Ondersteuning voor aangepaste platforms
    3. HTML5 Canvas-documenten maken en publiceren in Animate
    4. Een WebGL-document maken en publiceren
    5. Toepassingen verpakken voor AIR voor iOS
    6. AIR voor Android-toepassingen publiceren
    7. Publiceren voor Adobe AIR voor desktop
    8. Publicatie-instellingen voor ActionScript
    9. Tips en trucs: ActionScript organiseren in een toepassing
    10. ActionScript gebruiken met Animate
    11. Tips en trucs: Richtlijnen voor toegankelijkheid
    12. Toegankelijkheid in de Animate-werkruimte
    13. Scripts schrijven en beheren
    14. Ondersteuning voor aangepaste platforms inschakelen
    15. Overzicht van ondersteuning voor aangepaste platforms
    16. Toegankelijke inhoud maken
    17. Werken met plug-in voor ondersteuning voor aangepaste platforms
    18. Foutopsporing in ActionScript 3.0
    19. Ondersteuning voor aangepaste platforms inschakelen
  8. Exporteren en publiceren
    1. Bestanden exporteren uit Animate CC
    2. OAM-publicatie
    3. SVG-bestanden exporteren
    4. Afbeeldingen en video's exporteren met Animate
    5. AS3-documenten publiceren
    6. Animaties exporteren voor mobiele apps en game-engines
    7. Geluiden exporteren
    8. QuickTime-videobestanden exporteren
    9. Afspelen van externe video met ActionScript beheren
    10. Tips en trucs: Tips voor het maken van inhoud voor mobiele apparaten
    11. Tips en trucs: Videoconventies
    12. Tips en trucs: Richtlijnen voor het ontwerpen van SWF-toepassingen
    13. Tips en trucs: Structuur geven aan FLA-bestanden
    14. Beste werkwijzen voor het optimaliseren van FLA-bestanden voor Animate
    15. Publicatie-instellingen voor ActionScript
    16. Publicatie-instellingen opgeven voor Animate
    17. Projectorbestanden exporteren
    18. Afbeeldingen en geanimeerde GIF-bestanden exporteren
    19. HTML-publicatiesjablonen
    20. Werken met Adobe Premiere Pro en After Effects
    21. Snel uw animaties delen en publiceren

Bij vorm-tweening tekent u een vectorvorm in een specifiek frame in de tijdlijn en wijzigt u deze vorm of tekent u een andere vorm in een ander specifiek frame. Animate interpoleert vervolgens de tussenliggende vormen in de tussenliggende frames, waardoor een animatie ontstaat waarbij één vorm overvloeit in een andere.

Met Animate kunt u vorm-tweens toevoegen aan uniforme effen streken en aan niet-uniforme streken met details. U kunt ook vorm-tweens toevoegen aan streken die zijn verbeterd met het gereedschap Variabele breedte. Experimenteer met de vormen die u wilt gebruiken om te controleren wat het resultaat is. U kunt ook vormhints gebruiken om Animate te laten weten welke punten op de beginvorm overeenstemmen met specifieke punten in de eindvorm.

U kunt ook de positie en de kleur van vormen in een vorm-tween tweenen.

Wanneer u vorm-tweening wilt toepassen op groepen, instanties of bitmapafbeeldingen, moet u deze elementen splitsen. Wanneer u vorm-tweening wilt toepassen op tekst, moet u de tekst tweemaal splitsen om deze om te zetten in objecten. Zie Een symboolinstantie opsplitsen.

Een vorm-tween maken

In de volgende stappen wordt beschreven hoe u een vorm-tween maakt van frame 1 tot en met frame 30 van de tijdlijn. U kunt tweens echter in elk gewenst deel van de tijdlijn maken.

  1. Teken in frame 1 een vierkantje met het gereedschap Rechthoek.

  2. Selecteer frame 30 van dezelfde laag en voeg een leeg hoofdframe toe door Invoegen > Tijdlijn > Leeg hoofdframe te selecteren of door op F7 te drukken.

  3. Teken in het werkgebied een cirkel met het gereedschap Ovaal in frame 30.

    Nu hebt u een hoofdframe in frame 1 met een vierkantje en een hoofdframe in frame 30 met een cirkel.

  4. Selecteer in de tijdlijn een van de frames tussen de twee hoofdframes in de laag met de twee vormen.

  5. Kies Invoegen > Vorm-tween.

    Animate interpoleert de vormen in alle frames tussen de twee hoofdframes.

  6. Als u een voorbeeld van de tween wilt bekijken, sleept u de afspeelkop over de frames in de tijdlijn of drukt u op Enter.

  7. Als u naast vorm ook beweging wilt tweenen, verplaatst u de vorm in frame 30 naar een andere locatie vanaf frame 1.

    Bekijk een voorbeeld van de animatie door op Enter te drukken.

  8. Als u de kleur van de vorm wilt tweenen, geeft u de vorm in frame 1 een andere kleur dan de vorm in frame 30.

  9. Als u versnelling wilt toevoegen aan de tween, selecteert u een van de frames en voert u een waarde in het veld Versnelling in Eigenschapcontrole in.

    Voer een negatieve waarde in om de versnelling toe te passen op het begin van de tween. Voer een positieve waarde in om de versnelling toe te passen op het einde van de tween.

Voorinstellingen voor versnellingen of aangepaste versnellingen maken

Voorinstellingen zijn vooraf geconfigureerde versnellingen die u op een object in het werkgebied kunt toepassen.

Een set met veelgebruikte versnellingsvoorinstellingen is beschikbaar voor vorm-tweens. Kies een voorinstelling uit de lijst met voorinstellingen en pas deze toe op de geselecteerde eigenschap. U kunt ook een aangepaste versnelling toepassen op een vorm-tween.

  1. Klik op de laag met een vorm-tween in de tijdlijn van Animate.

  2. Als u de tweeningseigenschappen wilt openen, klikt u op de categorie Tweenen in het deelvenster met eigenschappen.

    Eigenschappen voor tweening
    Eigenschappen voor tweening

  3. Selecteer de gewenste voorinstelling voor versnellen in het pop-upvenster Type versnelling. Dubbelklik op het type voorinstelling dat u wilt toepassen. 

    Als u ervoor kiest om de klassieke versnelling toe te passen, kunt u ook de intensiteit van de versnelling verhogen of verlagen door de schuifregelaar te verplaatsen. 

    Verschillende typen versnellingsvoorinstellingen
    Verschillende typen versnellingsvoorinstellingen

  4. Klik op het pictogram Bewerken naast Versnelling om een aangepaste versnelling toe te passen. 

    In het dialoogvenster Aangepaste versnelling wordt een grafiek weergegeven waarin de mate van beweging in de loop van de tijd wordt aangegeven. De horizontale as vertegenwoordigt frames en de verticale as het percentage wijzigingen. Het eerste hoofdframe wordt voorgesteld als 0% en het laatste hoofdframe als 100%.

    De helling van de curve van de grafiek geeft de wijzigingsfrequentie van het object aan. Wanneer de curve horizontaal loopt (geen helling heeft), is de snelheid nul. Wanneer de curve verticaal loopt, vindt een ogenblikkelijke wijzigingsfrequentie plaats.

    Grafiek Aangepaste versnelling waarin de constante snelheid wordt weergegeven
    Grafiek Aangepaste versnelling waarin de constante snelheid wordt weergegeven. Open dit dialoogvenster door een frame te selecteren in een vorm-tween en op de knop Bewerken te klikken in het gedeelte Versnelling in Eigenschapcontrole.

    U kunt een aangepaste versnelling opslaan en opnieuw gebruiken door deze te kiezen in de lijst Aangepast. Klik in de bewerkmodus op de knop Opslaan en toepassen nadat u de wijzigingen hebt doorgevoerd. In de onderstaande afbeelding vindt u de aangepaste versnellingsvoorinstelling met de naam MyEase1.

    Aangepaste versnellingsvoorinstelling
    Aangepaste versnellingsvoorinstelling

    U kunt versnellingsvoorinstellingen toepassen op meerdere reeksen in de tijdlijn door de betreffende reeksen te selecteren en de versnelling toe te passen.

    Versnellingsvoorinstelling voor meerdere reeksen
    Versnellingsvoorinstelling toepassen voor meerdere reeksen

Vormwijzigingen beheren met vormhints

Voor complexere of onwaarschijnlijke vormwijzigingen kunt u vormhints gebruiken. Vormhints identificeren punten die overeenkomen in de begin- en eindvormen. Wanneer u bijvoorbeeld een tekening van een gezicht tweent terwijl de gezichtsuitdrukking verandert, kunt u een vormhint gebruiken om elk van beide ogen te markeren. Vervolgens blijft elk van beide ogen herkenbaar en worden de ogen afzonderlijk gewijzigd tijdens het proces, zodat het gezicht zijn vorm behoudt.

Vormhints als letters
Vormhints als letters

Vormhints bevatten letters (a tot en met z) die aangeven welke punten overeenkomen in de begin- en eindvorm. U kunt maximaal 26 vormhints gebruiken.

Vormhints zijn geel in een beginhoofdframe, groen in een eindhoofdframe en rood wanneer zij zich niet op een curve bevinden.

Houd u aan de volgende richtlijnen voor het beste resultaat bij het tweenen van vormen:

  • Bij complexe vorm-tweening maakt u tussenvormen en tweent u deze in plaats van alleen een begin- en eindvorm te definiëren.

  • Zorg ervoor dat vormhints logisch zijn. Wanneer u bijvoorbeeld drie vormhints gebruikt voor een driehoek, moeten deze op de driehoek die u tweent dezelfde volgorde hebben als op de oorspronkelijke driehoek. De volgorde kan niet a,b,c zijn in het eerste hoofdframe en a,c,b in het tweede.

  • Vormhints werken het best wanneer u deze in linksdraaiende volgorde plaatst, te beginnen bij de linkerbovenhoek van de vorm.

Vormhints gebruiken

  1. Selecteer het eerste hoofdframe in een vorm-getweende reeks.

  2. Selecteer Wijzigen > Vorm > Vormhint toevoegen. De beginvormhint wordt ergens in de vorm weergeven als een rode cirkel met de letter a.

  3. Verplaats de vormhint naar een punt dat u wilt markeren.

  4. Selecteer het laatste hoofdframe in de tweening-reeks. De eindvormhint wordt weergeven als een groene cirkel met de letter a ergens in de vorm.

  5. Verplaats de vormhint naar het punt in de eindvorm dat overeenkomt met het eerste punt dat u hebt gemarkeerd.

  6. Speel de animatie opnieuw af om weer te geven hoe de vorm-tweening is gewijzigd door de vormhints. Verplaats de vormhints om de tweening nauwkeurig af te stemmen.

  7. Herhaal dit proces als u meer vormhints wilt toevoegen. Nieuwe hints worden weergegeven met opeenvolgende letters (b, c, enzovoort).

Alle vormhints weergeven

  1. Selecteer Weergave > Vormhints weergeven. Vormhints weergeven is alleen beschikbaar wanneer de laag en het hoofdframe die vormhints bevatten actief zijn.

Een vormhint verwijderen

  1. Sleep de vormhint van het werkgebied af.

Alle vormhints verwijderen

  1. Selecteer Wijzigen > Vorm > Alle hints verwijderen.

Vorm-tweens toevoegen aan streken met variabele breedte

Met Animate kunt u vorm-tweens toevoegen aan streken met variabele breedte. Voorheen kon u in Animate alleen vorm-tweens maken voor effen, uniforme streken en vormen. Ontwerpers konden dus geen vorm-tweens maken voor niet-uniforme streken, zoals streken die zijn verbeterd met het gereedschap Variabele breedte. Nu het mogelijk is om streken met variabele breedte te tweenen, biedt Animate veel meer ontwerpmogelijkheden.

Het toevoegen van vorm-tweens aan gedetailleerde streken is hetzelfde als het tweenen van een vorm of van een effen, uniforme streek. U dient de begin- en eindvorm van de tween te definiëren, waarna Animate de tussenliggende frames van de tween maakt.

Het gereedschap Variabele breedte

Met het gereedschap Variabele breedte kunt u van uniforme, effen streken mooie, gedetailleerde streken maken. Zie Lijnen en vormen verbeteren met het gereedschap Variabele breedte voor informatie over hoe u streken kunt verbeteren met het gereedschap Variabele breedte.

Een vorm-tween toevoegen aan streken met variabele breedte

  1. In Animate CC tekent u een lijn met het gereedschap Lijn.

    Lijn met een ingestelde streekwaarde van twee pixels
    Een lijn die in het werkgebied is getekend met het gereedschap Lijn, met een ingestelde streekwaarde van twee pixels.

  2. Gebruik het gereedschap Variabele breedte om midden in de streek breedte toe te voegen (zie de onderstaande illustratie). Zie Lijnen verbeteren met het gereedschap Variabele breedte voor informatie over het gebruik van het gereedschap Variabele breedte.

    Streek met variabele breedte met een waarde van 68,0 pixels
    Streek met variabele breedte, gemaakt met het gereedschap Variabele breedte en met een streekwaarde van 68,0 pixels.

  3. Selecteer een ander frame op de tijdlijn, zoals frame 30, en maak de uiteindelijke vorm van de streek voor uw tween.

    Uiteindelijke vorm die is toegevoegd aan het laatste hoofdframe van de vorm-tween
    Uiteindelijke vorm die is toegevoegd aan het laatste hoofdframe van de vorm-tween.

  4. Klik met de rechtermuisknop op een willekeurig frame tussen 1 en 30, en selecteer Vorm-tween maken.

Vorm-tweens toevoegen aan variabele breedteprofielen

U kunt in Animate ook vorm-tweens toevoegen aan gedetailleerde streken die zijn opgeslagen als variabele breedteprofielen. U kunt breedteprofielen toepassen op de begin- en eindvormen van een tween, zodat in Animate een vloeiende vorm-tween wordt gemaakt.

Breedteprofielen zijn gedetailleerde streken die zijn gemaakt en opgeslagen met het gereedschap Variabele breedte, zodat ze gemakkelijk opnieuw kunnen worden gebruikt. Zie Breedteprofielen opslaan voor meer informatie over breedteprofielen.

Ga als volgt te werk om vorm-tweens toe te voegen aan variabele breedteprofielen:

  1. Teken in Animate met het gereedschap Lijn een lijn in het werkgebied.

    Lijn met een waarde van twee pixels
    Een lijn die in het werkgebied is getekend met het gereedschap Lijn, met een ingestelde streekwaarde van twee pixels.

  2. Selecteer in het vervolgmenu Breedte in Eigenschapcontrole een breedteprofiel en pas dit toe.

    Variabele breedte met een streekwaarde van 68,0 pixels
    Streek met variabele breedte, gemaakt met het gereedschap Variabele breedte en met een streekwaarde van 68,0 pixels.

  3. Selecteer een ander frame in de tijdlijn, bijvoorbeeld frame 30, en selecteer het gewenste breedteprofiel in het vervolgmenu Breedte in Eigenschapcontrole.

  4. Als u een vorm-tween wilt toevoegen aan de geselecteerde breedteprofielen, klikt u met de rechtermuisknop op een willekeurig frame tussen 1 en 30 en selecteert u Vorm-tween maken.

Adobe-logo

Aanmelden bij je account

Snelle koppelingen

Al je lidmaatschappen weergeven Je lidmaatschappen beheren

Juridische kennisgevingen    |    Online privacybeleid