Alessandro Scardova @ UgiDotNet

Convivenza tra Expression Blend 5 Preview e Visual Studio 2010

Alessandro Scardova — Sun, 25 Mar 2012 16:40:53 GMT

Se avete installato Visual Studio 11 in una macchina con Visual Studio 2010 o avete istallato Visual Studio 2010 successivamente se provate a creare un progetto da Blend, vedrete soltanto una soluzione vuota. D’altro canto se provate ad aprire una soluzione Metro creata da Visual Studio 11, potreste ricevere un messaggio di errore sul file "C:\Program Files (x86)\MSBuild\Microsoft\WindowsXaml\v10.0\Microsoft.Windows.UI.Xaml.CSharp.targets" che non viene trovato:

Questo perchè il file in questione è ovviamente nella cartella v11.0!

Blend cerca il file nella cartella v10.0 perchè nel file .csproj è contenuta la riga

<Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" />

In alcune circostanze, tra cui quella in cui ci sia installato Visual Stiudio 2010, Blend 5 preview prende come default per VisualStudioVersion il valore 10.0

Il problema si risolve in pochi secondi (a saperlo) impostando una variabile di ambiente di Windows con il nome VisualStudioVersion e con in valore 11.0.

Fonte: social.msdn.microsoft.com

Metro UX con XAML: creare una GridView custom

Alessandro Scardova — Sun, 25 Mar 2012 15:20:35 GMT

Molti mi hanno chiesto come creare in XAML una griglia con gli elementi che possano spammare su più righe o su più colonne, più o meno come accade con la pagina Start di Windows 8 o come potete vedere in altre applicazioni Metro.

La soluzione è abbstanza semplice: basta ereditare il controllo GridView e fare un override del metodo PrepareContainerForItemOverride avendo cura di inserire nel oggetto bindato all’item (il model se usate MVVM) le proprietà che rappresentano i valori di RowSpan e ColumnSpan dell’oggetto contenitore, nel mio caso un VariableSizedWrapGrid in questo modo:

public class SpannableGridView : GridView
{
    protected override void PrepareContainerForItemOverride(Windows.UI.Xaml.DependencyObject element, object item)
    {
        var dataItem = item as SampleDataItem;

        if (dataItem != null)
        {
            element.SetValue(VariableSizedWrapGrid.ColumnSpanProperty, dataItem.ColumnSpan);
            element.SetValue(VariableSizedWrapGrid.RowSpanProperty, dataItem.RowSpan);
        }

base.PrepareContainerForItemOverride(element, item);
}
}

Da notare che:

il DataTemplate associato all’item non deve essere a dimensione fissa perchè deve adattarsi alle varie dimensioni;
se usate un VariableSizedWrapGrid dovete impostare la dimensione di ItemHeight e ItemWidth alla dimensione che dovrà avere l’item con ColumnSpan e RowSpan impostati a 1.

Detto questo potete scaricarvi l’esempio qua.

Installare il Framework 3.5 su Windows 8 CP

Alessandro Scardova — Sat, 03 Mar 2012 06:05:29 GMT

Se anche a voi quando tentate di installare Il Framework 3.5 vi chiede di scaricare i file da Windows Update e l'operazione fallisce con l'errore 0x800F0906, non rimane che installare direttamente dal DVD di Windows 8 Consumer Preview.

Il commando da eseguire in un prompt dei comandi amministrativo è il seguente, dove g è la lettera del CD con la Iso di windows 8.

dism.exe /online /enable-feature /featurename:NetFX3 /Source:g:\sources\sxs

Da me ha funzionato!

Metro UX con XAML: introduzione al Semantic Zoom - Parte 1: Grouped Zoom

Alessandro Scardova — Thu, 01 Mar 2012 23:43:13 GMT

Il linguaggio di User Experience Metro permette di realizzare interfacce che "escono" dai margini della finestra, consentendo allo sviluppatore di costruire griglie orizzontali molto estese. Per venire incontro all'utente che altrimenti dovrebbe scorrere un interminabile elenco di item, viene introdotto il concetto di Semantic Zoom.

