Realizzare uno screencast con un web service free

Innanzitutto: cos’è uno screencast?
Screencast è una parola coniata da Jon Udell, “evangelista” tecnologico ( come riferito su Wikipedia ) attualmente in Microsoft, che propose ai lettori del suo Blog di proporre un termine per definire una moda che, all’ora, stata prendendo piede: realizzare un video che mostrasse l’attività dell’autore sul proprio desktop.

Oltre a molti software installabili, come Screenium su piattaforma Mac, ci sono anche servizi web che si basano su plug-in in Java oppure su Chrome App.

Ho avuto la possibilità di testare il servizio offerto gratuitamente dal sito http://www.screencast-o-matic.com e il risultato è stato abbastanza positivo.

La qualità generata non è il massimo, così come il frame rate che pare essere un po’ più lento del previsto. Esiste anche una versione PRO, che propone alcune caratteristiche aggiuntive spendendo pochi dollari all’anno.

Eccoti la tabella delle differenti versioni:

Validare un file JSON

jsonlint screenshotMolti di voi avranno a che fare, quotidianamente, con la questione JSON e la sua struttura.
Spesso e volentieri il codice è generato lato server, quindi avrete la necessità, in pochi click, di sapere se il file esportato è valido oppure no.

Per questa problematica ci viene incontro un sito, jsonlint.com, che, molto semplicemente, ci permette di incollare il codice e verificarne la correttezza.

Un esempio di JSON lo potete trovare nel nostro script per la creazione di un News Slider in jQuery, dove forniamo allo script la base dati in un file json, appunto.

jQuery Transit: trasformazioni e transizioni super fluide con CSS3

Oggi parliamo di jQuery Transit, una libreria per jQuery che facilita la creazione di trasformazioni e transizioni CSS3 attraverso l’uso di jQuery.

La versione commentata e completa pesa solamente 17kb, mentre la minified-version occupa 2kb. Come in tutti i plugin di jQuery che si rispettino, l’utilizzo è di una semplicità disarmante e si basa sull’uso del metodo .transition() invece che sul classico .animate().

Il supporto per i browser è limitato a: IE10, Firefox 4+, Safari 5+, Chrome 10+, Opera 11+ e Mobile Safari. Per quanto riguarda i browser che, ahimè, non supportano nessuna animazione o trasformazione CSS3, non saranno attive le trasformazioni.

Tutti questi plugin permettono attività bellissime dal punto di vista grafico, mentre per quanto riguarda la retro compatibilità avremo sempre molti problemi: è il prezzo da pagare soprattutto alla signora Microsoft ed ai suoi browser, che fino alla versione 9 hanno cavato da noi programmatori / designer davvero il peggio, in termini di parolacce ed insulti.

Sito ufficiale di jQuery Transit: http://ricostacruz.com/jquery.transit/

Adobe Creative Cloud: recensione

Adobe Creative Cloud
Vi postiamo qualche schermata del Cloud di Adobe, che ha, dalla versione CS6, fornito ai propri clienti questo nuovo sistema di licenza, che permette, a fronte di una spesa mensile, di usufruire di tutti gli applicativi, sia desktop che mobile, della software house californiana.

Appena effettuato il login, la schermata si presenta così:

Cliccando in alto su Applicazione e Servizi, si accede all’elenco degli applicativi installabili in locale sui PC/MAC dell’utente.
Chiariamo, poichè le spiegazioni in merito da parte di Adobe non sono di primo acchito chiarissime, che Creative Cloud permette l’utilizzo di tutti i software Adobe e di uno spazio web da 2gb espandibile: ogni applicazione sarà poi scaricabile in locale, installabile ed utilizzabile senza alcun bisogno di linea internet disponibile.

Adobe Dreamweaver CS6
Ci sono alcune succose novità per quanto riguarda Dreamweaver.
La prima è quella di poter creare, con un semplice click, un layout fluid grid style ( o tradotto in italiano, Layout a griglia fluida ): attraverso l’utilizzo delle colonne di riferimento poste sul background, è possibile indicare al CSS quale layout avrà nelle 3 configurazion principali: smartphone, tablet e desktop.

Dreamweaver andrà, sulla base delle vostre indicazioni, a generare un CSS utilizzando le media query, ossia indicando quale grafica dovrà avere ogni singolo elemento nelle visualizzazioni diverse. Questa tecnica è alla base del responsive design, ossia il realizzare una grafica che sia “responsiva” del device che si sta utilizzando: avremo quindi una grafica diversa ma controllata a seconda che si stia navigando con un PC fisso, un tablet oppure uno smartphone, lavorando sulla dimensione in pixel della laghezza della finestra.

Accanto alla possibilità di lavorare in maniera automatica ( ma fino ad un certo punto ) con le fluid grid, c’è l’integrazione con jQuery Mobile e Phonegap, progetto open source acquisito proprio da Adobe. Si potrà, con pochi click e previa registrazione ai servizi online di Phonegap, esportare il proprio progetto mobile in vari formati contemporaneamente ( iOs, Android, Blackberry, WebOS e Symbian ).

 

Curtain.js: plugin jQuery per gestire alcune transizioni in pagina

Curtain.js è uno di quei plugin che posso tornare molto utili in alcuni casi.
Poniamo il caso di dover mostrare un pannello che, normalmente, rimane nascosto alla vista del visitatore: ecco, curtain.js può fare al caso nostro.

Realizzato da Victor Coulon ( seguilo su Github o su Twitter ), il plugin permette di gestire, mostrare, nascondere e scrollare alcuni pannelli, contenenti foto, testi e tutto quello che può servire.

Pur essendo molto snello come codice, ho trovato ( opinione personale ) un pelo di lentezza nello scroll di contenuti grafici tipo foto fullscreen, mentre il ritorno con testi e foto piccole è eccellente.
La compatibilità con altri script è un po’ borderline: ho riscontrato, per esempio, che utilizzando qualche ChromeApp, queste ultime si schiantano allegramente direttamente sulla Home di curtain.js.

Quindi: usare, ma ( per quanto mi riguarda ) con moderazione.

Come per tutti i plugin, vale di più la pena di andare sul sito ufficiale e testare con mano il funzionamento.