NU RATAŢI OFERTA CARE VĂ POATE SCHIMBA VIAŢA!

Cursul Animation and Game Development

În acest curs discutăm despre crearea jocurilor în browserul web folosind JavaScript. Vă prezentăm informații de bază despre JavaScript, necesare pentru a controla cronologia și animația, precum metodele și evenimentele DOM și funcțiile de timing și de comunicare cu serverul pentru nevoile fluxului jocului prin tehnologia WebSocket.

O parte a cursului este dedicată elementului HTML Canvas și diferitelor modalități de a-l folosi. De la simpla desenare 2D până la puternicul motor WebGL și popularul cadru pentru utilizarea lui Three.js.

Cursul abordează și câteva dintre cele mai cunoscute soluții gata-făcute pentru crearea jocurilor în JavaScript. Pe lângă elementul HTML Canvas, JavaScript a devenit un instrument indispensabil pentru realizarea jocurilor și a graficii complexe în cadrul browserului web. În acest curs, discutăm detaliat despre canvas. În contextul desenării 2D, explicăm și conceptele: desenarea formelor pe elementul canvas, modificarea culorii actuale, transformarea canvasului, precum și animarea părților sale. Cursanții se vor familiariza cu instalarea imaginilor în canvas, precum și cu utilizarea sprite sheet-urilor și a atlasului. Pe lângă contexul 2D, prezentăm și utilizarea elmentului canvas în contextul 3D.

În a doua parte a cursului vorbim despre instrumentele și bibliotecile pentru crearea aplicațiilor grafice cu diferite scopuri. Adobe Animate CC, programul multifuncțional pentru crearea aplicațiilor multimedia, cu posibilitatea de a exporta în HTML/CSS, are o interfață grafică foarte bună și este adecvat atât pentru designerii care vor să analizeze în detaliu JavaScript, cât și pentru dezvoltatorii cu experiență.

CreateJS este un cadru JavaScript care expune instrumentele de bază pentru lucrul cu grafica canvas, lăsând spațiu dezvoltatorului să se concentreze pe punctele cheie ale aplicației. Similar este și cadrul Phaser care, spre deosebire de CreateJS, este orientat exclusiv pe producția de jocuri, motiv pentru care are deja integrate diferite soluții care ușurează crearea jocurilor, precum fizica, principala buclă a aplicației, animații etc.

Sunteţi interesat de acest curs? Îl puteţi parcurge în cadrul acestor programe LINK Academy: Frontend JavaScript Development Nou.

Descrierea și obiectivul cursului Animation and Game Development

Obiectivul cursului este să-i pregătească pe cursanți pentru cele mai solicitante sarcini cu care se vor întâlni în domeniul programării JavaScript. După finalizarea acestuia, cursanții vor putea să creeze singuri jocuri și să le publice cu ajutorul lui JavaScript, să creeze diferite tipuri de aplicații grafice cu o bogată experiență de utilizator, precum și să controleze interacțiunea dintre aplicații și server cu ajutorul lui WebSocket.

Acest curs, la fel ca și celelalte cursuri de la LINK Academy, poate fi parcurs chiar dacă nu aveți cunoștințe din acest domeniu. Acest lucru este posibil pentru că întreaga materie este împărțită în unități tematice, respectiv module. Aceste module sunt create astfel încât să ușureze asimilarea cunoștințelor noi și pregătesc treptat cursanții pentru lecțiile care urmează.

Primul modul se concentrează pe lucrul cu grafica. Aici cursanții se vor familiariza cu crearea graficii cu ajutorul lui DOM, cu lucrul cu elementele canvas și cu utilizarea lui WebGL. De asemenea, unitatea tematică introductivă le va oferi posibilitatea să asimileze abilitățile de gestionare multimedia (audio și video), dar și să se familiarizeze în detaliu cu noțiunea de three.js framework.

Al doilea și al treilea modul al acestui curs se concentrează pe gestionarea timpului cu ajutorul funcției de timing, precum și de conectare cu serverul. La lecțiile din aceste module cursanții vor învăța noțiuni ca setTimeout, setInterval, requestAnimationFrame, Node.js și WebSocket.

Interacțiunea cu utilizatorul este titlul următorului modul, unde cursanții vor învăța cum să gestioneze funcțiile mouse-ului și să gestioneze evenimentele de pe tastatură.

