HTML5 Website Showcase 48 Potenziali dimostrazioni di uccisioni Flash

Quindi hai sentito tutte le voci su HTML5 prenderebbe su Adobe Flash. Mentre la maggior parte delle comunità web sostiene che è possibile o no, devi essere in giro a rendere ciò che rende HTML5 così potente che persino la grande azienda Apple vuole usarlo per sostituire Flash.

Ecco perché questo post esiste, non parleremo di cosa può fare HTML5, ma mostra dimostrazioni dal vivo di cose magiche che HTML5 può raggiungere con altri linguaggi come JavaScript, quindi preparati ad essere ispirato.

Nota: poiché HTML5 non è completamente supportato da alcuni browser Web come Internet Explorer, si consiglia vivamente di utilizzare il browser Firefox per visualizzare tutte le demo HTML5 di seguito.

Animazione

L'elemento canvas di HTML5 è il fattore decisivo per HTML5 per sostituire determinate animazioni Flash. Permette di creare un rendering dinamico e programmabile di forme 2D e immagini bitmap con Javascript, che in altre parole è un'animazione controllabile.

Animazione audioburst

Un'animazione comoda e fantastica creata con canvas e tag audio HTML5.

Piscina di palline

Presentata nell'ultimo evento Google I / O, questa demo mostra quanto può essere dinamico HTML5.

Blob Sallad

Una creatura generata da HTML5 che ti piacerebbe.

Bomomo

Con Bomomo, puoi osservare diversi movimenti atomici simulati con HTML5.

Browser Ball

Lasciati stupire da questa palla HTML5 "cross-browser".

bolle

Divertiti creando infinite bolle fluttuanti con colori diversi.

Animazione di cartone animato di tela

Un fumetto HTML5 semplice e divertente che ti aiuta a capire cosa può fare l'elemento canvas di HTML5.

CoolClock

Un simpatico orologio analogico personalizzabile costruito da HTML5 e JavaScript.

Slideshow Flickr PS3

Guarda le foto di Flickr con la presentazione in stile PS3 nel browser web.

Polaroid interattivo

Una demo interattiva che funziona in modo simile all'interfaccia multi-touch.

Fuochi d'artificio JS

Goditi il ​​momento dei fuochi d'artificio con la tua gravità e velocità preferite, potenziato da HTML5 e Javascript.

Caleidoscopio

Un caleidoscopio HTML5 molto bello e futuristico.

Particelle liquide

Animazione di particelle sensibili che reagisce in base al movimento del mouse.

mesmerizer

Un'altra demo HTML5 sensibile ed eccezionale che mostra come gli elementi vicini reagiscono con il movimento del mouse.

Nebulosa Cloud

Perdersi con questa meravigliosa nebulosa HTML5.

Parallasse

Visualizza tutte le forme 2D in prospettiva parallela.

Animazione delle particelle

Un'animazione di particelle HTML5 elegante che può essere inserita nel tuo messaggio preferito.

Diffusione

Perdersi con questa infinita animazione diffusa.

starfield

Un'animazione starfield HTML5 molto interessante che cambierebbe direzione e velocità in base al movimento del mouse.

Distruzione video

Un clic per far esplodere un video.

Forma d'onda

Osserva come si muove l'onda della tela di HTML5 modificandone l'ampiezza, la lunghezza d'onda, la larghezza, ecc.

Effetto 3D

Impressionato dall'animazione su tela? Questo è più che l'elemento canvas di HTML5 può fare e si chiama effetto 3D. Lo sviluppatore può contare su elementi canvas, DOM e JavaScript per creare effetti 3D, che possono essere successivamente sviluppati in animazione 3D o gioco.

Canvas3D e Flickr

Avere una nuova esperienza 3D con il photostream di Flickr.

Simulazione del tessuto

Una simulazione di stoffa realistica basata su HTML5.

Mostro in evoluzione

