Innan vi dyker in i vår första animation, Bouncing Ball, vill jag först göra en teknisk utmaning: Texten ska rita sig själv, som om den hade skrivits för hand. Fig Leaf Rag har en vacker introduktion med accent i slutet, där vi kommer att placera utropstecknet.
Det finns flera metoder som kan vara mer eller mindre effektiva beroende på vilken situation vi har. Eftersom jag arbetar med en grafikplatta kommer jag att måla texten och visa er hur animationen fungerar. Men först ska jag visa er hur man också skulle kunna göra det, även om det inte är min favoritmetod:
Steg 1–10
Steg 1
Jag vill ta bort textlagret och istället ha en kompositionslager, en vanlig pixellager där jag kan måla. Texten ska vara inuti lagret. Så jag skapar en undre komposition med Ctrl+Shift+C eller genom Layer> Create Subcomposition. Detta kallar jag "Typo_Intro".
Steg 2
Alla attribut har tagits med, inklusive Turbulenta förskjutningar.
Eftersom jag inte vill ha detta, markerar jag Turbulenta förskjutningar, trycker på Ctrl+X och klistrar in allt i en komposition högre upp ("Fig Leaf Rag").
Steg 3
Låt oss gå tillbaka till "Typo_Intro"-kompositionen. Här har vi texten exponerad och kan animera allt.
Det första alternativet skulle vara genom Stigar. Jag tar Penna-verktyget och drar den första linjen av bokstaven A på texten. Sedan pausar jag och klickar någonstans i svart med Ctrl-tryckt tangent för att avsluta den nuvarande sökvägen, innan jag drar den andra linjen av A.
Jag pausar igen, klickar på svart med Ctrl-tryckt tangent och drar sedan nästa linje och fortsätter så tills hela texten är ritad.
Steg 4
Nu lägger jag till en effekt. Den hittas som Kontur i CC-versionen under Generera. I CS6 kallades den Linjeffekt.
Där väljer vi en mask eller kryssar i Endast masker och kan sedan låta dessa masker rita.
Steg 5
Jag döljer maskerna med denna lilla symbol och färgar sökvägen röd. Jag kan också ändra storleken, men bara globalt för alla masker.
Och när jag återigen visar maskerna kan jag fortfarande flytta och anpassa de enskilda punkterna, så att hela den vita texten nedan är täckt.
Steg 6
Här har jag en start- och slutregulator: Jag drar den från början till slut och kan låta hela texten rita sig.
Det fungerar mycket bra, men man har inte exakt kontroll. Man måste till exempel alltid använda samma linjetjocklek, så man kan inte rita tunnare och tjockare.
Därför vill jag även visa er en annan metod som enligt min åsikt går lite snabbare än att rita allt individuellt …
Steg 7
I det här fallet föredrar jag en något snabbare metod med Pensel.
Denna Pensel kan dock inte användas på textlager. Så vi måste återigen skapa en undre komposition och döpa den till "Typo_Statisch". I denna undre komposition kan vi sedan arbeta.
Steg 8
När vi vill använda penseln och dubbelklicka i penselläge öppnas flikarna och endast där kan vi arbeta med penseln.
Två nya paneler har också skapats: Pensel och Måla. I Pensel-panelen kan vi ställa in storlek, hårdhet etc. av penseln.
Och i Måla-panelen kan vi välja typ av målning. I Varaktighet står det först konstant, men jag ändrar det till Animera målning.
Jag sätter en streck och sedan en till och en till - men så fort jag har gjort en linje försvinner den märkligt nog.
Steg 9
När jag går tillbaka till den andra fliken och kör längs tidslinjen ser jag att alla linjer finns där och alla ritar automatiskt.
Steg 10
När man trycker på UU för alla förändrade egenskaper får vi nedan alla underegenskaper.
För var och en visas även början och slut.
Dessutom kan vi ändra avståndet, hårdheten och till och med positionen av varje linje - även efter att den har ritats.
Fortsätt enkelt: Steg 11–20
Steg 11
Jag raderar allt igen så att vi får bättre överblick.
Jag drar en ny linje och när du är i lageröversikten ser du sökvägen. Det är det som sparas.
Om den målade linjen inte gillar mig kan jag måla över den genom att välja den och sedan helt enkelt måla om den. Den kommer att uppdateras och bara skrivas över.
Steg 12
Precis som jag vill rita om texten eftersom det är det absolut snabbaste sättet att animera något.
Jag minskar alltså min diameter något och går över texten med grafikplattan och ritar in den här.
Steg 13
Jag har ritat alla linjer och om vi spelar upp hela i tidslinjen ser vi också att allt är där.
När jag trycker på U har vi alla nyckelbilder där igen.
Steg 14
När jag trycker på tangenten Ü förstoras fönstret som musen just far över. I det här fallet tidslinjen. På så sätt får jag mer plats och ser bättre vilka element som sticker ut. Jag drar tillbaka dem lite så att alla varar ungefär lika länge.
Steg 15
Låt oss låta det spela upp.
Förresten: Om du har råkat trycka på Caps Lock kommer inte After Effects att uppdatera längre. Då får du meddelandet Inaktivera Caps Lock för att uppdatera vyn.
När vi låter det spela upp börjar After Effects rita alla bokstäver samtidigt. Men det borde börja framifrån och gå bakåt. Och det är precis vad problemet är. För att få det så som jag vill måste jag tidpunkten för varje streck för hand - ett streck i taget. Det är en stor insats. Jag vill göra det snabbare.
I nästa steg förklarar jag för er exakt hur - men först markerar vi alla linjer.
Steg 16
Därför använder jag ett skript som skapar dessa nyckelbilder efter varandra.
Jag har skrivit detta skript själv och har naturligtvis lämnat det till er också. Ni hittar det i mappen Skripte med namnet Sekvensstreck. Den som känner till filmen "Sequence Layers from After Effects" kan ungefär föreställa sig vad detta skript gör.
Jag öppnar skriptet i Extend Script och kör det.
Steg 17
Nu har vi i princip en trappa av nyckelbilder och texten ritas steg för steg. Men fortfarande väldigt långsamt.
Vi måste accelerera det. För det väljer vi allt, tar den sista nyckelbilden vi hittar, trycker på Alt- tangenten och drar den till 5 sekunder.
Då går det mycket snabbare.
Sista punkten måste fördröjas lite till, men det ska vi ta hand om strax.
Steg 18
Jag vill också prata om värdet förskjutning. Det påverkar övergångarna mellan nyckelbilderna:
Om vi tittar på nyckelbildens övergångar just nu börjar den nästa alltid exakt där den föregående slutar (a).
Om jag inte vill detta och till exempel skulle föredra två ramar paus mellan två streck, skulle jag ange en 2 för förskjutning.
Naturligtvis måste jag välja alla penslar igen innan jag kan aktivera skriptet. Med Strg+A kan jag välja alla på en gång.
Eller om jag vill att ramarna ska överlappa varandra, ställer jag in värdet -2 på förskjutning. Då skulle den alltid gå två ramar bakom de faktiska. Om man dock har förkortat det så snabbt som vi har gjort här, skulle det inte göra någon mening. Jag är nöjd med 2 och lämnar det där.
Steg 19
Vad jag definitivt vill ändra är timingen på utropstecknet. Jag vill gärna anpassa det bättre till musiken.
Därför behöver jag också musiken i kompositionen. Så jag går till fliken "Fig Leaf Rag" och kopierar filen.
Sedan går jag eventuellt tillbaka till kompositionen med Alt--klick och lägger till den här.
Steg 20
Nu ser vi var de två positionerna vi behöver är. För detta använder jag NumPad och trycker på Komma--tangenten för att skapa en förhandsgranskning. Jag trycker på asterisken * på NumPad för att sätta en markör. På enheter utan NumPad, särskilt på Mac, skulle det vara cmd+Komma för förhandsgranskning och cmd+8 för markören.
Jag låter nu musiken spela och placerar markörerna exakt där stryk- och punkttecknet för utropstecknet ska komma (1). Nämligen precis vid de två accenterna i melodin.
Så jag har satt två markörer: Vid den första ska strecket för utropstecknet vara klart och vid den andra ska punkten sättas.
Jag placerar hjälplinjen på den första markören och går till kompositionen "Typo_Statisch". Där flyttar jag den frame som markerar linjen av utropstecknet till hjälplinjen (2).
Samma sak gör jag med den andra markören som markerar positionen för punkten: Jag placerar hjälplinjen på markören, går till kompositionen och flyttar frame därefter.
De sista stegen
Steg 21
Jag vill låta stryket av utropstecknet ritas långsammare än texten före det, så att vi har en accent på hela utropstecknet (1).
Och texten ska bli färdig lite snabbare totalt sett. Så jag markerar allt före (2) och drar det lite framåt (3).
Så timingen passar perfekt.
Steg 22
Vi har målat texten ovanpå texten och vi kommer att ändra den lite till.
Jag duplicerar först lagret "Typo_Statisch" och tar bort Måla--effekten på det nedre lagret.
Steg 23
På det övre lagret har vi målad text ovanpå den vita originaltexten.
På det nedre lagret har vi bara den normala vita texten.
Om vi kryssar i rutan för Måla på transparens på det övre lagret visas endast de målade röda linjerna.
Steg 24
Det övre lagret ska alltså användas som en mask för det nedre.
Om masken inte visas klickar du enkelt på Aktivera/inaktivera brytläge längst ner, då visas scrolla mask BewMas.
Så kan jag välja en Alfamask och uppnå exakt det resultat jag behöver. Dvs., överallt där dessa linjer ritas är också min originaltext synlig.
Jag har dock flyttat något fel, eftersom bokstaven A redan syns i början.
Steg 25
Så vi väljer bäst alla Penslar med en Rektangulär--markering från botten till toppen (1) och tar sedan bort de två frames av utropstecknet med Shift+markering (2). De två är redan perfekt positionerade i tid.
Sedan flyttar vi den första bilden nedåt litet till höger, så att bokstaven A inte syns i början.
Nu passar det.
Steg 26
Det har vi gjort i delkompositionen, här har vi fortfarande effekten Skakande förskjutning.
När vi tittar på det i den här kompositionen är det inte bara i gult och färgen ändras, utan det skakar också.
Steg 27
Det är underbart och passar perfekt, men färgen ska ändras först efteråt eller inte alls för tillfället. Ändra färger förblir därför inaktivt för tillfället.
Så har vi de första 4 sekunderna av trailern klar och vi ses igen i nästa del av handledningen, med Bouncing Ball.
