Ai auzit toate zvonurile despre faptul că HTML5 va prelua Adobe Flash. În timp ce cea mai mare parte a comunității web susține că este posibil sau nu, trebuie să vă întrebați ce face HTML5 atât de puternic încât chiar și gigantul Apple vrea să îl folosească pentru a înlocui Flash.
De aceea există acest post, nu vom vorbi despre ce poate face HTML5, ci vom arăta demonstrații live de lucruri magice pe care HTML5 le poate realiza cu alte limbaje precum JavaScript, așa că pregătiți-vă să fiți inspirați.
Nota: Deoarece HTML5 nu este pe deplin suportat de anumite browsere web, cum ar fi Internet Explorer, vă recomandăm insistent să folosiți browserul Firefox pentru a vizualiza toate demonstrațiile HTML5 de mai jos.
Animare
Elementul canvas al HTML5 este factorul decisiv pentru ca HTML5 să înlocuiască anumite animații Flash. Acesta vă permite să construiți o redare dinamică, cu scripturi, a formelor 2D și a imaginilor bitmap cu Javascript, ceea ce, cu alte cuvinte, este o animație controlabilă.
Audioburst Animation
O animație confortabilă și fantastică creată cu canvas-ul HTML5 și tag-ul audio.
Ball Pool
Fost prezentată în cadrul ultimului eveniment Google I/O, această demonstrație vă arată cât de dinamic poate fi HTML5.
Blob Sallad
O creatură creată în HTML5 care v-ar face plăcere.
Bomomo
Cu Bomomo, puteți observa diferite mișcări atomice simulate cu HTML5.
Browser Ball
Să fiți uimit cu această minge HTML5 „cross-browser”.
Bubbles
Distrați-vă creând bule plutitoare nesfârșite cu culori diferite.
Canvas Cartoon Animation
Un desen animat HTML5 simplu și amuzant care vă ajută să înțelegeți ce poate face elementul canvas al HTML5.
Coolclock
Un ceas analogic drăguț și personalizabil construit prin HTML5 și JavaScript.
Flickr PS3 Slideshow
Vezi fotografiile tale de pe Flickr cu un slideshow în stil PS3 în browserul web.
Polaroid interactiv
Un demo interactiv care funcționează destul de asemănător cu interfața multi touch.
JS Fireworks
Descoperiți momentul focurilor de artificii cu gravitația și viteza pe care o preferați, cu ajutorul HTML5 și Javascript.
Kaleidoscop
Un caleidoscop HTML5 foarte frumos și futurist.
Particule lichide
Animare sensibilă a particulelor care reacționează în funcție de mișcarea mouse-ului.
Mesmerizer
O altă demonstrație HTML5 sensibilă și remarcabilă care arată cum reacționează elementele din apropiere în funcție de mișcarea mouse-ului dumneavoastră.
Nebula Cloud
Pierdeți-vă cu această minunată nebuloasă HTML5.
Parallax
Vezi toate formele 2D în perspectivă paralelă.
Animație de particule
O animație elegantă de particule HTML5 care se poate forma în mesajul preferat.
Spread
Pierdeți-vă cu această animație de răspândire fără sfârșit.
Starfield
O animație de câmp stelar HTML5 foarte mișto, care și-ar schimba direcția și viteza în funcție de mișcarea mouse-ului tău.
Distrugere video
Un singur clic pentru a bombarda un video în curs de redare.
Waveform
Observați cum se mișcă unda canvas din HTML5 modificându-i amplitudinea, lungimea de undă, lățimea, etc.
3D Effect
Impresionat de animația canvas? Asta este mai mult decât poate face elementul canvas din HTML5 și se numește efect 3D. Dezvoltatorul se poate baza pe elementul canvas, DOM și JavaScript pentru a crea efectul 3D, care mai târziu poate fi dezvoltat în animație 3D sau joc.
Canvas3D și Flickr
Aveți o experiență 3D cu totul nouă cu fluxul de fotografii de la Flickr.
Cloth Simulation
O simulare de pânză realistă, bazată pe HTML5.
Evolving Monster
Observați un monstru care evoluează într-o creatură complicată, unul dintre creatorii săi este HTML5.
Google Giftbox
Gigantul motor de căutare Google este prezentat în vizualizare 3D, jucabilă.
JS Touch
O prezentare de înaltă calitate și realistă „3D pe pânză 2D”.
Prezentare de date
În timp ce elementul Canvas din HTML5 poate fi folosit pentru a crea animații și efecte 3D, acesta poate fi implementat și pentru a prezenta date matematice.
Gnuplot
Gnuplot, o aplicație de trasare a datelor în versiune HTML5.
RGraph
RGraph oferă o gamă largă de prezentări de date, cum ar fi diagrama de bare, bara de progres și diagrama radar tradițională.
Aplicație web
În cele din urmă, folosind toate posibilitățile combinate de HTML5 și alte langauge, se poate crea o aplicație interactivă sau un joc care se apropie de aplicația Flash.
CanvasPaint
Vezi că fratele lui Microsoft Paint vine în browserul tău web, iar tatăl său este HTML5.
CanvasMol
O aplicație științifică care este construită pentru a vă ajuta să înțelegeți structura anumitor elemente ale pământului.
Cartoon Builder
Desenați imagini interesante de desene animate cu acest constructor de desene animate minimalist și interactiv.
Drag Anything Here
Trageți orice puteți trage în demo pentru a arăta detalii.
Gartic Sketch
O aplicație originală HTML5 care vă permite să faceți câteva desene de bază care pot fi salvate în diferite formate de imagine, cum ar fi jpeg sau png.
PhysicSketch
Desenați orice doriți și vedeți cum reacționează cu gravitația simulată.
Sketchpad
O aplicație puternică de desen HTML5 care vă permite să desenați și să editați imaginea în mod precis.
Smalltalk
O aplicație web care confirmă poziția geografică a mesajelor legate de starea vremii achiziționate de pe Twitter, formând astfel o hartă a „vremii sociale” pe bază de canvas, destul de banală (după cum afirmă autorul), dar interesantă.
Joc
3Bored
Nu te vei plictisi niciodată dacă poți continua să te ferești de sute de gloanțe HTML5 în următoarea secundă.
Breakout
Răsucește mingea pentru a sparge toate cărămizile.
Canvascape
Nu este chiar un joc, dar demonstrează cum HTML5 poate fi folosit pentru a dezvolta un joc de browser First Person Shooting.
Catch It
Câte mingi poți să te ferești pentru a obține pătratul HTML5 câștigător?
Chain Reaction
Înlănțuiți explozia pentru a atinge obiectivul, nu deveniți dependenți.
Cubeout
Jocă Tetris în 3D, vedere de sus în jos.
etchaPhysics
Desenează elementul pentru a muta mingea spre stea, nu uita de gravitație.
Jigsaw Puzzle
Clichează, rotește și aruncă piesele de puzzle pentru a rezolva acest puzzle jigsaw bazat pe HTML5.
Slide Puzzle
Slidează spre victorie, un alt joc HTML5 care este construit pentru a-ți stoarce sucul minții.
Same Game
Îndepărtați un anumit grup pentru a obține un alt grup împerecheat în aceeași culoare și, în cele din urmă, vi se va acorda o victorie.
Tetris
Unul dintre cele mai clasice jocuri readuse la viață de HTML5.
Torus
Încă un joc Tetris în versiune pseudo-3D.
Concluzie
Care este limitarea lui HTML5? În acest moment nu putem decide, dar cu ajutorul impresionantului videoclip de mai jos putem ști cât de departe a fost împins HTML5:
Da, este vorba de Quake II în browserul web, așa că acum este foarte clar că, cu HTML5, se vor naște mai multe aplicații web revoluționare pentru a servi miliarde de utilizatori de internet. Este rapid, evoluează și schimbă world wide web-ul. Întrebarea este, cum ați folosi acest HTML5 care schimbă jocul?
Ne-ar plăcea să vă auzim ideea!
.