Creați o animație 3D, Chrome, Logo, cu sunet FX

Photoshop a devenit un instrument multifuncțional care poate crea animații complexe fără a fi nevoie să achiziționați software suplimentar. În acest tutorial, vă vom arăta cum să creați și să compuneți o animație 3D cu efecte de sunet și lumină. Vom aborda, de asemenea, tehnici privind modul de optimizare a timpului de redare. Să începem!


Tutorial Active

Următoarele bunuri au fost utilizate în timpul producerii acestui tutorial.

  • Obiect 3D (în Descărcare gratuită a fișierelor)
  • Presetări materiale (în fișierele de descărcare gratuite)
  • Sufragerie
  • Clipuri audio

Pasul 1

Creați un document nou la o rezoluție video preferată. În acest caz, folosesc 720 px până la 480 px.


Pasul 2

Alegeți un fundal și o culoare de fundal și folosiți instrumentul Gradient pentru a face un gradient radial, după cum se arată. Asigurați-vă că pictograma Radial Gradient este selectată în meniul Top.


Pasul 3

Următorul pas este de a crea obiectul nostru 3D pe care ulterior îl vom textura și anima. Puteți folosi sau construi orice obiect doriți, dar pentru acest tutorial vom folosi un obiect 3D din unul dintre tutorialele mele anterioare (incluse în resurse). Pentru a afla cum să creați acest obiect, vă rugăm să consultați Tutorialul meu Premium de Ornament Hood din Chrome.

Acum vom adăuga obiectul 3D în scenă. Accesați Fișier> Deschidere și navigați la fișierul "3D_object.psd". Aceasta se va deschide ca un nou document.


Pasul 4

Vrem să mutăm stratul "Obiect 3D" în scena pe care tocmai lucrăm. În mod normal, ați folosi Instrumentul de mutare (V) pentru a face clic și trageți stratul de pe pânză în fila document corectă din partea de sus. Plasarea cursorului peste o filă document ar deschide acest document pentru a vă permite să abandonați noul strat în noul document. Din păcate, cu un strat 3D, nu puteți folosi Instrumentul de mutare direct. Deci, va trebui să o folosim indirect.

În documentul "3D_object.psd", asigurați-vă că stratul 3D Object este selectat în panoul Straturi. De asemenea, asigurați-vă că selectați instrumentul Marcaj dreptunghiular (M).

Holding Ctrl va schimba temporar cursorul în Instrumentul de mutare, care va permite acum să faceți clic și să trageți stratul 3D de la document la document. Mergeți în continuare și țineți apăsat Ctrl + Shift în timp ce dați clic și trageți obiectul de pe panza în documentul nostru de lucru. Plasarea cursorului peste documentul de lucru îl va deschide.

Când se deschide documentul de lucru, glisați cursorul peste pânză și eliberați butonul mouse-ului pentru a plasa stratul. De vreme ce ținem Shift, stratul va fi plasat automat în centrul panzei.


Pasul 5

Cu stratul 3D selectat, asigurați-vă că panoul Proprietăți și Panoul 3D devin vizibile. Dacă aceste panouri nu sunt vizibile, deschideți-le doar prin accesarea Window> 3D sau Window> Properties. Iată un exemplu de ambele ferestre când este selectată opțiunea "Vizualizare curentă":

Următorul pas este să treceți și să aplicați texturi pe fiecare suprafață. Dacă mergem la panoul 3D, putem vedea cele trei grupuri de obiecte care alcătuiesc obiectul nostru 3D. Prin răsucirea în jos a unui strat de grup, putem vedea stratul 3D Object, precum și stratul său Material.

Selectați stratul de material "Față din față" a obiectului "Ellipse" din panoul 3D. În panoul Proprietăți, efectuați următoarele ajustări. Scopul nostru este de a crea un material cromat pentru această suprafață.


Pasul 6

Pentru a aplica acest material pe alte suprafețe, trebuie să îl salvăm în Material Picker. Pentru a face acest lucru, faceți clic pe fereastra de previzualizare Material Picker din panoul Properties, selectați pictograma roată mică pentru a deschide un panou de tip fly-out cu opțiuni suplimentare și alegeți Material nou. Denumiți noul material "Chrome".


Pasul 7

Pentru a aplica materialul "Chrome" nou creat pe celelalte straturi de materiale "Ellipse", reveniți la panoul 3D și faceți clic-clic pe restul suprafețelor. Apoi, accesați selectorul de materiale din panoul Proprietăți și navigați la materialul "Chrome".

