Prezentarea site-ului HTML5 48 Demo-uri ucigatoare potențiale

Ați auzit că toate zvonurile despre HTML5 vor prelua Adobe Flash. În timp ce majoritatea comunității web susține că este posibil sau nu, trebuie să rătăciți ceea ce face ca HTML5 să fie atât de puternic încât chiar compania uriașă Apple vrea să o folosească pentru a înlocui Flash.

De aceea, acest post există, nu vom vorbi despre ce poate face HTML5, dar arată demo-uri live despre lucruri magice pe care HTML5 le poate realiza cu alte limbi, cum ar fi JavaScript, așa că pregătește-te să te inspirați.

Notă: Întrucât HTML5 nu este complet acceptat de anumite browsere web precum Internet Explorer, vă recomandăm cu insistență să utilizați browserul Firefox pentru a vedea toate demonstrațiile HTML5 de mai jos.

Animaţie

Elementul de canvas al HTML5 este factorul decisiv pentru ca HTML5 să înlocuiască anumite animații Flash. Acesta vă permite să creați redarea dinamică și scriptabilă a formelor 2D și a imaginilor bitmap cu Javascript, care prin alte mijloace este animație controlabilă.

Audioburst Animație

O animație confortabilă și fantastică creată cu panza HTML5 și eticheta audio.

Piscină cu bile

Fiind prezentat în ultimul eveniment Google I / O, această demonstrație vă arată cât de dinamic poate fi HTML5.

Blob Sallad

O creatură produsă de HTML5 care te-ar mulțumi.

Bomomo

Cu Bomomo, puteți observa diferite mișcări atomice simulate cu HTML5.

Browser Ball

Uitați-vă la această minge HTML5 "încrucișată".

Bule

Distrează-te prin crearea bulelor plutitoare nesfârșite cu culori diferite.

Canvas Cartoon Animation

Un desen animat simplu și amuzant HTML5 care vă ajută să înțelegeți ce poate face elementul canvas al HTML5.

Coolclock

Un ceas analogic frumos, personalizat, construit de HTML5 și JavaScript.

Flickr PS3 Slideshow

Vizualizați fotografiile Flickr cu prezentări de stil PS3 în browserul web.

Interactiv Polaroid

Un demo interactiv care funcționează destul de similar cu interfața multi touch.

JS Focuri de artificii

Bucurați-vă de momentul focurilor de artificii cu gravitatea și viteza preferate, alimentate de HTML5 și Javascript.

Caleidoscop

Un calidoscop HTML5 foarte frumos și futurist.

Particule lichide

Animație sensibilă a particulelor care reacționează pe baza mișcării mouse-ului.

mesmerizer

O altă demonstrație HTML5 delicată și remarcabilă, care arată modul în care elementele din apropiere reacționează cu mișcarea mouse-ului.

Nebula nori

Fii pierdut cu această minunată nebuloasă HTML5.

papalaxă

Vizualizați toate formele 2D în perspectivă paralelă.

Particle Animation

O animație elegantă de particule HTML5 care se poate forma în mesajul dvs. preferat.

răspândire

Fii pierdut cu această animație nesfârșită.

Starfield

O animație foarte cool HTML5 care ar schimba direcția și viteza pe baza mișcării mouse-ului.

Distrugerea video

Un clic pentru a boom-o clip video.

Formă de undă

Observați cum se deplasează valul canelurii HTML5 prin modificarea amplitudinii, lungimii de undă, lățimii etc..

Efectul 3D

Impresionat de animația din panza? Este mai mult elementul de canvas al HTML5, și se numește efect 3D. Programatorul se poate baza pe elementul canvas, DOM și JavaScript pentru a crea efect 3D, care poate fi dezvoltat ulterior în animație sau joc 3D.

Canvas3D și Flickr

Beneficiați de o experiență 3D nouă cu ajutorul fluxului fotografic Flickr.

Simulare de pânză

O simulare de pânză pe bază de HTML5 realistă.

Monster în evoluție

Observă un monstru care evoluează într-o creatură complicată, unul dintre creatorii săi este HTML5.

Cutie cadou Google

Motor de căutare gigant Google este prezentat în vizualizare 3D, care poate fi redată.

JS Touch

O prezentare de înaltă calitate și realistă "3D pe caneluri 2D".

Prezentarea datelor

În timp ce elementul canvas HTML5 poate fi folosit pentru a crea animație și efect 3D, poate fi implementat și pentru a prezenta date matematice.

gnuplot

Gnuplot, o aplicație de plotare a datelor în versiunea HTML5.

RGraph

RGraph oferă o gamă largă de prezentări de date, cum ar fi diagrama de bare, bara de progres și graficul tradițional de radare.

Aplicatie web

În cele din urmă, folosind toate posibilitățile combinate cu HTML5 și alte langauge, se poate crea o aplicație sau un joc interactiv care se apropie de aplicația Flash.

CanvasPaint

Martorul fratelui Microsoft Paint intră în browser-ul dvs. 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 o imagine de desene animate interesantă cu acest constructor minimal și interactiv de desene animate.

Trageți ceva aici

Trageți tot ce puteți trage în demo pentru a afișa detalii.

Schița Gartic

O aplicație HTML5 originală care vă permite să faceți niște desene de bază care pot fi salvate în format de imagine diferit, cum ar fi jpeg sau png.

PhysicSketch

Desenați tot ce vă place ș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.

Convorbire scurtă

O aplicație web care confirmă poziția geografică a mesajului legat de vreme, achiziționat de pe Twitter, formându-l astfel într-o hartă a "vremea socială" bazată pe panza, destul de trivială (după cum a spus autorul), dar interesantă.

Joc

3Bored

Nu te-ai plictisi niciodată dacă poți să eviți sute de gloanțe HTML5 în următoarea secundă.

Izbucni

Rebound mingea pentru a sparge toate cărămizi.

Canvascape

Nu este chiar un joc, dar demonstrează modul în care HTML5 poate fi folosit pentru a dezvolta un joc de browser pentru prima persoană.

Prinde-l

Câte bile puteți să scăpați pentru a obține pătratul HTML5 câștigător?

Reacție în lanț

Lanțul de explozie pentru a atinge obiectivul, nu te dependente.

Cubeout

Redați jocul Tetris în 3D, de sus în jos.

etchaPhysics

Desenați un element pentru a muta mingea în stea, nu uitați de gravitate.

Jigsaw Puzzle

Faceți clic, rotiți și aruncați bucăți de puzzle pentru a rezolva acest puzzle-uri bazate pe HTML5.

Slide Puzzle

Glisați spre victorie, un alt joc HTML5 construit pentru a vă stoarce sucul de minte.

Același joc

Eliminați un anumit grup pentru a obține un alt grup asociat în aceeași culoare și veți obține în cele din urmă o victorie.

Tetris

Unul dintre jocurile cele mai clasice a revenit la viață prin HTML5.

Torus

Un alt joc Tetris în versiunea pseudo-3D.

Concluzie

Care este limitarea HTML5? În acest moment nu putem decide, dar cu videoclipul impresionant de mai jos putem ști cât de departe a fost împins HTML5:

Da, este Quake II în browserul web, deci acum este foarte clar că, cu ajutorul HTML5, s-ar naște mai multe aplicații web inovatoare pentru a servi miliarde de utilizatori de internet. Este rapid, este în evoluție și se schimbă web-ul web. Întrebarea este, cum ai folosi acest HTML5 care schimbă jocul?

Îți place să-ți auzi ideea!