Over easing

Met easing kunt u de versnelling of vertraging van een animatie-overgang wijzigen. Google Web Designer biedt u 5 standaard easing-functies die zijn gedefinieerd in de CSS3-specificatie. Daarnaast beschikt u over stapovergangen en een optie voor aangepaste easings in de geavanceerde modus.

Opmerking: Er zijn verschillende easing-opties beschikbaar voor teksteffecten.

Easing in de snelle modus

In de snelle modus is dezelfde easing van toepassing op alle elementen met animaties tussen thumbnails.

Als u easing bewerkt in de geavanceerde modus, kan Gemengd worden weergegeven als type easing wanneer u overschakelt naar de snelle modus.

De easing wijzigen in de snelle modus:

1. Klik op de knop Opties voor sleutelframe  tussen de thumbnails.
2. De overgangseditor wordt geopend.
   

3. Klik in de overgangseditor op de pijlen om de standaardvoorinstellingen voor easings te doorlopen. U kunt ook de duur van de easing wijzigen door een tijd in seconden op te geven of door op het tijdveld te klikken en naar links of rechts te slepen.

Standaardvoorinstellingen voor easings

Voorinstelling voor easings	Beschrijving
Lineair	Animaties veranderen met een constante snelheid.
Afnemen	Animaties beginnen met een gemiddelde snelheid en worden aan het eind langzamer.
Afnemen naar buiten	Animaties beginnen snel en worden aan het eind langzamer.
Afnemen naar binnen	Animaties beginnen langzaam en eindigen snel.
Afnemen naar binnen/buiten	Animaties beginnen en eindigen langzaam, maar bewegen snel in het midden.
Stap-einde	Animaties blijven in de beginpositie gedurende de ease-tijd en springen vervolgens rechtstreeks naar de eindpositie.
Stap-begin	Animaties springen meteen naar de eindpositie.

Easing in de geavanceerde modus

In de geavanceerde modus heeft u extra opties voor easings:

• De easing wijzigen voor meerdere keyspans tegelijk.
• Een aangepaste easing opgeven.
• Een aangepaste easing opslaan als nieuwe voorinstelling zodat u deze gemakkelijk opnieuw kunt gebruiken voor andere keyspans.

Een easing wijzigen in de geavanceerde modus:

1. Klik met de rechtermuisknop op een keyspan met animatie waarvan u de easing wilt aanpassen. Als u meerdere easings tegelijk wilt bewerken, selecteert u opeenvolgende keyspans met Shift + klik of niet-opeenvolgende keyspans met Ctrl + klik (Windows) of Command + klik (Mac). Klik vervolgens met de rechtermuisknop op een van de geselecteerde keyspans. (Alleen de easings van keyspans met animaties worden aangepast.)

2. Selecteer een van de voorinstellingen voor easings in het pop-upmenu en selecteer Opties voor easing voor visualisaties van de easingcurven of om een aangepaste easing op te geven.

Een aangepaste easing maken:

1. Klik met de rechtermuisknop op een keyspan en selecteer Opties voor easing om het dialoogvenster Easing te openen.
2. Gebruik een van de volgende methoden om de easing te wijzigen:
   • Sleep de besturingsgrepen om de vorm van de easingcurve aan te passen. De hoek van de besturingsgreep bepaalt de steilheid van de curve en de lengte van de greep bepaalt de mate van versnelling of vertraging.
   • Geef in het veld Kubieke Bézier de functienotatie cubic-bezier() op van de gewenste Bézier-curve. Als u een ongeldige waarde opgeeft, wordt het veld rood onderstreept.
3. Optioneel: U kunt deze aangepaste easing opslaan als voorinstelling door op Opslaan als nieuwe voorinstelling te klikken.
4. Klik op Toepassen om deze aangepaste easing te gebruiken voor de geselecteerde keyspan of keyspans.
   

Aangepaste voorinstellingen voor easings

Als u een bepaalde aangepaste easing opnieuw wilt gebruiken voor meerdere keyspans, slaat u deze op als voorinstelling. Voorinstellingen bieden de volgende voordelen:

• Snelle toegang. De voorinstellingen voor easings worden vermeld als opties in het pop-upmenu wanneer u met de rechtermuisknop op een keyspan klikt.
• Eenvoudige identificatie. De namen van voorinstellingen worden weergegeven op de tijdlijn in de geavanceerde modus.

Aangepaste voorinstellingen worden opgeslagen voor uw persoonlijke exemplaar van Google Web Designer en kunnen worden gebruikt in verschillende documenten. Als u een document opent dat een aangepaste voorinstelling van een andere gebruiker bevat, wordt voor de easing aangegeven dat deze 'aangepast' is en wordt de naam van de voorinstelling niet gebruikt. De easingcurve zelf blijft ongewijzigd.

Als u een nieuwe aangepaste voorinstelling wilt opslaan, maakt u een aangepaste easing in het dialoogvenster 'Opties voor easing' en klikt u op Opslaan als nieuwe voorinstelling om deze een naam te geven. De namen en kubieke Bézier-curven van voorinstellingen moeten uniek zijn. Als bestaande keyspans dezelfde aangepaste waarde hebben, wordt bij die keyspans nu de naam van de aangepaste voorinstelling weergegeven.

Als u de naam van een aangepaste voorinstelling wilt wijzigen, dubbelklikt u erop. U kunt ook de muisaanwijzer op de voorinstelling plaatsen in het dialoogvenster Easing-opties en op het potloodje klikken dat naast de naam van de voorinstelling wordt weergegeven. Bewerk de naam en druk op Enter. Bij keyspans die deze voorinstelling gebruikten, wordt nu de nieuwe naam weergegeven.

Als u een aangepaste voorinstelling wilt verwijderen, plaatst u de muisaanwijzer erop in het dialoogvenster 'Opties voor easing' en klikt u op het prullenbakicoon dat naast de naam van de voorinstelling wordt weergegeven. Keyspans die deze voorinstelling gebruikten, blijven ongewijzigd, maar er wordt nu aangegeven dat ze 'aangepast' zijn.

U kunt de curve van een bestaande voorinstelling niet wijzigen. Maak in plaats daarvan een nieuwe aangepaste voorinstelling en pas deze toe op de keyspan of keyspans die u wilt wijzigen.