Acum, întregul obiect "Ellipse" trebuie să fie texturat cu materialul "Chrome". După cum puteți vedea, nu este o mare diferență. Acest lucru se datorează faptului că nu există nimic de reflectat. Vom aborda acest lucru mai târziu.


Pasul 8

Vom folosi același material "Chrome" pentru obiectul "TUTS". Selectați toate straturile de material pentru obiectul "TUTS" și aplicați materialul "Chrome". Imaginea ta ar trebui să semene cu următoarele:


Pasul 9

Ultimul material pe care trebuie să-l aplicăm este stratul "Materialul de inflexiune din față". Selectați acest strat de material și aplicați următoarele setări în panoul Proprietăți.


Pasul 10

Photoshop include în mod automat un avion la sol în fiecare scenă 3D (indicată de grila). De asemenea, permite opțiunea de a arunca umbre pe planul de la sol. În panoul 3D, selectați stratul "Mediu", apoi mergeți la panoul Proprietăți și asigurați-vă că setările Umbra și planul de sol sunt setate după cum se arată:


Pasul 11

Deoarece obiectul nostru este "în picioare" pe planul solului, umbra obiectului va arunca peste el. În cele din urmă, dorim ca obiectul să fie paralel cu planul de la sol și cu lumina directă deasupra, astfel încât umbra să fie aruncată direct sub obiect.

Pentru a realiza acest lucru, vom muta mai întâi obiectul în poziție. Asigurați-vă că este selectat Instrumentul de mutare (V) și, în Panoul 3D, selectați stratul "Scene" (aceasta selectează toate obiectele simultan).

Utilizați widget-ul de pe ecran pentru a roti scena cu 90 de grade în jurul axei X. De asemenea, puteți seta manual rotația utilizând fila Coordonată din panoul Proprietăți.

În cele din urmă, utilizați widgetul de pe ecran pentru a muta scena în jos, astfel încât să fie mai aproape de planul de la sol.


Pasul 12

Următorul pas este să ajustați iluminatul pentru a obține umbre mai bine văzute. În panoul 3D, selectați stratul "Infinită lumină 1" și utilizați widgetul de pe ecran pentru a roti lumina astfel încât, dacă punctele sunt îndreptate direct spre obiectul nostru.

Iată un unghi diferit, astfel încât să vedem cum arată umbra. Dacă trebuie să repoziționați obiectul astfel încât să fie mai aproape sau mai departe de planul de la sol, reveniți la Pasul 11.


Pasul 13

Înainte de a termina reglarea luminii, hai să mutăm camera astfel încât să ne îndreptăm direct spre obiect ... În Panoul 3D, selectați stratul "Curentă" și utilizați instrumentele din meniul Top pentru a manipula poziția aparatului foto.

Pentru a salva această cameră, accesați panoul Proprietăți și faceți clic pe meniul derulant din "Vizualizare". Denumiți această cameră "Render". Salvarea aparatului foto îl va adăuga automat la panoul nostru 3D, astfel încât să putem sărim oricând între mai multe camere.


Pasul 14

Acum, este timpul să terminați iluminatul. Vom schimba setările luminii pentru a permite o mică cantitate de umbră să fie vizibilă din spatele obiectului. Acest lucru va ajuta scena noastră să pară prea plată în fundal. În panoul 3D, selectați din nou stratul "Infinită lumină 1" și efectuați următoarele modificări în panoul Proprietăți.

Observați că acum putem vedea o parte din umbră


Pasul 15

Pentru a finaliza iluminarea scenei noastre, vom adăuga o lumină bazată pe imagini (IBL). După cum sugerează și numele, acesta folosește o imagine pentru a lumina scena (în esență mimarea iluminatului din imagine). Rezultatul este o scenă mult mai naturală și mai realistă.

În panoul 3D, selectați stratul "Mediu". În panoul Proprietăți, asigurați-vă că este bifată IBL și faceți clic pe pictogramă pentru a încărca o textură. Continuați și adăugați imaginea camerei de zi din Tutorial Assets.

Scena noastră este acum aprinsă de IBL care este reprezentată în fundalul pânzei noastre. Această imagine este numai pentru referință și nu va fi afișată în fundal.

Atâta timp cât stratul de mediu este evidențiat, vom vedea această imagine de referință, precum și un widget pe ecran care poate fi folosit pentru a roti IBL-ul în jur. Prin mutarea imaginii, putem schimba reflecțiile din scenă. Simțiți-vă liber să rotiți mediul după cum doriți.


Pasul 16

