9 populaire cursussen over CSS-animaties

In de begintijd van het web werd animatie bekend om al die onhandige, complexe effecten die er misschien geweldig uitzagen, maar die traag werden geladen en vaak verwarrend om te gebruiken.

Maar wanneer het op de juiste manier wordt gebruikt, kan animatie een fantastisch hulpmiddel zijn voor webontwerpers in hun pakket. Kleine hoeveelheden subtiele, opvallende bewegingen zijn een geweldige manier om gebruikers te helpen bij het interpreteren van interfaces en om hun weg te vinden in uw site of app.

Ben je op de hoogte van de nieuwste technieken van webanimatie met behulp van CSS, JavaScript, easing, SVG's en speciale frameworks zoals het GreenSock Animation Platform?

Als dat niet het geval is, hoeft u zich geen zorgen te maken. Hier zijn negen cursussen die u alles leren wat u moet weten.

1. Praktische webanimatie

In deze cursus toont Envato Tuts + -instructeur Craig Campbell praktische manieren om animaties te maken voor knoppen, prijstabellen en andere webelementen, met behulp van beknopte CSS en jQuery om dit te doen.

 

2. GreenSock Animation Platform: eerste stappen

GreenSock is een JavaScript-framework dat het gemakkelijk maakt HTML-elementen te animeren. Tijdens deze cursus, zet je je eerste stappen in het leren gebruiken van dit krachtige framework. Zolang je kennis hebt van HTML en CSS, samen met een basiskennis van JavaScript, zul je uitgerust zijn met alles wat je nodig hebt om mee te doen.

 

3. Geavanceerde animatie met GSAP-plug-ins

Deze cursus is een ideale follow-up van de hierboven genoemde. In deze cursus gaat u verder dan de basisprincipes van GreenSock-animatie terwijl Envato Tuts + -instructeur Craig Campbell u meeneemt op een rondleiding langs de plug-ins die worden geleverd met GSAP.

 

4. Drie GreenSock-projecten: praktische animatie met GSAP

In de derde GSAP-cursus leidt Craig Campbell je door drie projecten waarin je leert hoe je programmatische animaties kunt maken, in realistische scenario's, met behulp van het GreenSock Animation Platform. Je leert hoe je een geanimeerde preloader, een SVG-logo-animatie en een aangepaste inhoudschuifregelaar maakt.

 

5. Animeren met Snap.svg

SVG is een krachtige manier om op vectoren gebaseerde afbeeldingen te maken die de grootte van de afbeelding vlekkeloos veranderen. In deze cursus leert u hoe u het Snap.svg JavaScript-framework gebruikt om eenvoudig uw SVG's te maken, beheren en animeren. 

 

6. Verruimen naar Cubic Bezier-functies

Eén manier om wat meer leven en een beetje meer persoonlijkheid in te blazen in animatie op het web, is door te experimenteren met verschillende versmellingsinstellingen. In deze snelle, tien minuten durende Coffee Break Course met Guy Routledge, leer je wat easing is, waarom het nuttig is, hoe je het kunt besturen en hoe je het kunt toepassen in de context van CSS.

 

7. Up en running met CSS-overgangen

In deze Coffee Break-cursus laat Craig Campbell je alles zien wat je moet weten om snel aan de slag te gaan met het maken van animaties met behulp van de CSS-overgangseigenschappen. In slechts tien minuten leert u hoe u beweging maakt met niet meer dan een paar CSS-eigenschappen.

 

8. Up en running met CSS Keyframe-animaties

Deze koffiepauzecursus leert je hoe je animaties maakt met behulp van de CSS keyframe en animatie-eigenschappen. In slechts tien minuten leert u hoe u animaties in de browser kunt maken zonder afhankelijk te zijn van externe plug-ins of uitgebreide programmering. 

 

9. Essentiële CSS-bibliotheken voor webontwerpers

In deze cursus leert u hoe u tien essentiële CSS-bibliotheken voor webontwerpers kunt gebruiken, die vandaag beschikbaar zijn. Je leert over resets, animaties, overgangen en typografiegerelateerde bibliotheken. Je leert met Adi Purdila, en je gebruikt Bower om je projecten te beheren, ervoor te zorgen dat alles up to date blijft en gemakkelijk te onderhouden is.

 

Bekijk nu elke cursus

U kunt direct een van onze cursussen volgen met een abonnement op Envato Elements. Voor een enkel laag maandelijks bedrag krijg je niet alleen toegang tot deze cursussen, maar ook tot onze groeiende bibliotheek van meer dan 1000 videocursussen en toonaangevende e-boeken over Envato Tuts+. 

Bovendien krijgt u nu onbeperkte downloads van de enorme Envato Elements-bibliotheek met meer dan 200.000 foto's en meer dan 26.000 ontwerpmaterialen en sjablonen. Creëer met unieke lettertypen, foto's, afbeeldingen en sjablonen en lever sneller betere projecten.