Share
Dacă utilizați Corona SDK, știți că este un instrument puternic și ușor de utilizat pentru a crea jocuri mobile. Cu toate acestea, platforma este limitată la doar două dimensiuni, deși acestea ies cu metode încorporate pentru a simula efectele 3D. Ca dezvoltator de jocuri, puteți depăși oarecum această limitare utilizând ceea ce se numește conceptul de adâncime a câmpului.
Deși mă refer la Corona SDK în exemplul meu, teoria adâncimii câmpului poate fi aplicată oricărei platforme de dezvoltare și aproape oricărui obiect grafic.
Dacă te-ai ocupat de fotografie, știi deja ce adâncime de câmp este. Pentru aceia dintre noi care nu știu, voi încerca să explic. Adâncimea câmpului este efectul neclar pe care îl vedeți în fotografiile cauzate de accentul pe un anumit obiect asupra altora. Adâncimea câmpului se bazează pe două concepte, percepția de focalizare și distanța de emulare.
În primul concept, percepția de focalizare va fi folosită pe două obiecte sau două planuri pentru a crea un mediu cu adâncime. Un obiect va fi punctul focal, iar celelalte obiecte sau avioane vor fi în afara focalizării. Obiectele aflate în afara focului vor apărea aproape întotdeauna neclare pentru a ajuta la controlul focalizării spectatorului.
Al doilea concept este distanța de emulare. Când te uiți la peisaj, obiectele din dulap vor apărea mai mari și obiectele mai departe vor apărea mai mici. Adâncimea câmpului folosește acest concept pentru a întări iluzia profunzimii în scenă. Făcând obiecte într-un mediu 2D mai mare sau mai mic, mintea privitorului va fi înșelată în a presupune că există adâncime în scenă.
Dacă ați jucat jocuri video înainte sau chiar ați uitat unele fotografii populare, ați văzut deja conceptul de profunzime a câmpului în uz, dar este posibil să nu fiți recunoscut efectul. Dacă rulați o căutare rapidă Google Image pentru adâncimea de câmp, puteți vedea sute de exemple pentru acest stil de fotografie. Fotografiile pe care le veți vedea variază de la peisaje la fotografii de nuntă. În fiecare fotografie de adâncime a câmpului, știți instantaneu ce vrea fotograful să vadă privitorul.
Prin utilizarea profunzimii câmpului, puteți controla focalizarea scenei și crea profunzimea prin focalizarea pe subiectul principal, păstrând în același timp și alte elemente care nu sunt focalizate. Deși îmi place să dezvolt în colaborare cu Corona SDK, acest efect este un mod simplu dar puternic de depășire a limitărilor 2D ale platformei Corona SDK.
În exemplele următoare vom explica modul în care profunzimea câmpului poate fi utilizată în jocurile mobile. Simțiți-vă liber să utilizați conceptul de profunzime a câmpului în oricare dintre aplicațiile dvs. mobile cu SDK-ul dorit.
Acum, când știm ce adâncime de câmp este, să examinăm un exemplu al unei scene care nu folosește conceptul de profunzime a câmpului.
În această scenă, ambele păsări sunt în foc și apar ca un ecran plat pentru privitor. Deși această scenă poate fi suficient de bună pentru unele jocuri, putem folosi conceptul de profunzime a câmpului pentru a face ca scena să fie mai interesantă pentru jucător și să o aducă la viață. În următoarea scenă, veți vedea un exemplu de bază al conceptului de profunzime a câmpului în uz.
Folosind conceptul de adâncime de câmp, această scenă a simulat distanța ținând pasarea în stânga în foc și lăsând pasărea din dreapta în afara focalizării. Făcând păsările în afara focului mai mici, de asemenea, consolidează percepția distanței.
De asemenea, putem inversa scena pentru ca punctul focal să apară mai departe. Efectuarea obiectelor mai mari, estompate și păstrarea focalizării în focare, realizează această inversare. Să aruncăm o privire la un exemplu al acestei inversări a scenei.
În scena inversă, am făcut păsările mai mici punctul focal și am înșelat spectatorul presupunând că pasărea mai mică este mai departe prin estomparea celor mai apropiate obiecte.
Până acum, ați putea fi curios cum au fost create aceste imagini. Dacă aveți Photoshop sau un instrument similar de editare grafică, puteți utiliza un Blur Gaussian pentru a crea scene de adâncime de câmp. Sunt sigur că orice tip de neclaritate va funcționa, dar am avut cel mai mare succes cu Gaussian Blur. Să aruncăm o privire asupra modului de a crea o imagine neclară și neclară pentru aplicația noastră.
Cu Photoshop deschis, creați un document nou de 150 de pixeli și 150 de pixeli. Setarea implicită pentru celelalte opțiuni va funcționa pentru acest tutorial.
Apoi faceți clic pe instrumentul pentru forme personalizate și selectați Bird 2 din meniul derulant de formă. În acest tutorial, folosesc forma unei păsări. Orice formă va funcționa.
Acum, când am selectat o formă, să schimbăm culoarea prim-planului într-o culoare albastră frumoasă făcând clic pe Setați Culoarea primului plan opțiune.
Cu instrumentul de formă, creați o formă de pasăre în interiorul documentului și încercați să faceți ca pasărea să umple cea mai mare parte a documentului.
Să adăugăm o margine simplă formei noastre, pentru a da o definiție.
Înainte de a adăuga Blur-ul Gaussian la forma noastră, hai să mergem Fișier> Salvare pentru Web> Dispozitive pentru a salva forma ca fișier PNG în dosarul nostru de proiect. Forma neclarită pe care o salvăm va fi utilizată ca punct focal în aplicația noastră mobilă.
După ce am salvat forma neclară, acum putem adăuga Blurul Gaussian. Cu cele mai multe forme, puteți adăuga un Gaussian Blur fără a fi nevoie să faceți pași suplimentari. În cazul nostru, va trebui să folosim Imagine plata în Photoshop deoarece folosim o frontieră. Dacă nu aplatizăm imaginea, blurul va produce unele rezultate neașteptate.
Faceți clic dreapta pe stratul de formă și faceți clic pe Imagine plata. După ce imaginea este aplatizată, adăugați Gaussian Blur, mergând la Filtru> Blur> Gaussian Blur.
Cu ajutorul aplicației Gaussian Blur asupra formei noastre, putem salva forma în dosarul proiectului utilizând aceleași instrucțiuni din pasul 6.
După ce ați finalizat acești opt pași, ar trebui să aveți două păsări în dosarul proiectului, o imagine clară și clară a unei păsări și a unei păsări neclare. Acum puteți include aceste imagini în următoarea aplicație mobilă.
În acest tutorial, sper că ați învățat cum să utilizați conceptul de profunzime a câmpului pentru a vă aduce la viață jocurile. Deși am folosit o pasăre în tutorialul meu, puteți folosi aproape orice obiect pentru a crea o scenă cu adâncime folosind conceptul de profunzime a câmpului. Puteți aplica profunzimea câmpului în fundal pe următorul scroller lateral 2D sau puteți aplica conceptul anumitor elemente ale viitorului dvs. joc de groază. Vă mulțumim pentru lectură!
Accentsconagua