În cele din urmă, reflecțiile par prea galbene. Putem schimba acest lucru prin editarea imaginii sursă pentru IBL. Pentru aceasta, accesați panoul Proprietăți, faceți clic pe miniatură IBL și faceți clic pe Editare texturare.

Aceasta va deschide fișierul textura într-o fereastră nouă. Am folosit Image> Adjustment> Replace Color pentru a înlocui galbenul cu un albastru. Acest lucru nu trebuie să pară realist; noi introducem doar o culoare nouă.

Iată cum scena noastră reflectă noile culori din harta IBL.


Pasul 17

Vom crea acum o mică cantitate de animație în scenă. Începeți prin a da clic pe butonul Creează Cronologia videoclipului pentru a activa cronologia. Dacă acest buton nu este vizibil, puteți accesa fereastra> Cronologie.

Stratul "Obiect 3D" va fi acum prezentat ca strat video în caseta Video Timeline.


Pasul 18

Deoarece vom anima "Poziția 3D a scenei" a stratului "Obiect 3D", vom răsuci stratul "Obiect 3D" în cronologie.


Pasul 19

În Panoul 3D, asigurați-vă că este selectat stratul "Scene". Apoi, mutați indicatorul Ora curentă la marcajul pentru 15 cadre și faceți clic pe pictograma "Activare animație cheie cheie".

Apoi, mutați indicatorul de timp curent la marca "00" și utilizați widgetul de pe ecran pentru a roti scena aproximativ 30 de grade în jurul axei Y. Un nou cadru cheie ar trebui să apară automat la primul cadru pentru Poziția 3D a scenei.

Ștergerea Indicatorului de timp curent între cadrele cheie ne va permite să previzualizăm animația.


Pasul 20

Utilizați cursorul direct de sub bara de timp pentru a seta punctul final al zonei noastre de lucru la 15 cadre.


Pasul 21

Înainte de a face animația, putem face unele mici modificări pentru a optimiza timpul de redare. Du-te la Editare> Preferințe> 3D și setați pragul de calitate înaltă a lui Ray Tracer la 4. Alternativ, dacă doriți o redare finală mai lustruită și nu vă deranjează să așteptați puțin mai mult, nu ezitați să o setați pe 5 sau chiar pe 6 noi doar facem 15 cadre).


Pasul 22

Mergeți la File> Export> Video Render și aplicați setările așa cum se arată. Vom reda scena noastră ca o secvență JPG în locul unui videoclip. Acest lucru ne va da mai mult control mai târziu. Vă recomandăm să salvați fotografiile redate într-un folder nou pentru a organiza mai bine fișierele.


Pasul 23

În acest moment, salvați fișierul și deschideți un document nou. Vom construi o animație rapidă 2D a efectului nostru de strălucire. Mai târziu vom aplica acest lucru obiectului nostru 3D. Creați un document nou de 525 px până la 300 px, cu un fundal negru.


Pasul 24

Creați un nou strat numit "Glare" și utilizați instrumentul Marcaj dreptunghiular pentru a face o selecție orizontală după cum se arată.


Pasul 25

Selectați instrumentul Gradient și asigurați-vă că acesta este setat la Prius la Gradient transparent și linear. De asemenea, setați Culoarea primului la alb.

Folosind Gradient Tool, faceți un mic gradient în partea de jos a selecției.

Apăsați Ctrl + D pentru a deselecta.


Pasul 26

Rotiți (Ctrl + T) stratul "Glare" așa cum se arată.


Pasul 27

Următorul pas este să animați acest strat pe panza noastră. Pentru a face acest lucru, deschideți cronologia, așa cum am făcut la Pasul 17.

Răsuciți stratul "Glare" și faceți clic pe pictogramă pentru a activa animația "cheie de cadre" pentru proprietatea "Poziție".

Mutați indicatorul de timp curent în cadrul 50 și dați clic pe pictograma Adăugare cadre cheie pentru a seta poziția ...

Deplasați indicatorul de timp curent în jos pe linia temporală (până la cadrul 90 sau cam așa) și mutați stratul "Glare" pe panza așa cum este prezentat. Un cadru cheie ar trebui să fie generat automat în această poziție.


Pasul 28

Apăsând pe Bara de spațiu veți examina animația.

Simțiți-vă liber să înfrumuseța această animație după cum doriți. Am adăugat câteva straturi suplimentare cu diferite tipuri de strălucire care se mișcă la viteze diferite. Iată o scurtă previzualizare.


Pasul 29

