Chomp Out Your Own Pac Man Animație - Partea 1

Acest tutorial cu 2 părți este o animație Pac Man simulată pe măsură ce navighează într-un labirint și găsește puncte de-a lungul drumului ... cu chasers fantomă. Tutorialul va include linii directoare privind construirea componentelor în Photoshop sau Illustrator și apoi integrarea lor în AE pentru a anima Pac Man. Acesta este mai mult un proiect de proiectare care încorporează multe dintre competențele fundamentale asociate cu AE; precomprimări, transformări, măști de straturi etc..


Tutorial

În acest proiect vom explora o varietate a numeroaselor capabilități pe care After Effects le oferă utilizatorului. Îmi place acest proiect pentru începători, deoarece începe cu designul fundamental și abilitățile de animare și apoi avansează elevul în înțelegerea sa a aplicației After Effects și a interfeței.

Simplul design Pac Man se descompune în trei elemente;

1. Pac Man - o sferă tăiată în jumătate

2. Labirintul - care poate fi la fel de complexă sau cât de simplă doriți

3. Muniții - aproape orice obiect doriți să mancati Pac Man

(În partea a doua vom adăuga mai multe elemente.)

Fiecare dintre aceste elemente este ușor de creat în Photo Shop sau Illustrator. Tutorialul meu folosește Photoshop ca instrument de proiectare.

Designul Basic Pac Man -

Pregătirea fișierelor în Photoshop

Pac Man

1. Lansați Photo Shop și deschideți un nou document

A. Utilizați o măsurătoare care să corespundă nevoilor dumneavoastră. 300x300 va face bine

b. Utilizați un fundal transparent

2. Creați o sferă, aproximativ 2/3 din mărimea plăcii de artă, trageți-o cât mai aproape de mijlocul stratului.

Cu ajutorul instrumentului de marcaj dreptunghi, selectați jumătatea superioară sau inferioară a sferei și apoi "CUT" pe ​​jumătate. (Este acum în clipboard)

"PASTE" jumătate pe care ați tăiat anterior de la Layer One într-un nou strat. Veți dori să redenumiți aceste straturi pentru a le identifica mai bine atunci când importați acest document în After Effects.

Ai terminat cu acest element de design. Asigurați-vă că salvați documentul ca pe altceva fără titlu. Vom importa acest fișier în After Effects ca o compoziție într-un pas viitor.

Labirintul de bază - Muniții incluse

1. Deschideți un nou document în Photo Shop

  • Utilizați un raport de aspect care să corespundă nevoilor dumneavoastră. Voi folosi o dimensiune particularizată pentru a se conforma labirintului pe care l-am creat.
  • Utilizați o culoare de fundal pentru a vă place

2. Folosiți-vă imaginația pentru a construi labirintul și munchiile voastre. Faceți-o la fel de simplă sau de complexă pe cât doriți. Rețineți că aceasta este platforma pe care o veți anima pe Pac Man. Utilizați labirintul meu și munchies, dacă doriți.

Utilizați un al doilea strat pentru a plasa munchii în labirint. (Din nou, denumiți fiecare strat în scopuri de identificare mai târziu.) Dacă includeți munchiile dvs. în labirint, veți fi obligați, în After Effects, să utilizați o mască de strat pentru a le face să dispară. Este metoda cea mai eficientă din punct de vedere al timpului.

Aluzie: Utilizați vizualizarea și ghidajele de rețea pentru a crea munchii perfect aliniate.

Ai terminat cu acest element de design. Asigurați-vă că salvați documentul ca pe altceva fără titlu. Vom importa acest fișier în After Effects ca o compoziție într-un pas viitor.

Elementele Pac Man In After Effects

Ceea ce este oferit aici este ghidul de bază. Puteți alege să ignorați sau să le extindeți pentru a se potrivi propriului stil creativ.

Labirint și Munchies într-un Comp

1. Lansați After Effects și Creați o nouă compoziție:

Compoziția dvs. ar trebui să fie aceeași dimensiune ca și lemnul dumneavoastră. Setați durata de compunere timp de 20 de secunde. Denumiți ceva ce vă puteți aminti.

