Canvas, guida pratica

25 aprile 2012

Canvas, tra gli elementi di HTML5 è forse quello di maggior impatto. Una guida per essere subito produttivi sfruttando le librerie esterne. Esempi e codice pronto all'uso

  1. 1. Canvas, approccio procedurale e librerie
    Una tela su cui disegnare, anche in tre dimensioni, ma meglio se con...

Canvas e Processing.js

  1. 2. Un'infografica con Canvas e Processing.js
    Mettere insieme Canvas e Processing.js, la libreria dell'MIT dedicata...
  2. 3. Creare un progetto Processing.js
    Esaminare la struttura di un progetto Processing.js attraverso un...
  3. 4. Scambio dati tra Processing.js e Javascript
    I meccanismi di condivisione dei dati tra librerie e l'utilizzo di...
  4. 5. Disegno e animazione con Processing.js e Canvas
    Sfruttare le funzioni di disegno di Processing.js per rappresentare...
  5. 6. Gestire le collisioni in Canvas con Processing.js
    Gestire le collisioni tra oggetti grafici effettuando controlli sulle...
  6. 7. Colori e testi su Canvas con Processing.js
    Inserire e manipolare scritte e tipi di caratteri. Impostare colori...
  7. 8. L'interazione con l'utente con Processing.js
    Leggere e gestire gli eventi di tastiera e mouse e creare azioni...

Videogiochi su Canvas

  1. 9. Easel.js, sprite e videogame su canvas
    Scoprire la libreria per eccellenza per creare videogiochi e...
  2. 10. Muovere gli sprite con Easel.js e Kibo
    Interagire con animazioni e videogiochi tramite tastiera
  3. 11. Gestire sequenze di sprite ed eventi
    Programmare le reazioni delle animazioni a comandi ed eventi
  4. 12. Gestire le Collisioni
    Un elemento fondamentale nella creazione di videogame: le collisioni...

Canvas e tipografia

  1. 13. Web font in Javascript su Canvas
    Manipolare font e scritte direttamente sull'elemento canvas di HTML5
  2. 14. Custom font e WebFont Loader
    Utilizzare i web font e gestirne il caricamento
  3. 15. Font su Canvas: allineamento e spaziatura caratteri (Kerning)
    Sfruttare le API 2D del canvas per gestire la spaziatura dei...
  4. 16. Font e canvas: effetto 'Cono di luce' e Texture
    Come applicare effetti customizzati e sovrapporre texture alle nostre...

Canvas e il 3D

  1. 17. Three.js, la WebGL API semplificata
    Canvas come base per sviluppare applicazioni e giochi 3D
  2. 18. Scena e Camera, creare il mondo 3D
    Inizializzare e manipolare gli oggetti che compongono la scena 3D
  3. 19. Luci e materiali con Three.js
    Definire il materiale dei modelli 3D e impostare i punti di...
  4. 20. Rendering e animazione 3D
    Il disegno della scena sullo schermo utilizzando WebGL o le API 2D...
Se vuoi aggiornamenti su Canvas, guida pratica inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su Canvas, guida pratica

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento di cui al punto 3 dell'informativa sulla privacy