Il semantic zoom permette all'utente di avere una visione "ragguppata" degli item presenti nella griglia, in base ad alcuni elementi semantici, come l'inziale del nome, l'area geografica, l'età o altro che possa caratterizzare un numero limitato di item. Una volta selezionato l'elemento semantico, viene spostato il focus sugli item opportuni.

In XAML sono due gli oggetti che ci vengono in aiuto: il primo è il SemanticZoom che permette di associare due GridView o ListView tra loro definendo sia la ZoomedInView, che è la vista normale, e la ZoomedOutView che è la vista raggruppata. L'altro elemento che ci serve è la CollectionViewSource che permette di realizzare una fonte dati gerarchica definendo gruppi ed elementi per ciascun gruppo.

La ItemSource della ZoomedInView sarà la nostra CollectionViewSource, mentre la ItemSource della ZoomedOutView punterà alla proprietà View.CollectionGroups sempre della CollectionViewSource. In questo modo il controllo si prenderà carico di visualizzare posizionando opportunamente lo scroll della View gli elementi del gruppo.

L'esempio che ho realizzato è basato sul template che viene proposto con Visual Studio 11 beta. Il controllo SemanticZoom ovviamente non funziona se inserito in un ScrollViewer.

Il progetto di esempio può essere scaricato qua:

Metro e l’armonia perfetta

Alessandro Scardova — Sat, 28 Jan 2012 18:21:04 GMT

Metro è un Design Language, (potremmo definirlo anche un “pattern di User Experience”) introdotto da Microsoft, prima con Encarta 95, poi Windows Media Center e Zune (fonte). La sua introduzione è abbastanza datata, ma è da poco più di un anno che con Windows Phone 7 gli sviluppatori e i designer hanno iniziato a lavorarci.

Spesso ridotto alla leggenda che lo vuole “ispirato dalle stazioni delle metropolitane”, in realtà Metro ha una storia molto più interessante.

Metro è basato sui principi stilistici dell’International Typographic Style, sviluppatosi negli anni ‘50 in Svizzera; lo stile è infatti anche chiamato Swiss Style. Lo stile svizzero si basa su tre punti cardinali: chiarezza, leggibilità e obiettività. (Fonte) E’ uno stile freddo, impersonale e per questo poco utilizzato in pubblicità ma che ha trovato largo impego nell’architettura moderna e per la sua leggibilità nei cartelli informativi.

In realtà Metro si ispira più direttamente agli stessi principi a cui si riconosce lo stile svizzero degli anni ‘50, attingendo direttamente alle idee nate nel cosiddetto Movimento Moderno, un movimento multidisciplinare che intorno agli anni venti e trenta del XX secolo ha cercato di migliorare l’architettura, l’urbanistica, la pittura e il design concentrandosi sulla funzionalità e introducendo nuovi concetti estetici.

Al Movimento Moderno, appartiene in particolare una rivista fondata in Olanda nel 1917 chiamata De Stijl. Lo stile.

Il contributo dato alla rivista De Stijl da Theo van Doesburg e Piet Mondrian ha il suo apice con la definzione di un termine che in segna un punto fermo nell’arte astratta: in neo-plasticismo. Il critico d’arte Giulio Carlo Argan, intellettuale e sindaco di Roma, nel 1976 scrive :

“Nella poetica neo-plastica è estetico il puro atto costruttivo: combinare una verticale ed una orizzontale oppure due colori elementari è già costruzione.”

In pratica è una grafica “pura” che combina linee e colori esclusivamente con un obiettivo estetico . Il De Stijl introduce uno stile interdiscipliare che si basa su alcuni principi che ritroviamo in Metro.

Astrazione
Essenzialità
Geometria

Negli elementi che compongono l’interfaccia utente, dobbiamo tenere conto di questi principi; per esempio, se dobbiamo disegnare un pulsante esso dovrà essere un rettangolo oppure un cerchio, non una forma complessa che ricorda un pulsante fisico, come il classico rettangolo con angoli arrotondati che troviamo tra i controlli di Windows. La nostra interfaccia utente dovrà essere essenziale, ma non minimale: dovrà contenere tutto ciò che serve e soltanto ciò che serve, senza però mettere in difficoltà l’utente con elementi troppo piccoli.