A doua jumătate a cursului este alcătuită din module care oferă cunoștințe mai complexe. Primul modul se concentrează pe lucrul cu bibliotecile Create.js. Aici veți învăța să creați scene, să setați forme de bază pe scene și să editați interacțiunea cu utilizatorul. Apoi, veți studia Adobe Animation Software CC, iar la final vă așteaptă unul dintre cele mai interesante module, unde veți învăța să creați jocuri folosind phaser framework.

Cursul Animation and Game Development vă va răspunde la întrebări de genul:

Cu ajutorul lui JavaScript se pot crea jocuri pentru browserul web?

La început, browserul web nu putea să interpreteze JavaScript suficient de repede ca să putem iniția jocuri cu ajutorul lui. Mai ales jocuri cu performanță grafică înaltă.

Astăzi situația s-a schimbat. Calculatoarele devin din ce în ce mai bune și mai rapide, browserele web, de asemenea. Prin urmare și capacitatea JavaScript a crescut.

Versiunea revoluționară a lui HTML (5) a deschis ușa multor inovații care au transformat browserul într-o mașină puternică, iar JavaScript este „creierul” ei. A fost introdus suport pentru grafica 3D, prin tehnologia WebGL, suport pentru comunicarea bidirecțională rapidă cu serverul prin tehnologia WebSocket, conținut audio și video etc.

Având în vedere toate acestea, JavaScript nu numai că poate crea jocuri pentru browserul web, ci a preluat și o parte a altor tehnologii din acest domeniu. Astăzi, jocurile JavaScript sunt din ce în ce mai populare, iar numărul și calitatea lor continuă să crească.

Ce este Adobe Animate?

Programul Macromedia/Adobe Flash a dominat mulți ani sfera aplicațiilor client îmbunătățite. Acest program avea o interfață extraordinară și adaptabilă, care permitea diferitelor profiluri să creeze aplicații web multimedia interactive. Designerii puteau să creeze foarte ușor o aplicație cu ajutorul unei interfețe grafice extraordinare, iar programatorii puteau să programeze în limbaj ActionScript. Rezultatele obținute cu ajutorul acestui program erau excelente și unice.

Cu timpul, Flash a început să piardă teren în fața lui JavaScript. În primul rând, pentru că browserul web nu era capabil să emită programe create în Flash fără un accesoriu special, dar și din cauza suportului tot mai slab pe browserele mobile.

În anul 2015, programul Flash a fost restructurat și îmbogățit cu opțiunea de export în HTML (JavaScript), ceea ce l-a făcut din nou competitiv. De asemenea, a fost schimbat și numele aplicației în Adobe Animate, așa cum îl cunoaștem și îl studiem astăzi.

Cum se deplasează obiectele în program?

De obicei, jocurile conțin multe elemente animate. Aceste elemente se deplasează, interacționează, se creează și dispar. Pentru deplasarea lor sunt responsabile timpul și spațiul. Dacă într-un interval de timp mutăm ceva în etape, acel lucru va fi animat. JavaScript are suport pentru lucru cu timpul. Există diferite funcționalități cu ajutorul cărora putem spune programului să aștepte un timp înainte de a face ceva. Cu cât timpul de așteptare este mai mic, cu atât deplasarea este mai naturală.

Uneori, iluzia mișcării este dată de mai multe imagini în care un anumit personaj apare în diferite etape ale unei mișcări. Acest tip de animație se numește animație sprite și este foarte frecvent întâlnită în grafica bidimensională, în special în jocuri.

Animation and Game Development

La ce folosesc imaginile într-un joc?

Unul dintre cele mai importante elemente al jocurilor pe calculator este grafica. Aceasta influențează desfășurarea jocului și experiența de utilizator. Imaginea, ca element al graficii jocurilor, apare în diferite roluri. De exemplu, în rolul de fundal pentru unele scene sau meniuri. De asemenea, cu ajutorul imaginilor se simulează mișcarea folosind diferite imagini cu diferite poze se succed la intervale foarte scurte de timp (sprites). Imaginile se folosesc și pentru încorporarea obiectelor 3D (texturi).

Care este diferența dintre grafica 2D și 3D?

Grafica digitală se poate împărți în grafică bidimensională și tridimensională. Această clasificare se referă în general la abordarea pe care o vom folosi când desenăm, deși rezultatul final va fi în ambele cazuri bidimensional, având în vedere că și ecranul calculatorului este bidimensional.