2. Importați fișierele pe care le-ați creat anterior în Photo Shop. Importați toate fișierele sub formă de compoziții. În acest fel, fișierele dvs. sunt bine incluse în foldere.

3. Trageți directorul Maze în fereastra Comp. Ar trebui să aveți două straturi afișate în cronologie; labirint și muniții.

Vom reveni și vom folosi această compunere mai târziu, dar pentru moment să lucrăm la celelalte elemente de design.

SIMPLE DOUA ANIMARE CADRU: Efectuarea muncii Pac Man

1. În fereastra de proiect, faceți dublu clic pe compunerea dvs. Pac Man. Aranjați-vă straturile de compoziție Pac Man astfel încât jumătatea superioară a sferei să fie direct deasupra jumătății inferioare. Fereastra comp trebuie să arate mult ca documentul original al magazinului Photo Shop. Dacă nu, simplu aranjați jumătățile sferei astfel încât să o facă.

Procesul de a face lucrul cu fălcile lui Pac Man este o rotație simplă a două cadre. Nu conteaza cu ce strat incepeti, dar va merge mai repede daca finalizati primul strat, apoi treceti la urmatorul strat. Voi începe cu stratul superior.

2. Setați top strat pentru a anima proprietatea ROTATION atingând tasta R de pe tastatură și apoi dați clic pe ceasul de oprire de lângă proprietatea animație de rotație. Valoarea numerică a rotației în acest punct ar trebui să fie 0, iar linia de timp ar trebui să aibă acum un cadru cheie la punctul de pornire al stratului. Copiați acest cadru cheie.

3. În fereastra de configurare, folosind instrumentul punct de ancorare (pan-behind) din paleta de unelte, repoziționați punctul de ancorare în marginea din dreapta jos a emisferei.

4. Folosind tasta de jos a paginii, avansați marcatorul de linie de timp cu trei cadre.


5. Modificați valoarea rotației din strat în

aproximativ +22 grade.

6. Folosind tasta Page Down, avansați marcatorul de timp și modificați valoarea de rotație înapoi la 0.


7. Selectați toate cele trei cadre cheie> Țineți apăsată tasta Alt (Command for Mac) și faceți clic pe ceasul stop pentru a activa expresii pentru strat. Apoi, din meniul de expresii, alegeți Proprietăți> LoopOut (tip = "ciclu", numKeyframes = 0) din săgeata expresiei limbajului.

8. Repetați procesul descris mai sus pentru al doilea strat, folosind poziția corespunzătoare a punctului de ancorare și valoarea de rotație opusă în etapele de la 2 la 7.

Veți observa că cadrele mele nu încep la începutul comp.

Le-am repoziționat pentru a începe animația PAC MAN după introducerea, care

vom acoperi în partea a doua.

9. Precompune aceste straturi prin selectare ambele straturi și selectând Precompose din meniul Layer. (Layer> Precompose) Denumiți precompoziția adecvat. Este posibil să trebuiască să o găsiți mai târziu. Acum ai un strat de animație Pac Man. Observați numele acestui Comp, deoarece acesta este Comp, ne vom muta mai târziu în Compoziția noastră de lucru. Ar trebui să arate imaginea de mai jos.

Călătoria lui Pac Man

Acum suntem gata să navigăm pe pac în jurul labirintului.

1. Deschideți labirintul și munchii comp ... în acest moment al procesului ar trebui să conțină doar două straturi; un strat de labirint și un strat de munchii. Glisați compunerea Pac Man în fereastra de timp sau în fereastra comp. Acum aveți trei straturi în comp.

2. Redimensionați și poziționați Pac Man corespunzător. Incep sa-mi Pac Man in mijlocul labirintului sub ceea ce in cele din urma va fi jocul meu "Start Game".

3. Apăsați tasta P pentru stratul Pac Man. Aceasta va dezvălui proprietățile poziției pentru strat. Apoi activați Animație poziție pentru acest strat făcând clic pe cronometru.

Veți vedea un diamant în strat.

4. Deplasați marcajele cronologiei la marcajul de 1 secundă. Și mutați-l pe Pac Man în fereastra comp către o nouă poziție; unde Pac Man ar trebui să facă o întoarcere. (Țineți apăsată tasta Shift pentru a muta Pac Man într-o linie dreaptă.)

