AE Kinetic Typography

Werkproces 2.1 Voorbereiden

• De student heeft kennis van beeldformaten/resolutie van video
• De student heeft kennis van pixelverhoudingen voor video
• De student gebruikt de juiste mappenstructuur en documentnamen
• De student heeft kennis van de Interface onderdelen en kan deze instellen op default

Werkproces 2.3 Maken

• De student heeft kennis van Timeline en Keyframes
• De student kan Effecten toepassen: position, opacity, rotation, size
• De student begrijpt Easing en kan dit toepassen
• De student kan werken met Maskers
• De student kan werken met null-objects

Werkproces 2.4 Opleveren

• De student kan werk Uitvoeren naar Media Encoder
• De student kan werk Hosten op Youtube of Ma server

Je wordt beoordeeld op de volgende punten:

• Je hebt alle stappen in de oefening uitgevoerd
• Je video is minimaal 10 seconden.
• Je animeert minimaal 15 woorden.
• De bewegingen in je video zijn voorzien van goede ‘easing’.
• De achter elkaar volgende elementen in je video zijn goed ‘getimed’.
• Je hebt gebruik gemaakt van een null-object en een masker
• Bonus: je hebt extra tijd gestoken in details (denk aan timing, animatie van woorden, effecten, etc).
• Bonus: je animatie sluit inhoudelijk aan op de quote.

Presentaties
Workflow en Video eigenschappen
Easing
Null objects
Effecten voorvertonen in Bridge

Organiseren
Als je meer wilt weten over hoe je mappen kunt organiseren in complexe projecten check dan deze pagina met tips: Get your shit together

After Effects workflow en terminologie (door Adobe Help)
Video van 15 minuten waarin de workflow wordt uitgelegd en een aantal basis termen en mogelijkheden.

Gebruik voor deze stap maximaal 30 minuten.

Zoals gezegd gaan we een quote animeren. Je hebt vast wel eens een animatie gezien van tekst die in beeld verschijnt op het geluid van een stem. Bekijk eerst het voorbeeld hieronder.

Zoek op internet naar een geluidsbestand (wav of mp3) van een quote die je leuk vindt. De geluidskwaliteit maakt voor nu niet uit. Let op: kies een quote welke tussen de 10 en 15 woorden bevat. Om je op weg te helpen hier alvast enkele bronnen:

• http://jbowen5150.tripod.com/index.html
• https://movie-sounds.org/
• http://www.moviewavs.com/
• http://www.jahozafat.com/

Om een geluidsbestand op te slaan rechtsklik je op de link naar het bestand en kies “Link opslaan als” (Chrome).

1. Start nu AE en maak een nieuw project aan (File > New > New Project).
2. Sleep het geluidsbestand in het deelvenster Project (linksboven).
3. Sleep vervolgens het geluidsbestand in het venster Timeline (onderin). Hierdoor wordt een nieuwe composition gemaakt met de lengte van het geluidsbestand.
4. Rechtsklik op de composition in het deelvenster Project en kies Composition Settings. Kies de onderstaande instellingen voor je composition, behalve de dus lengte (Duration), die laat je wat het is. Belangrijke waarden zijn het formaat (1280×720 pixels) en de framerate (30 fps).

Scroll naar boven en ga verder met stap 2.

Gebruik voor deze stap maximaal 60 minuten.

Open nu de laag van het geluidsbestand, open ‘audio’ en open ‘waveform’. Nu zie je onderstaande visuele weergave van het geluid. Elke piek is een woord (of een lettergreep) in je quote.

Bekijk onderstaand filmpje (4:41):

Plaats nu zelf de eerste paar woorden van jouw quote in je composition en time deze op de tekst.

Tip: je hoeft woorden niet netjes op een regel te zetten. Misschien wel juist niet. Doe er iets onverwachts mee.

Naarmate er meer woorden verschijnen wordt het op gegeven moment nodig om de camera te pannen (zijwaarts bewegen), te roteren of te zoomen. Hoe je dat kunt doen met een null-object zie je in dit filmpje (6:00):

Bouw verder aan de volgende paar woorden en gebruik de techniek met een null-layer die hierboven wordt uitgelegd.

Uitdaging: Denk tijdens het animeren aan de inhoud van je quote en de betekenis van de woorden. Kun je hier iets aan toevoegen met je animatie? Heel simpel voorbeeld: een woord als ‘koud’ kun je blauw maken of laten bibberen.