În cazul graficii 2D, spațiul în care desenăm se numește pânză (canvas). Aici desenăm sau colorăm diferite forme sau imagini. Acest concept este simplu, deoarece se desfășoară în numai două dimensiuni, dar, având în vedere că de obicei este urmat de imagini rasterizate, este mai greu de modificat. În cazul graficii 3D, nu există un spațiu pentru desenare definit clar, procesul are câțiva pași. Mai întâi, folosind poligoanele definim obiectele tridimensionale într-un spațiu 3D nelimitat, apoi încorporăm poligoanele în imagini. La final, în procesul de proiecție, acestea sunt transformate într-o imagine 2D pe ecran. Pe de o parte, grafica 3D este mai complicată în ceea ce privește setările față de grafica 2D, dar dar pe de altă parte, elementele 3D, odată definite, sunt mai ușor de manipulat ulterior. JavaScript are suport pentru grafica 2D și 3D prin diferite elemente HTML contextuale și tehnologia WebGL.

Ce sunt Create.js și Phaser?

Ca să creăm jocuri în browserul web, se trece prin mai multe etape. Aceste etape trebuie cunoscute foarte bine de oricine dorește să creeze jocuri, deși nu trebuie parcurse toate pentru a crea propriul produs. Adesea, etapele de bază (grafica, animația, controlul etc.) sunt lăsate în seama unui produs finit (o bibliotecă care corespunde nevoilor). Două biblioteci care au demonstrat că funcționează bine în contextul jocurilor JavaScript sunt Create.js și Phaser. Create.js este platforma generică, care este alcătuită din patru produse separate, dar compatibile (biblioteca pentru grafică, animație, sunet și preloading). Se folosește pentru crearea jocurilor, dar și a altor produse care solicită grafică 2D cu performanță înaltă în cadrul browserului web.

Phaser este o platformă orientată pe crearea jocurilor JavaScript/HTML pentru browserul web. Spre deosebire de Create.js, este specializată în jocuri, așa că programatorul nu trebuie să se ocupe de foarte multe detalii pentru a ajunge la rezultatul inițial.

Este greu, și dacă da, cât de greu, să faci un joc?

Crearea jocurilor pe calculator este complicată. Există mulți factor de care trebuie să ținem cont. Performanța, memoria, experiența de utilizator, grafica etc. În acest sens, crearea jocurilor este grea. Chiar și cu platforme simple ca JavaScript și HTML.

Dar în practică nu este greu deloc. Dacă folosim JavaScript, mai multe probleme pe diferite niveluri sunt deja rezolvate. Acesta este un limbaj cu foarte multe cadre și biblioteci și are o soluție pentru aproape orice problemă generică. Și pentru tot ce nu putem rezolva, există întotdeauna soluții gata-făcute. Cu diversele unelte pe care le are momentan la dispoziție, dezvoltatorul se poate concentra ușor pe probleme esențiale în crearea unei aplicații sau a unui joc.

Planul și programa cursului:

Planul și programa cursului:

1. Lucrul cu grafica

  • Gestionarea graficii cu ajutorul lui DOM
  • Lucrul cu elementul canvas
  • Utilizarea lui WbGL
  • Gestionarea multimedia (audio și video)
  • Three.js framework

2. Gestionarea timpului cu ajutorul funcțiilor de timing

  • setTimeout
  • setInterval
  • requestAnimationFrame

3. Conectarea cu serverul

  • Node.js
  • Utilizarea lui WebSocket

4. Interacțiunea cu utilizatorul

  • Gestionarea funcțiilor mouse-ului
  • Gestionarea evenimentelor de pe tastatură

5. Lucrul cu biblioteca Create.js

  • Introducere în create.js și inițializarea aplicației
  • Crearea scenei
  • Setarea formelor de bază pe scenă, bounding boxes (casete de delimitare)
  • Lucrul cu sprites (atlase, sprite sheets, animația sprites)
  • Interacțiunea cu utilizatorul (controlul tastaturii și al mouse-ului)
  • Lucrul cu biblioteca Box2D

6. Adobe Animate CC

  • Introducere și familiarizarea cu mediul
  • Scene, simboluri și timeline
  • Animație, frame-uri și tween-uri cheie
  • Exportul aplicației

7. Crearea jocurilor cu ajutorul lui phaser framework

  • Introducere în phaser și crearea și configurarea proiectului phaser
  • Crearea obiectului jocului, pregătirea și încărcarea resurselor
  • Animație și intrare de utilizator
  • Interacțiunea dintre obiecte, fizică și lucrul cu particule

Animation and Game Development

3 moduri de a obține un job bine plătit

Am pregătit un document în care puteţi descoperi trei moduri de a obţine un job bine plătit pentru profesioniştii care lucrează pe calculator. Descărcați raportul aici

Înscrierea pentru generaţia 2019/20 se face aici.

Pentru a afla totul despre înscriere, click aici.