Osserva un mostro che si evolve in una creatura complicata, uno dei suoi creativi è HTML5.

Google Giftbox

Motore di ricerca gigante Google è presentato in 3D, vista riproducibile.

JS Touch

Una vetrina "3D on 2D Canvas" di alta qualità e realistica.

Presentazione dei dati

Mentre l'elemento canvas di HTML5 può essere utilizzato per creare animazioni e effetti 3D, può anche essere implementato per presentare dati matematici.

gnuplot

Gnuplot, un'applicazione di tracciamento dei dati nella versione HTML5.

RGraph

RGraph offre una vasta gamma di presentazioni di dati come il grafico a barre, la barra di avanzamento e il grafico radar tradizionale.

Applicazione web

In definitiva, utilizzando tutte le possibilità combinate da HTML5 e altre lingue, è possibile creare un'applicazione o un gioco interattivo vicino all'applicazione Flash.

CanvasPaint

Testimone che il fratello di Microsoft Paint arriva nel tuo browser web e suo padre è HTML5.

CanvasMol

Un'applicazione scientifica creata per aiutarti a comprendere la struttura di alcuni elementi della terra.

Costruttore di cartoni animati

Disegna un'interessante immagine del cartone animato con questo generatore di fumetti minimal e interattivo.

Trascina tutto qui

Trascina tutto ciò che puoi trascinare nella demo per mostrare i dettagli.

Schizzo Gartic

Un'applicazione HTML5 originale che consente di creare alcuni disegni base che possono essere salvati in diversi formati di immagine come jpeg o png.

PhysicSketch

Disegna quello che ti piace e guarda come reagiscono con la gravità simulata.

album per schizzi

Una potente applicazione di disegno HTML5 che ti consente di disegnare e modificare la tua immagine in modo preciso.

Smalltalk

Un'applicazione web che conferma la posizione geografica del messaggio meteo acquisito da Twitter, formandoli quindi in una mappa 'social weather' basata su canvas, piuttosto banale (come affermato dall'autore) ma interessante.

Gioco

3Bored

Non ti annoierai mai se riesci a sfuggire a centinaia di proiettili HTML5 nel secondo successivo.

Scoppiare

Rimbalzare la palla per rompere tutti i mattoni.

Canvascape

Non proprio un gioco, ma dimostra come HTML5 può essere utilizzato per sviluppare il browser game di First Person Shooting.

Prenderla

Quante palle puoi schivare per ottenere il tuo quadrato HTML5 vincente?

Reazione a catena

Incatena l'esplosione per raggiungere l'obiettivo, non diventare dipendente.

Cubeout

Gioca a Tetris in 3D, vista dall'alto.

etchaPhysics

Disegna l'oggetto per spostare la palla sulla stella, non dimenticare la gravità.

Jigsaw Puzzle

Clicca, ruota e rilascia i pezzi del puzzle per risolvere questo puzzle basato su HTML5.

Slide Puzzle

Scorri verso la vittoria, un altro gioco HTML5 creato per spremere il tuo succo mentale.

Lo stesso gioco

Rimuovi alcuni gruppi per ottenere un altro gruppo abbinato nello stesso colore e alla fine verrai assegnato a una vittoria.

Tetris

Uno dei giochi più classici riportato in vita da HTML5.

Torus

Ancora un altro gioco di Tetris in versione pseudo-3D.

Conclusione

Qual è la limitazione di HTML5? A questo punto non possiamo decidere, ma con l'impressionante video qui sotto possiamo sapere fino a che punto l'HTML5 è stato spinto:

Sì, è Quake II nel browser web, quindi ora è molto chiaro che con HTML5, sarebbe nata un'applicazione web più innovativa per servire miliardi di utenti internet. È veloce, si sta evolvendo e sta cambiando il world wide web. La domanda è: come useresti questo HTML5 che cambia il gioco?

Ci piace ascoltare la tua idea!