Accesați File> Export> Render Video. Din moment ce lucrăm cu o animație 2D (și nu trebuie să ne facem griji cu privire la timpul de redare), putem salva ca un fișier .MOV.


Pasul 30)

Acum, când am terminat animația noastră de strălucire 2D, ne putem întoarce la scena noastră originală pentru a lucra la efectul de strălucire.


Pasul 31

Pentru următoarea parte, dorim ca obiectul să fie negru. Faceți clic pe primul strat de material al obiectului "TUTS" și modificați setările de material din panoul Proprietăți, după cum se arată.


Pasul 32

Salvați acest material ca în pasul 6. Scrieți-l "Reflected Black".


Pasul 33

Aplicați această textură pe fiecare suprafață pe toate cele trei obiecte. Rezultatul ar trebui să fie un obiect refractar nerealist.


Pasul 34

Una dintre caracteristicile extraordinare din Photoshop este capacitatea de a adăuga fișiere animate GIF sau fișiere MOV sub formă de texturi. Vom aplica fișierul MOV pe care l-am creat anterior la IBL în scenă. Acest lucru va crea aspectul animației noastre 2D de strălucire care se reflectă în obiectul nostru.

În Panoul 3D, selectați stratul "Mediu" și, în panoul Proprietăți, faceți clic pe miniatură IBL și selectați Înlocuire texturare. Selectați fișierul MOV 2D Glare, pe care tocmai l-am creat.

Apăsarea barei de spațiu va previzualiza animația, dar va afișa doar primele 15 cadre de când am ajustat zona de lucru la pasul 20. Continuați și extindeți zona de lucru la 90 de cadre.


Pasul 35

După cum este explicat în pasul 15, ne putem ajuta widgetul de pe ecran să manipuleze poziția IBL. În prezent, dacă previzualizați animația, IBL este poziționată astfel încât să nu reflecte "strălucirea" animației noastre. Setați indicatorul pentru ora curentă spre sfârșitul liniei de timp (când aprinderea în fișierul .MOV începe să animeze).

Rotiți IBL până când vom vedea strălucirea în reflecțiile obiectului nostru.


Pasul 36

Deoarece în scena noastră există texturi minime, scena noastră va deveni puțin mai rapidă. Cu toate acestea, există câțiva pași suplimentari pe care îi putem lua, ceea ce va face puțină diferență vizuală, dar o economie de timp semnificativă atunci când se face redarea.

Faceți clic pe fiecare strat de obiect și debifați Segmente de captură și Shadows Cast (găsite în panoul Proprietăți).

Selectați stratul "Infinite Light 1" și debifați Shadow în panoul Properties.

Selectați stratul "Mediu" și debifați Shadow în panoul Proprietăți. De asemenea, setați Opacitatea Umbrei Planetei la 0%.

În sfârșit, ca pas opțional, accesați Editare> Preferințe> 3D și setați pragul de calitate înaltă a Ray Tracer la 3 sau 4.


Pasul 37

Ultimul lucru pe care trebuie să-l facem înainte de redare este să facem fundalul solid negru. Selectați stratul "Fundal" și dați-i o umplutură neagră.


Pasul 38

La fel ca în pasul 22, mergeți la File> Export> Render Video și redați animația ca secvență de imagini JPG.


Pasul 39

Acum, că avem toate componentele noastre redate, putem începe să compozim animația noastră într-un nou document, folosind cronologia video. Accesați Fișier> Deschidere și navigați la dosarul în care am salvat secvența de imagini animație 3D. Asigurați-vă că ați verificat caseta Image Sequence înainte de a deschide.

Deoarece lucrăm cu straturi video, este posibil să primiți următorul mesaj înainte de a deschide fișierul. Când fișierul este deschis, mergeți doar la Vizualizare și debifați Corectarea rației pixelilor pentru corectare.

Apoi, mergeți la File> Place și selectați ultimul cadru al animației noastre 3D. Aceasta va plasa ultimul cadru al animației noastre pe același strat ca și fișierul nostru video.

Notă că fișierul pare să fie mai lat decât pânza. Acest lucru se datorează faptului că stratul nostru video este prezentat într-un raport de aspect diferit față de imaginea noastră statică. Putem ajusta manual mânerele pentru a le corecta.


Pasul 40

Următorul pas este să adăugăm animația 3D strălucitoare în scenă. Mergeți la File> Place și navigați la imaginea de animație strălucitoare. Asigurați-vă că le deschideți ca secvență de imagini. Rețineți că acest lucru transformă automat stratul video într-un obiect inteligent. Acest lucru este important pentru pașii ulteriori (alternativ, aveți posibilitatea să faceți clic dreapta pe orice strat video din panoul Straturi și să selectați "Conversia în Smart Object").


