Produzione (e postproduzione) dei video di TechEd con Silverlight Streaming via Movie Maker e Expression Encoder

Siete curiosi di sapere come abbiamo realizzato i video di TechEd? Io penso di sì :) Spero che le informazioni vi siano di aiuto e chissà... magari inizierete a registrare e a pubblicare i video anche voi!

Registrazione. I video sono stati registrati con una telecamera che utilizza il formato Mini-DV. Niente hard disk interno quindi, ma registrazione digitale su tape.

Acquisizione. Una volta registrato il video lo abbiamo importato in Movie Maker (Windows Vista Ultimate SP1) utilizzando la connessione FireWire della telecamera.

Montaggio. Il montaggio l'ho fatto utilizzando Movie Maker, per inserire il video iniziale e finale, tagliare parte dei video, impostare passaggi e dissolvenze, e per mettere in overlay il logo di EDGE. I video sono stati esportati in formato "Windows Media DVD Quality PAL", con un bitrate di 3 Mbps, risoluzione 720x576 px (la stessa del video originale), 25 fps.

Player Silverlight. Come avrete notato, i video sono all'interno di un player Silverlight. Per realizzarlo ho utilizzato Expression Encoder. Ho importato il video generato da Movie Maker, ho impostato i Markers (i punti del video in cui è possibile saltare utilizzando le immagini che appaiono nella parte alta del box video), ho inserito i Metadata e qundi ho scelto il player che sarebbe stato utilizzato (il modello "Clean") e il formato di output.

Per lo streaming ho utilizzato il servizio free offerto da Silverlight Streaming (4 GB di storage gratuiti, limite di 22Mb per i file video caricati), e per l'encoding del video ho utilizzato il codec "Streaming 512k DSL (AP)" con "Two pass encoding". In questo modo la risoluzione è passata 320x240 px e il bitrate finale è risultato di 446Kbps. Per un video di 8 minuti circa siamo passati dai 156 Mb dell'output di Movie Maker a 20 Mb del file di output prodotto da Expression Encoder, che ha mantenuto comunque una buona qualità video.

Preparazione dei files per il Publishing. Per pubblicare i video prodotti su Silverlight Streaming ho seguito i consigli di Pietro e di Roberto, con qualche piccola modifica (... gli IT Pro son sempre un passo avanti! :) ).

Una volta che Expression Encoder ha terminato l'elaborazione del video (e del player) ho creato un file Manifest.xml con questo testo:

<SilverlightApp>
<version>1.0</version>
<loadFunction>StartWithParent</loadFunction>
<jsOrder>
   <js>MicrosoftAjax.js</js>
   <js>BasePlayer.js</js>
   <js>PlayerStrings.js</js>
   <js>player.js</js>
   <js>StartPlayer.js</js>
</jsOrder>
</SilverlightApp>

Ho poi modificato il file StartPlayer.js per disabilitare l'AutoPlay del video cambiando il parametro dell'AutoPlay:

StartPlayer_0.prototype= {
    _handleLoad: function() {
        this._player = $create(   ExtendedPlayer.Player,
                                  { // properties
                                    autoPlay : false,
                                    volume      : 1.0,
                                    muted       : false
                                  },

Crezione del package. Ho seguito quindi le istruzioni che ho trovato qui, e ho creato un file .zip con all'interno tutti i file presenti nella directory di output scelta da Expression Encoder, togliendo i file default.htm, project.csproj e Silverlight.js e aggiungendo il Manifest.xml appena creato.

Upload su Silverlight Streaming. Una volta creato il file .zip, sono andato su http://silverlight.live.com/ e ho effettuato l'upload del file come nuova applicazione Silverlight. Una volta testato il funzionamento ho cercato di capire come integrare il player Silverlight all'interno dei post del blog.

Il metodo iFrame. Per inserire il player senza aggiungere script lato server ho utilizzato la metodologia di publishing via iFrame, molto semplice da seguire. E' sufficente infatti indicare nel tag HTML dell' iFrame il proprio "Account ID" registrato il Silverlight Streaming e il nome dell'applicazione e personalizzare ad esempio la dimensione del controllo. Ad esempio, questo è il codice che ho usato per il video di Fabio:

<iframe
src="http://silverlight.services.live.com/invoke/19803/
TechEd_IT_Forum_2007_04/iframe.html"
frameborder="0" width="480" scrolling="no" height="360"
mce_src="http://silverlight.services.live.com/invoke/19803/
TechEd_IT_Forum_2007_04/iframe.html">
</iframe>

Direi che l' "esperimento" è riuscito. L'utilizzo di Silverlight Streaming ci ha permesso di superare le latenze che qualche volta è possibile avere con SoapBox e ci ha permesso di personalizzare anche i parametri del player e la qualità del video.

Sarebbe stato utile non avere il limite a 22Mb e poter sfruttare in modo più flessibile lo storage messo a disposizione gratuitamente da Silverlight Streaming, ma i risultati che si possono ottenere anche in questo modo mi sembrano già più che buoni.

E voi cosa ne pensate? Avete già fatto delle prove?

Renato