Html5 on Enrico Rossomando

From Adobe Illustrator to HTML5 Canvas

Sat, 11 May 2013 17:07:00 +0000

Il fenomeno HTML5 cresce sempre di più col passare del tempo, se ne discute molto in rete e sembra non terminare mai la battaglia tra HTML5 e Flash. Se poi si finisce sul mobile iniziano i confronti tra WEB e NATIVO, ma non è di questo che voglio parlare.

Così come cresce la moda di HTML5 iniziano a proliferare anche diversi strumenti e framework. Quello che segue è uno strumento che attribuisce al canvas un potenziale enorme per lo sviluppo di animazioni ed interfacce vettoriali che prima era molto complicato ottenere e che funzionano bene su tutti i moderni browser e dispositivi mobili.

The concepts of WebGL

Sat, 27 Apr 2013 16:06:00 +0000

Interessante articolo su hacks.mozilla.org che introduce e chiarisce alcuni concetti fondamentali dietro le WebGL.

What is WebGL?

WebGL is a Web API that allows low-level graphics programming. “Low-level” means that WebGL commands are expressed in terms that map relatively directly to how a GPU (graphics processing unit, i.e. hardware) actually works. That means that WebGL allows you to really tap into the feature set and power of graphics hardware. What native games do with OpenGL or Direct3D, you can probably do with WebGL too.

Link all’articolo su hack.mozilla.org: The concepts of WebGL

L’articolo non si pone come un ennesimo tutorial, infatti, alla fine, segnala delle risorse molto utili per iniziare a programmare con le WebGL.

CanvasLoader Creator

Tue, 05 Mar 2013 23:49:00 +0000

CanvasLoader Creator è una piccola libreria javascript (5.8kb minificata) che vi permette di riprodurre nel

Sul sito c’è un piccolo pannello di controllo che vi permette di settare i diversi parametri e vedere il risultato in tempo reale.

I vantaggi dell’utilizzare una libreria del genere sono diversi:

5kb sono meno di una gif animata (circa 100x100)
Il colore, la velocità e tanti altri parametri possono essere cambiati in tempo reale e quindi riprodurre effetti più carini a seconda delle situazioni
La dimensione può essere cambiata e quindi adattata alle diverse interfacce
Il codice necessario per utilizzarla è semplicissimo

HTML5 | Javascript canvas experiments

Sun, 03 Feb 2013 01:02:06 +0000

http://www.dhteumeuleu.com/ una raccolta di diversi esperimenti in HTML5 che fanno uso del Canvas senza nessun aiuto da parte di plugin come Flash…

Per ogni esperimento è possibile visualizzare anche il codice sorgente per capire come è stato implementato. Molto utile per scoprire nuove tecniche di animazione e di gestione del canvas.

Twitter button

Fri, 01 Feb 2013 01:02:04 +0000

Un fantastico bottone fatto completamente in CSS… e l’animazione all’hover è veramente carina :), per vederlo live andate a questo indirizzo: http://codepen.io/bennettfeely/pen/ErFGv Grazie a Erik Deiner’s

Tweet Button with CSS Animation