Pasul 41

Pentru a începe efectul de orbire inițială, selectați stratul de animație 3D Glare și setați Modul de amestecare la Linear Dodge (Adăugare).

Dacă scrub prin animație, puteți vedea cum acest mod de amestecare afectează scena.


Pasul 42

Așa cum am subliniat mai devreme, stratul nostru video de strălucire 3D este un obiect inteligent. Ca obiect inteligent, putem aplica acum filtre inteligente pe stratul video. Vom folosi filtrele inteligente pentru a îmbunătăți efectul de strălucire. Efectuați o copie a stratului de strălucire în panoul Straturi și denumiți acest "Blurred Glare". Acest lucru va adăuga în mod automat un strat nou în cronologia noastră video.

Dă-i un Blur Gaussian (Filter> Blur> Blur Gaussian) setat la 6,8 pixeli. Aceasta va adăuga acea strălucire care însoțește adesea o strălucire.


Pasul 43

Putem crea creații cu strălucirea prin adăugarea unei Radial Blur. Mergeți mai departe și faceți o altă copie a stratului original de strălucire și mergeți la Filter> Blur> Radial Blur. Setați suma la 100. Simțiți-vă liber să adăugați un al doilea Radial Blur pentru un accent suplimentar (filtrele inteligente pot fi adăugate de mai multe ori).

Scena dvs. ar trebui să semene cu următoarele.


Pasul 44

Acum, că animația noastră este aproape finalizată, vom adăuga câteva atingeri finale. Adăugați un strat nou utilizând panoul Straturi și completați cu negru. Denumiți acest strat "Fade".

În caseta Cronologie video, răsuciți stratul "Fadere" și faceți clic pe pictograma Cronometru pentru a activa animația "cheie de cadre" pentru proprietatea Opacitate. Când activați animația Keyframe Animation, un cadru cheie va fi plasat la fața locului Indicatorului dvs. de timp curent - mutați-l înapoi în cadru 00.


Pasul 45

Creați altul la cel de-al zecelea cadru. Puteți să faceți clic și să trageți un cadru cheie după ce acesta este adăugat pentru ao poziționa mai precis.


Pasul 46

Cu cel de-al doilea cadru cheie activat (donat de culoarea galbenă), ajustați Opacitatea stratului "Fade" la 0% utilizând panoul Straturi. Fade-in-ul nostru este acum complet.


Pasul 47

Ultimul lucru pe care trebuie să-l faceți este să adăugați sunetul găsit în Tutorial Assets. Vom folosi un pachet de sunet numit "Magic Wooshes". Acest fișier include patru clipuri "woosh" seaparte.

În partea de jos a Cronologiei noastre video, faceți clic pe simbolul plus de la sfârșitul stratului audio. Încărcați clipul audio "Wooshes 01.mp3".


Pasul 48

Apăsarea barei de spațiu va previzualiza animația cu sunetul. Acest clip audio pare să funcționeze cel mai bine atunci când efectul de strălucire trece peste obiectul nostru. Mutați acest clip audio astfel încât "woosh" să joace, deoarece strălucirea începe să se deplaseze peste obiectul nostru.


Pasul 49

În prezent, sunetul continuă să se joace peste sfârșitul animației noastre, pentru a repara acest lucru, va trebui să tăiem clipul. Faceți clic pe sfârșitul Traseului audio și trageți-l înapoi, astfel încât să se încheie cu animația noastră.

În acest moment, mergeți mai departe și trageți restul în straturi înapoi, astfel încât să se încheie cu animația.

Sunetul se oprește mai devreme. Pentru a rezolva asta, vom adăuga o atenuare la audio. Faceți clic pe pictograma săgeată de la sfârșitul piesei și setați funcția Fade Out la .5 sec.


Pasul 50

Dacă doriți, puteți adăuga o altă piesă audio la începutul scenei noastre pentru a reda când obiectul nostru se rotește în poziție. Pentru a adăuga o altă piesă audio, dați clic pe pictograma Note muzicale din piesa audio și selectați Urmărire audio nouă.

Doar repetați pașii 47-49. Am constatat că clipul "Wooshes 02.mp3" funcționează bine, totuși, este nevoie de o ajustare mai puțin.


Pasul 51

În cele din urmă, accesați File> Export> Render Video.


Rendering finală

Ați terminat! Mai jos este animația finală cu efecte de sunete: