MIX'09: Silverlight 3 Beta, Expression Blend 3 Preview e Internet Explorer 8

Dopo due giorni di MIX, non riesco a tenere a freno l’entusiasmo e sto passando parte delle mie serate a sperimentare con la nuova versione in Preview di Expression Blend 3. Blend 3 it’s magic!
SketchFlow, behaviors, skinning & teamplate, effetti grafici, data binding con “sample data”… una marea di novità che ampliano ulteriormente la libertà nell’esprimere la nostra creatività nello sviluppo di applicazioni RIA.

Cercherò di riassumerle brevemente in modo da fornirvi una completa overview sugli importanti annunci.
In primis la nuova versione di Silverlight 3, attualmente in Beta, che implementa una serie di importanti novità sia in ambito di progettazione sia di sviluppo.
Libero spazio alla nostra creatività!!
Con la nuova versione di Silverlight 3, è possibile gestire in modo nativo, elementi e modelli 3D abilitando quindi l’utente all’interazione e alla manipolazione nel contesto del browser sia in ambiente Windows sia in ambiente Mac. Grandi novità anche in ambito media, come già anticipato qualche mese fa, la nuova versione del plugin, supporterà anche H 264 / AAC – MPEG4, in più sarà supportato lo Smooth Streaming per la fruizione dei video a qualità  Full HD (720p+) sia in contesti “on demand” e su eventi “Live” con possibilità di protezione dei contenuti attraverso DRM con PlayReady. Attraverso Expression Encoder 2 – SP1 è già possibile encondare i video in bitrates diversi per sfruttare le potenzialità dello Smooth Streaming, lato server erogando i video attraverso IIS7 Media Services (per chi volesse avere maggiori dettagli, rimando ad un mio precedente post sul blog di team).
Ma torniamo alle grandi novità, con la nuova versione del plugin sarà possibile far girare le applicazioni Silverlight 3 fuori dal contesto del browser e sul desktop del proprio PC/MAC sia in contesti online e offline. Migliorie in termini di sfruttamento della GPU del proprio PC nell’ottica di ottimizzare la fruizione dei contenuti a qualità HD.
Introdotta anche una nuova funzionalità per permettere il “caching” delle immagini per ridurre i tempi di caricamento dell’interfaccia che rimane comune su più aree dell’applicazione. Nuovi effetti grafici “Pixel Shader Effects” quali blur e drop scadow che possono essere applicati ad ogni contenuto grafico.
Un semplice esempio, volete realizzare il classico effetto di “roll-over” di un bottone, attraverso questa nuova funzionalità vi basterà impostare l’effetto di “shade” all’interno del Visual State Manager del bottone in Expression Blend 3 Preview. Sempre in ambito di “design” di un’applicazione, sarà possibile caricare in modalità “runtime” i “themes” dell’interfaccia grafica attraverso gli stili in modo da modificare completamente l’aspetto e l’interazione degli elementi che costituiscono l’applicazione.
Una serie di nuovi controlli di layout e d’interazione, oltre 60 “out of the box”, che attraverso l’impiego degli stili sarà possibile personalizzarne l’aspetto grafico ed il comportamento.
In ambito di applicazioni Silverlight che utilizzeranno Deep Zoom, grandi migliorie in termini di “performance”  e usabilità dell’applicativo e un occhio di riguardo in merito all’indicizzazione sui motori di ricerca attraverso SEO (search engine optimization) in modo da facilitarne la fruibilità.
Tutto questo e non solo, ho volontariamente riassunto alcune tra le caratteristiche principali, all’interno di un runtime che peserà 40k in meno rispetto alla versione precedente del plugin.

Ma entriamo nel vivo della progettazione e del design, tante funzionalità in più…d’accordo!
Ma per far ciò? Una nuova versione di Expression Blend 3 Preview  arricchito da una serie di funzionalità aggiuntive che permettono di prototipizzare e produrre applicazioni Silverlight 3 e Windows Presentation Foundation.

Ma vediamole in dettaglio.

Aspetti inerenti al Design di un’applicazione.

Import layout Adobe Photoshop ed Adobe Illustrator: attraverso Ex Blend 3 è possibile importare in modalità nativa i layout grafici prodotti attraverso Adobe Photoshop (.psd) ed Adobe Illustrator (.psd), mantenendo invariati i contenuti dei layer, le shape e i testi che costituiscono l’interfaccia grafica.

Effetti grafici: con Blend 3 è possibile gestire in modalità nativa i live effects anche su applicazioni Silverlight, all’interno dell’Asset Lybrary trovate una label “Effect” in cui sono raccolti gli effetti disponibili.
Un semplice “drag&drop” sull’elemento grafico a cui volete applicare l’effetto, sia in grafica vettoriale sia immagine “jpeg/png”.