Seguendo questi semplici principi e le linee guida ufficiali, riuscirete a realizzare applicazioni funzionali e belle da usare.

Buon Metro!

Una riflessione su Html5 e XAML

Alessandro Scardova — Wed, 30 Nov 2011 12:49:45 GMT

L’occasione è quella dell’uscita della 4 prewiev di Internet Explorer 10 (link) ma è da un po’ che mi chiedo se HTML5 diventerà concretamente una tecnologia per lo sviluppo di applicazioni “client”. Diamo per scontato che HTML5 sarà il futuro del web ma oggi, tolti i grossi ‘player’, vedo ancora tanti, forse troppi, contenuti con tecnologie a plug-in ma soprattutto strumenti di sviluppo ancora allo stato primordiale.

La strada di Html5 verso la conquista del desktop è parallela, non conseguente, a quella del web, con scenari molto differenti.

Oggi sviluppare un’applicazione Metro in Html5 è vincente quando si verificano almeno una di queste condizioni:

l’applicazione condivide parte del front end con un sito web;
il team è fortemente skillato su HTML CSS e JavaScript.

Alcuni potrebbero suggerire una terza opzione se tra i requisiti ci fosse il supporto multipiattaforma, ma che io sappia le funzionalità Html5 per desktop di Apple sono limitate ai widget, senza un accesso diretto alle funzionalità del sistema operativo.

Per contro sviluppare applicazioni Metro in Html5 è perdente quando tra i requisiti ci sono:

supporto a Windows 7 o precedenti;
mancanza di conoscenze specifiche nel team di sviluppo.

Sviluppare in XAML oggi è vincente se il team ha

conoscenze dei linguaggi del Framework .NET: C# o VB.Net;
conoscenza di C++;
esperienza di sviluppo di applicazioni Silverlight, WPF o Windows Phone.

La mancanza del supporto a Windows 7 o precedenti di WinRT ne preclude anche il supporto di applicazioni Metro basate su XAML; probabilmente però sarà più semplice fare il porting verso Silverlight di un’applicazione XAML che non di una scritta con HMTL5, specie se si sono adottati pattern di separazione del presentation layer come il noto MVVM. Tra l’altro possiamo dire che oggi Silverlight rimanga ancora una buona soluzione per sviluppare soluzioni verso Mac OS.

Lo scenario di un unico linguaggio cross-platform per realizzare applicazioni che possano girare ovunque è dunque ancora lontano e penso che Html5 potrà essere una base concreta per svilupparlo. Microsoft in futuro supporterà le tecnologie che verranno più utilizzate, ,ma non penso esisti una roadmap definita in tal senso: troppe sono le incognite, in particolare quelle che dipendono dalla concorrenza.

Per concludere questa breve riflessione, XAML è la tecnologia che ci offre maggiore retro compatibilità e migliori strumenti di sviluppo: Html5 oggi ha ancora troppe incognite per rappresentare una soluzione equivalente.

Prototipizzazione Dinamica di App Windows Phone a WPC 2011

Alessandro Scardova — Wed, 16 Nov 2011 09:41:24 GMT

Come molti sapranno il 22, 23 e 24 novembre al Centro Congressi Milanofiori di Assago si terrà l’annuale appuntamento organizzato da OverNet incentrato sulle tecnologie e prodotti Microsoft: la WPC.

Ho partecipato a diverse edizioni di questo convegno, sin dalla prima edizione 17 anni fa nel 2004, anche come MVP all’Ask The Expert, ma questa - la 18° edizione - mi vedrà per la prima volta sul palco per presentare una mia vecchia conoscenza: SketchFlow, ma questa volta in salsa Windows Phone.

SketchFlow è un fantastico strumento per la realizzazione di prototipi applicativi: l’unico, tra il panorama degli strumenti presenti sul mercato, a consentire la realizzazione di prototipi Dinamici: una vera e propria applicazione Silverlight che consente di giocare interattivamente con il prototipo, permettendo di annotare modifiche e suggerimenti direttamente sul prototipo.

Nella sessione vedremo appunto come poter usare questo strumento per realizzare prototipi di applicazioni Windows Phone, attraverso un template open source.

Di seguito i dettagli della sessione:

[D3003] Windows Phone: Prototipizzazione Dinamica di Applicazioni XAML

Track: Windows Phone
Speaker: Alessandro Scardova
Level: Avanzato
Agenda: 23/11, 09.00 - 10.15
Sala: Rossa

Vi aspetto!

Aprire l’app Mappe nativa di uno smartphone da una pagina HTML

Alessandro Scardova — Wed, 31 Aug 2011 08:22:08 GMT

Da quando ho la beta di Mango, navigare da Windows Phone con un browser HTML5 è uno spettacolo, però quest’estate navigando sui siti dei ristoranti spesso mi sono trovato in difficoltà nel consultare le mappe interne al sito. Da utente mi sono chiesto: ho un’app Mappe fantastica, che mi permette di ottenere le indicazioni, impostare i percorsi perché i siti non mi permettono con un semplice click di accedere alla mappa?.

Ieri ho dedicato un po’ di tempo libero a questa problematica e ho dedotto che ogni OS mobile affronta la questione in modo diverso: vediamo come.

iPhone.

Apple taglia la testa al toro, facendo un regalone alla rivale Google. In pratica non occorrono particolare doti, basta fare un link a maps.google.com o ditu.google.com (Asia) e Safari aprirà il collegamento direttamente in Map. La documentazione è chiara: “The domain must be google.com and the subdomain must be maps or ditu.”

Android.

Google merita un plauso: è la sola, nella mia indagine, che considera l’unica RFC relativa a questa problematica, la RFC 5870 , implementando lo schema URI geo:. Nella lista di intenti vengono indicate le varie modalità di costruzione dell’URI.

Windows Phone 7

Per quanto riguarda Microsoft non ho ancora trovato una documentazione ufficiale (non è facile cercare su internet la keyword Map) ma studiando l’applicazione Facebook per Windows Phone 7 ho notato che viene utilizzato lo schema URI maps:. Questo schema probabilmente deriva da una vecchia implementazione Apple, mai documentata, soppiantata con l’avvento di iOS.

In attesa di trovare una documentazione, posso dirvi che ho sperimentato con successo l’uso di maps: nella ricerca indirizzo con questa sintassi:

<a href=”maps:my+address+city”>Map</a>

Conclusioni

L’idea non è quella di sostituire la mappa sul sito, ma di offrire all’utente anche la possibilità di sfruttare le potenzialità del proprio terminale, consentendogli di passare dal sito all’applicazione nativa.

Se volete un esempio ho sviluppato un piccola pagina di test che attraverso uno script basato sull’user-agent, imposta dinamicamente il link “Open Map” per i sistemi iPhone/iPad, Android e Windows Phone 7. Non sono un esperto di javascript: se avete suggerimenti sono bene accetti.

Il prodotto a marchio

Alessandro Scardova — Fri, 19 Aug 2011 01:01:09 GMT

Avete presente le catene dei supermercati? Quasi tutte offrono prodotti con il “brand” del supermercato stesso. Questo tipo di vendita di fatto non comporta che il supermercato diventi “produttore” ma semplicemente commissiona l’opera ad un produttore terzo, solitamente individuabile in piccolo sull’etichetta che confeziona il prodotto con le specifiche imposte dalla catena.

I vantaggi sono un po’ per tutti.

Il produttore si concentra sul suo lavoro, non deve occuparsi di marketing, distribuzione, customer-care e robe simili.

Il consumatore se ha una buona percezione del brand del supermercato rifletterà la sua percezione sul prodotto, convincendosi (come è nella maggior parte dei casi) di portare a casa un ottimo rapporto qualità prezzo.

Il supermercato ottiene il famigerato lock-in. “Se ti piace il mio prodotto a marchio devi venire nel mio punto vendita anche per il resto della spesa”.

