CreateJS – Web apps, componenti e giochi in HTML

Building bootstrap responsive layout
14 aprile 2017
D3.js – Creare chart e infografiche interattive
15 aprile 2017
Frontend Development

CreateJS

Web apps, componenti e giochi in HTML >

CreateJS è una suite Javascript open source che semplifica notevolmente lo sviluppo di applicazioni HTML5 Canvas ed è adatta allo sviluppo di siti e interfacce grafiche creative e originali, infografiche, videogiochi 2D, banner animati, moduli interattivi per la formazione e in tutti gli scenari in cui è necessario svincolarsi dai limiti dell’HTML e del DOM.
CreateJS è composto dalle seguenti librerie Javascript:

  • EaselJS: semplifica lo sviluppo di applicazioni mobile e desktop in HTML5 Canvas
  • TweenJS: un set di API per creare animazioni in HTML5 e HTML5 canvas
  • SoundJS: gestione audio (effetti sonori e soundtrack) in siti e applicazioni HTML5
  • PreloadJS: coordina tutto il processo di caricamento degli asset di un’applicazione

La suite è  supportata ufficialmente da Adobe, Microsoft, Mozilla e AOL, ed è inoltre utilizzata all’interno di diversi software Adobe per gestire il processo di  conversione ed esportazione in formato HTML5.

Prerequisiti

Il partecipante dovrà possedere una certà familiarità nell’utilizzo di Javascript. Le similitudini con il linguaggio Actionscript sono moltissime e di conseguenza anche tutti gli sviluppatori Flash, Flex e AIR si sentiranno subito a loro agio.

Obiettivi formativi

Durante il corso si acquisiranno le basi per l’utilizzo delle librerie EaselJS e TweenJS. Si affronterà la creazione di interfacce grafiche, animate e interattive, in HTML5 Canvas. Queste interfacce sono applicabili in moltissimi contesti: siti internet dal look&feel accattivante, chart, infografiche, banner e ogni tipo di elemento 2D animato e interattivo, videogiochi, componenti per dispositivi touch e molto altro. Tutti gli argomenti sono affrontati dal punto di vista teorico e accompagnati da moltissimi esercizi dimostrativi che saranno sviluppati e descritti durante il corso.

Programma

  • Installazione e configurazione
  • Introduzione a CreateJS e EaseJS
  • Graphic API
  • Shapes
  • Linee, bordi e riempimenti
  • Display list
  • Testi dinamici
  • Gestione immagini
  • Mouse e touch events
  • PreloadJS
  • Tween JS e le animazoni:
  • Data-driven charts:
  • Responsive apps: web, mobile e desktop