Gradient Tool: novità anche sugli strumenti offerti per la gestione dei gradienti. Ipotizziamo di voler applicare un gradiente come riempimento “fill” di una primitiva vettoriale, quale ad esempio un semplice rettangolo con i vertici arrotondati. Una volta assegnato il riempimento come gradiente, potrete gestire attraverso lo strumento “gradient tool”, l’inserimento di nuovi colori “pennelli/stop” direttamente a livello grafico facendo la combinazione di tasti “click mouse tasto sx + alt”. Una volta inserito il nuovo stop potete modificare il colore dello “stop” appena inserito facendo semplicemente “doppio click”.
Vi apparirà il classico pannello per la gestione del colore e da li potrete associare e modificare il colore applicato allo “stop”.

Layout & Design Time annotation: notevoli migliorie anche sull’area di lavoro, “layout”. Posizionare e muovere gli oggetti all’interno dell’art board risulterà molto più semplice supportati anche dalle funzionalità di “snapping” e guide sensibili. In design time è inoltre possibile inserire delle annotazioni al layout grafico e ad ogni elemento che costituisce l’interfaccia utente. Le annotazioni saranno visualizzate e contenute all’interno dello XAML e verranno visualizzate solo in fase di progettazione e sviluppo.

Skinning & Control Template
E’ possibile convertire, ogni elemento grafico in un controllo. Semplicemente selezionando l’oggetto all’interno dell’area di lavoro, facendo tasto destro, selezionando il comando “Make into Control” ed il gioco è fatto. Si aprirà un’apposita finestra che vi permetterà di selezionare a quale “controllo” volete convertire la grafica. Una volta definito la tipologia di controllo è possibile poi definire il “control template” all’interno di uno “style” / “resource dictionary” con la stessa modalità che era già supportata in Expression Blend 2. Una volta trasformato in controllo è possibile definire all’interno del “control template” le funzionalità da associare agli elementi grafici in relazione alle funzionalità supportate dal controllo stesso.

Visual State Manager
Anche la gestione all’interno del Visual State Manager è stata ottimizzata, sono state migliorati pannelli per la gestione degli stati. E possibile visualizzare più stati per i controlli.
All’interno dello “storyboard” utilizzato nella definizione di uno “state”, quale ad esempio il classico “MouseOver” di un bottone è possibile inserire direttamente all’interno dello “storyboard” nuovi elementi di layout all’interno dell’oggetto che verranno visualizzati solo all’interno del “Control Template” dell’oggetto selezionato.

Interazione
XAML, C# e Visual Basic Code: Editing
Questa nuova versione supporta anche l’IntelliSense, con completamento della sintassi, sia sul codice XAML in modalità “editing” sia sul codice C# e VB.NET (funzionalità di auto-formatting,).

Fonte dati – utilizzo di “Sample Data”
Expression Blend 3, migliora notevolmente la gestione e il testing delle applicazioni con fonti dati esterne di prova, senza aver accesso a fonte dati reali. Attraverso l’utilizzo del nuovo pannello “Data” è possibile generale localmente fonte dati di “prova” all’interno di Blend ed importare semplici fonti dati da file XML esterni. In runtime sarà quindi possibile “switcchare” dalle fonte dati di prova alla fruizione di dati reali.

Databinding
Con la nuova versione del tool, è possibile anche per progetti Silverlight 3, fare direttamente il “drag&drop” delle fonti dati sui controlli all’interno del layout grafico, associare in data binding le proprietà degli oggetti inseriti all’interno della UI. E’ inoltre supportato il controllo “data grid”, già utilizzabile per lo sviluppo di applicazioni WPF.

Supporto di progetti Silverlight 3
Expression Blend 3, permette di sviluppare progetti Silverlight 3, nell’eventualità che proviate ad aprire un progetto in Silverlight 2, vi verrà richiesto di aggiornare il progetto con la nuova versione del plugin.
In fase di creazione del progetto, Blend 3 supporta anche la definizione di progetti Silverlight 3 con l’opzione di creare anche il sito Web correlato (Silverlight Application + Web Site).
Procedendo in questo modo il tool vi creerà sia l’applicazione Silverlight ed il sito Web associato con le pagine HTML che permetteranno di caricare l’oggetto Silverlight.

Filiera di progetto integrata con Visual Studio Team Foundation Server (TFS).
In merito alla collaborazione con l’area tecnica di sviluppo, Blend 3 risulta perfettamente integrato anche con Visual Studio Team Foundation Server per la gestione del “check in / check out” del progetto nella filiera di produzione dell’applicazione.