Veți observa că After Effects a creat automat un nou cadru cheie în strat.

5. Deplasați marcajele temporale în poziția 02 din linia temporală și mutați Pac Man în fereastra Comp către o locație nouă. În exemplul meu, de mai jos, l-am mutat în jos.

Uau! Ce e cu linia asta curbată, iar Pac Man se confruntă cu un drum greșit! Vom rezolva ambele probleme în câțiva pași, dar chiar acum terminați să navigați prin Pac Man prin labirint până la punctul în care doriți să se oprească.

AVERTISMENT: Evitați zonele de trecere a Pac Man deja mâncate. Vom folosi o mască de strat pentru a elimina munchiile, iar măștile de trecere a straturilor vor "dezvălui" în loc de "ascunde".

Fixarea valorilor Bezier și rotației

1. În fereastra cronologie -

Faceți clic pe eticheta Proprietăți poziție. Aceasta va selecta toate cadrele cheie de pozitie pentru stratul Pac Man.

2. În fereastra de compilare -

Deplasați instrumentul de selecție peste unul dintre punctele de ancorare Bezier care a fost creat în timpul modificării tastelor de poziție. Atingeți tasta G până când instrumentul stilou se transformă în instrumentul Convertește vortex. Arată ca un ușor înclinat cu capul în jos V. Poate fi accesat, de asemenea, în instrumentul pen-throw out opțiuni. Asigurați-vă că toate cadrele cheie ale poziției pentru strat sunt încă selectate, apoi faceți clic pe unul dintre punctele de ancorare bezier pentru a le ascunde în punctele de ancorare a traseului liniar.

Previzualizați animația. Faceți acest lucru făcând clic pe butonul Previzualizare RAM din fila previzualizare sau prin apăsarea pe tastatura numerică de pe tastatură.

În timpul previzualizării dvs., probabil ați observat că Pac Man are tendința de a accelera și de a încetini între Ramele cheie. Pentru a remedia această problemă, va trebui să accesăm un element din meniul de comandă.

Rove Across Time

Păstrați toate cadrele cheie ale poziției selectate ... apoi, în bara de comandă din partea de sus a ferestrei After Effects, alegeți Animație> Interpolarea cadrului cheie. Selectați Rove Across Time în caseta de dialog și faceți clic pe OK.

Bine acum, vom rezolva problema orientării pe care o are Pac Man.

Fixarea valorilor de orientare (rotație)

Acest proces poate fi un pic cam greu și necesită o bună măsură de concentrare și concentrare, deci dacă simțiți nevoia unei pauze ... acesta va fi un loc bun pentru a lua unul. Ce vom face aici este schimbarea orientării lui Pac Man în fereastra comp. Vom face acest lucru folosind valorile ROTATION. De asemenea, trebuie să fim măriți în cronologia noastră, pentru că Ramele noastre de rotație vor fi de numai 2 cadre, astfel încât să măriți cronologia folosind glisorul de zoom din partea de jos a ferestrei cronologie.

1. Asigurați-vă că Strat Pac Man este selectată și atingeți tasta R de pe tastatură. Aceasta va dezvălui proprietățile de rotație ale stratului.

Apoi, deplasați marcajele cronologiei la sau cât mai aproape posibil cu primul cadru de poziționare a poziției. (Puteți vedea cadrele cheie poziționare ținând apăsată tasta Shift și apăsând tasta P de pe tastatură. De asemenea, puteți utiliza navigatorul de cadre cheie pentru a vă ajuta să ajungeți la fiecare nouă poziție din proces. Accesați cadrul anterior al cheii săgeată și Treceți la următorul cadru cheie săgeată de pe extrema stângă a liniei de timp.)

2. Faceți clic pe cronometrul valorii de rotație. Aceasta va crea un cadru cheie de rotație. Studiați ilustrația de mai jos.

3. Deplasați marcatorul de cronologie cu un cadru și (Puteți face acest lucru apăsând tasta Page Down o dată.) Schimbați în mod corespunzător valoarea de rotație a stratului. Aceasta va crea un cadru cheie. Copiați imediat. Studiați ilustrația de mai jos.

Un cadru cheie trebuie evidențiat pentru a fi copiat. (Control C sau Comandă C pe un Mac sau din meniul Comandă ... Editare> Copiere)

4. Deplasați marcajele cronologiei la sau în apropierea următoarei poziții a cadrului cheie.

Lipiți cadrul de rotație pe care l-ați copiat anterior. (Control V sau Command C pe un Mac sau din meniul de comandă ... Edit> Paste) Aceasta menține noua orientare Pac Man între cadrele cheie de poziție.


5. Deplasați marcatorul de cronologie cu un cadru. Schimbați valoarea de rotație a stratului în consecință; în exemplul meu din-90 la -180 respectiv. Aceasta va crea un cadru cheie. Copiați imediat noul cadru cheie.

6. Repetați pașii de la 4 la 5 pentru restul navigării Pac Man.

Începe să mănânci

Acum suntem gata să aruncăm niște muniții. Din nou, acest proces este dificil și necesită o bună măsură de concentrare și atenție. Luați o pauză aici dacă simțiți nevoia.

Ceea ce vom face mai departe este să creați o mască strat animat pe stratul munchi al Compoziției noastre. Masca noastră va urma traseul pe care l-am cartografiat anterior pentru Pac Man. Din nou, vom folosi acele rame de pozitie originale pentru a ne ajuta.

1. Selectați munchies strat în fereastra cronologică.

2. Selectați Pen Tool din bara de instrumente. (Tasta de comenzi rapide este G)

În fereastra COMP

3. Desenați o cutie în jurul Pac Man la poziția sa actuală în cronologie.

Atingeți tasta M de pe tastatură. (Aceasta va dezvălui proprietățile Mascăi pentru strat.)

ÎN TIMPUL

4. Faceți clic pe Masca Proprietăți cronometru și apoi faceți clic pe caseta de lângă Inversat opțiune.

5. Advance markerul cronologiei la următorul cadru de poziționare Pac Man.

În fereastra COMP

6. Atingeți tasta V (instrumentul de selecție) Selectați cele două puncte principale de ancorare Mască și trageți-le de-a lungul căii către punctul în care este acum localizat Pac Man. Selectați instrumentul Add Vortex și adăugați puncte de ancoraj la masca stratului pentru a facilita următoarea modificare a formei mască a stratului. Măriți fereastra Comp pentru a vă ajuta să adăugați puncte de ancorare.

7. ÎN FAȚA TIMPULUI

Advance Pac Man la următorul cadru de poziționare.

8. Repetați pașii de la 5 la 7 pe durata călătoriei Pac Man.

TERMINAND

Inclus în fișierele de proiect ar trebui să fie un fișier AIF numit munchie clip.aif.

1. Importați fișierul clip.aif munchie în Efecte după.

2. Trageți fișierul în fereastra Timeline sau comp.

3. Clipul durează doar 8 secunde, deci dacă linia de timp este mai lungă de 8 secunde, va trebui să introduceți clipul.

În fereastra proiectului

Faceți clic dreapta pe fișier

Selectați Interpret Movie Trailer> Main (se va deschide o casetă de dialog)

În partea de jos a casetei de dialog introduceți o valoare care vă va permite să extindeți clipul pe lungimea liniei de timp. În exemplul meu am nevoie de 20 de secunde, așa că am o buclă de clip audio de 3 ori, care îmi va da 24 de secunde de sunet.

4. În fereastra Cronologie extindeți clipul din cronologie tragând-l până la capătul cronologiei.

5. Examinați Comp prin apăsarea tastei 0 de pe tastatura numerică.

CONGRATULĂRI ​​- Ați completat Partea 1

După cum ați descoperit, acest lucru nu este un proiect ușor. Este nevoie de timp, atenție și o minte creativă pentru a finaliza acest proiect într-o manieră profesională.

Căutați cea de-a doua parte a acestui tutorial, în care adăugăm câteva îmbunătățiri, inclusiv un joc Start Slate, fantome și mai multă audio.

Sper că v-ați bucurat să lucrați prin acest proiect. :-)