Ga nu door naar stap 3.

Gebruik voor deze stap maximaal 1 uur en 15 minuten.

Zorg ervoor dat je ook een aantal individuele woorden animeert. Bijvoorbeeld wanneer twee woorden botsen deuken ze even in, of een woord wordt langzaam groter dan een ander woord. Een animatie van een individueel woord zal met het null-object meebewegen.

Maak ook gebruik van maskers om letters achter vandaan te laten komen. Bekijk de volgende twee filmpjes (6:05 en 2:56):

Let op: in het eerste filmpje is de stap “masker maken” rond 1:05 weggevallen. Dit doe je door op de laag ‘Petey’ te rechtsklikken en Mask > New Mask te kiezen. Als je de laag openklapt zie je het masker er tussen staan.

Gebruik easing om de animaties soepeler te maken. Dit kun je doen door de keyframes te selecteren en met rechtsklik te kiezen voor Keyframe Assistent. Hier kun je kiezen uit verschillende opties voor easing.

Je kunt met de juiste keyframes geselecteerd ook klikken op de Graph Editor voor meer precieze controle:

Tip: Wanneer je animatie onbedoelde bewegingen begint te maken kan het zijn dat AE je probeert te ‘helpen’. Probeer in dit geval het volgende: selecteer de keyframes waar iets mee aan de hand is en rechtsklik > KeyFrame Interpolation. Zet hier Spatial Interpolation op Linear.

Maak de animatie af door alle woorden in je quote te animeren. Je wordt onder andere beoordeeld op detaillering, dus zorg dat je bewegingen mooi vloeiend zijn en goed getimed.

Wanneer je helemaal klaar bent, volg dan stap 4.

Gebruik voor deze stap maximaal 15 minuten.

Nu gaan we het filmpje exporteren. Hiervoor gebruikt After Effects de Media Encoder. Dit is een apart programma dat bijvoorbeeld ook de renderingen van Premiere doet.

1. Bepaal om te beginnen of alle timing wat jou betreft goed is. Pas zonodig je keyframes aan tot het allemaal is zoals je wilt.
2. Geef je compositie een naam door in het projectvenster je compositie aan te klikken en op Return te drukken.
3. Kies vervolgens File > Export > Add to Adobe Media Encoder Queue.

Nu wordt Media Encoder geladen. Dit kan even duren! Wanneer het venster geladen is duurt het ook nog eventjes voordat je filmpje in de renderlijst verschijnt.

4. Bekijk het volgende filmpje (van een andere oefening) en volg de stappen:

5. Maak nu een schermopname van je AE venster terwijl het hele filmpje daar afspeelt. Op een macbook doe je dit met Shift-Command-5. Zorg dat je timeline met zoveel mogelijk lagen zichtbaar is. Je mag tijdens de schermopname natuurlijk ook scrollen en/of bijvoorbeeld de Graph Editor openen om te laten zien wat je allemaal hebt gedaan.

Je hebt als het goed is nu een filmpje geëxporteerd in mp4 formaat en je hebt een schermopname van je AE venster. Ga verder met stap 5.

Gebruik voor deze stap maximaal 30 minuten.

Dit is het laatste deel: we gaan de video’s online zetten. De bedoeling is dat het filmpje en je schermopname als link (of embedded) wordt aangeboden in je portfolio. Nu is de vraag waar je dit wilt hosten (dus: op welke server).

Filmbestanden zijn al snel 50 Mb groot. Als je 10 van dit soort filmpjes op je Ma-server zet dan zal deze snel vol lopen en het niet meer doen. We gebruiken daarom Youtube.

Je hebt voor deze laatste stap een Google Account nodig. Als je dit nog niet hebt, zorg er dan voor dat je deze aanmaakt.

1. Ga naar Youtube en zorg dat je bij Google bent ingelogd. Je ziet rechtsboven het symbool hiernaast. Klik hier op en kies Upload Video.
2. Selecteer nu het bestand dat je wilt uploaden en klik OK.
3. Wacht tot het uploaden klaar is. Youtube gaat vervolgens “verwerken”. Dit kan ook enkele minuten duren.
4. Wanneer deze klaar is klik je op “Done” en kopieer de Url van de video.
5. Lever de link in bij je docent.
6. Herhaal dit voor de schermopname.