Animazione
Ulteriori prioprietà gestibili all’interno di un’animazione, per facilitare la registrazione delle proprietà è stato introdotto un nuovo commando “Record Current Value”, che risulta attivo nel menu di gestione delle proprietà avanzate quando selezionate il “marker” successivo alle proprietà individuali all’interno del pannello proprietà.

Gestione avanzata degli effetti di “easing”
Oltre al classico pannello di gestione di easing, che si attiva all’interno del pannello proprietà quando si seleziona un “keyframe” su uno storybard è disponibile un nuovo pannello “EasingFunction” che contiene una libreria di effetti già pre-confezionati da applicare ai keyframe delle animazioni.

Behaviors
Con Blend 3 sono stati introdotti i “behaviors” come modelli/pattern per gestire l’interazione.
I behaviors, sono alla base dei comportamenti di interazione che potranno essere applicati e riutilizzati all’interno di un’applicazione semplicemente facendo un “drag&drop” del behavior sull’oggetto a cui si vuole applicare l’interazione.
I behaviors possono essere utilizzati per applicare interazioni “semplici”, quail il cambiamento di uno stato di un controllo, visualizzare un “dialog box”, scatenare e lanciare uno storyboard; ma possono anche essere impiegati per dialogare con un “web service” per aggiornare dei dati o validare un immissione di dati su un form.   

Attraverso l’utilizzo dei beahviors il limite sarà solo la vostra creatività.

Expression Blend 3, verrà distribuito con un “set di behaviors” standard (non ho ancora visibilità di quanti e quali saranno disponibili), ma una delle peculiarità principali dei behaviors è l’estendibilità.
Con l’aiuto dei nostri colleghi “sviluppatori”, potremmo creare e personalizzare nuovi “behaviors” – una sorta di vocabolario dell’interazione da poter riutilizzare sulle applicazioni.

I behaviors, sono l’equivalente dei triggers per applicazioni “WPF” e abilitano la gestione dell’interazione delle nostre applicazioni Silverlight all’interno di Expression Blend senza dover scrivere una riga di codice.

SketchFlow & Prototyping
Presentata durante la keynote del primo giorno, lo SketchFlow è uno strumento veloce e flessibile per prototipizzare dinamicamente l’interazione di un’applicazione.
SketchFlow, è parte di Expression Blend è fornisce al tool una serie di potenzialità utili per progettare l’interazione di un’applicazione, un nuovo ruolo di Blend in fase di “pre-produzione” e “design”.


 

Gestione del “testo e font embedding”
Migliorie anche per la gestione dei Font, è possibile “embeddare” e creare subset di font in progetti Silverlight e WPF, il nuovo pannello font manager vi permette di selezionare i font installati sul vostro PC e personalizzare quale subset di font includere nel progetto.

Queste sono solo alcune delle nuove funzionalità disponibili con la nuova versione del tool attualmente in Preview, a tendere ci saranno ulteriori ottimizzazioni e migliorie nella versione finale del prodotto.

Expression Web 3- SuperPreview
interessante novità anche in merito ad Expression Web, è stata introdotta una nuova funzionalità del tool, denominata SuperPreview - un "visual debugging tool" che consente di avere una preview "interattiva" di come verrà visualizzata la pagina su uno specifico browser direttamente nel tool. Attraverso SuperPreview sarà possibile testare la pagina su "n" browser diversi anche non installati localmente sul proprio PC, ma fruibili anche via servizi "on the cloud". Trovate disponibile il download di SuperPreview sul sito ufficiale di prodotto, a questo link. Attualmente è disponibile una versione che supporta il rendering di pagine Web su IE6, IE7 e IE8 a tendere sarà disponibile una prossima versione che supporterà anche Firefox e Safari.

Internet Explorer 8 – New Browser Experience! J
Sempre in termini di prodotto, è stato presentato ieri , durante la keynote del secondo giorno, la nuova versione ufficiale del browser Internet Explorer 8, anche in questi ambiti importanti novità legate alla sicurezza, velocità e nuove funzionalità del browser: Visual Search, Accelerators e Web Slices.
Nell’ottica di migliorare ed incrementare l’esperienza utente nell’interazione sul Web,  ma anche una forte propensione nei confronti degli ultimi standard del mercato CSS 2.1 ed inizio del supporto HTML 5.
Se volete trovare una completa descrizione di tutte le novità funzionali di IE8, vi rimando al sito ufficiale del prodotto.

Vi ricordo inoltre che a breve saranno disponibili al download sul sito ufficiale di MIX'09 i video di tutte le sessioni di MIX'09. 

Stay tuned!