A volte la qualità non è sufficiente per essere associata al brand principale, quindi il prodotto viene offerto con un brand secondario, che ne evidenzia l’economicità.

Nel mondo IT, Apple è il classico esempio del prodotto a marchio. Sappiamo benissimo che i PC, gli smartphone e i tablet vengono prodotti in Cina (è pure scritto) ma abbiamo una fiducia nel Brand tale che siamo convinti che il prodotto debba superare diversi test per essere “approvato”.

E’ una tecnica da GDO. E così è anche Apple, con i suoi punti vendita, la vendita diretta e sostanzialmente fuori dal “vecchio” canale fatto di produttore, importatore, distributore e dettagliante che probabilmente ha fatto il suo tempo. Una tecnica che per Apple è più importante dei prodotti stessi: la linea server “enterprise” ha infatti lasciato il passo a mini-server per lo small office.

Così deve pensarla anche HP che oggi ha deciso di creare una spin-off dei prodotti destinati al pubblico consumer. Una spin-off che gli permetta di abbandonare il canale di vendita dei server e delle stampanti e di approcciarsi a modalità diverse.

E’ la stessa cosa che ha pensato anche Google quando ha deciso di comprare Motorola? Personalmente non credo ma molti analisti sostengono il contrario.

Una rete di vendita diretta non si inventa dall’oggi al domani, ma oggi il canale consumer è il nuovo eldorado dell’IT. Ormai le aziende hanno già un PC per ogni dipendente e a parte il naturale ricambio non possiamo parlare di un mercato in espansione, specie in un periodo in cui la crisi globale sta riducendo i posti di lavoro, inoltre il cloud ridurrà sempre più l’esigenza di risorse IT locali.

E’ quindi sul consumatore casalingo che produttori Hardware e Software stanno ponendo la concentrazione. Ma il consumatore vuole il prodotto a marchio: è quello sul quale viene percepito il migliore rapporto qualità / prezzo.

Chi ad oggi ha saputo valorizzare il proprio brand potrà spenderlo; chi ha commesso in passato passi falsi dovrà forse inventarsi un nuovo brand o tentare la fortuna, con la consapevolezza che un ulteriore errore potrebbe essere fatale.

Sono convinto che i prossimi 12-18 mesi ci riserveranno novità importanti, novità che probabilmente ci porteranno ad approcciarci all’IT in modo completamente diverso rispetto ad ora.

Google e la sindrome da Impero Romano.

Alessandro Scardova — Mon, 08 Aug 2011 13:19:57 GMT

Uno dei motivi che hanno portato ai crollo dell’Impero Romano è che i costi necessari per mantenere l’apparato militare man mano che l’Impero allargava i propri confini erano superiori alle maggiori entrate dovute alle nuove conquiste. (fonte Wikipedia)

Secondo Trefis il pacchetto azionario di Google è legato per oltre 75% ai ricavi degli annunci pubblicitari (inclusi quelli su YouTube), mentre altri settori, a noi sviluppatori tanto cari, non rappresentato che le briciole.

E’ chiaro, che anche se non hanno un peso nel pacchetto azionario, servizi come Gmail, Google Plus o prodotti come Android, sono strategici da un lato per raccogliere informazioni sull’utente per posizionare meglio gli annunci pubblicitari, dall’altro per mantenere gli utenti legati sempre di più al proprio Brand.

Per fare un esempio, mentre per Apple iPhone è un business “diretto”, per Google Android è un business “indiretto”.

Il meccanismo messo in piedi da Google funziona finché i costi recatavi alle aree di intervento “indiretti” vengono coperti dai ricavi provenienti dal core business dell’azienda. Gli investimenti di oggi di Google in questa direzione sono massici: anche con la chiusura di Labs (fonte: googleblog) le attività volte a rosicchiare terreno dalla concorrenza sono sempre più onerose e numerose.

Riuscirà Google a mantenere vivo il proprio Impero nonostante i numerosi teatri di scontro in cui è impegnata? Vedremo.