Alessandro Scardova @ UgiDotNet http://blogs.ugidotnet.org/allePalle_blog/Default.aspx I contenuti di questo blog sono destinati alla sola informazione aziendale. it-IT Alessandro Scardova Subtext Version 2.6.0.0 Alessandro Scardova @ UgiDotNet http://blogs.ugidotnet.org/images/RSS2Image.gif http://blogs.ugidotnet.org/allePalle_blog/Default.aspx 77 60 La notifica degli errori UX http://blogs.ugidotnet.org/allePalle_blog/archive/2013/02/02/la-notifica-degli-errori.aspx <p>È un po’ che ho in mente di scrivere questo post: quante volte malediciamo i nostri utenti perché quando qualcosa va storto ti dicono: “non funziona” e quanto chiedi educatamente se si ricordano il messaggio di errore la risposta è quasi sempre negativa.</p> <p>Ma è sempre colpa loro? Io credo che molte volte si trascuri l’aspetto di user experience nella gestione degli errori, si fa presto a scrivere un:</p> <blockquote> <p>catch (Exception ex) <br />{ <br />    var md = new MessageDialog(ex.Message); <br />    var result = md.ShowAsync(); <br />}</p> </blockquote> <p>Ma il risultato non è sempre alla portata di tutti: <br /></p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/e8caa3a21540_F3D6/image_4.png"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/e8caa3a21540_F3D6/image_thumb_1.png" width="244" height="139" /></a></p> <p> </p> <p>Brutta bestia il MessageDialog o MessageBox usato in una catch, ma è quello si usa molto spesso: che fare quindi?  Prima di tutto è bene sostituire i messaggi di sistema, che sono pensati per fornire informazioni di debug allo sviluppatore ma non per essere visualizzati all’utente. Gli errori devono essere semplici, di facile comprensione e memorizzazione, per esempio:</p> <ul> <li>Errore di rete; </li> <li>Accesso negato; </li> <li>Manca la carta nella stampante; </li> <li>Non riesco a salvare; </li> </ul> <p>Evitare di usare parole come <strong>memoria</strong> (gli utenti non sanno mai se si tratta di RAM o di storage), <strong>database</strong> (questo misterioso) o altri tecnicismi che potrebbero confondere l’utente.</p> <p>Salvare gli errori di sistema in un log al quale l’utente potrà accedere su richiesta del tecnico di help desk, con un comando apposito.</p> <p>Evitare le dialog: è incredibile come le dialog vengano sistematicamente ignorate dagli utenti. In caso di errore visualizzare l’informazione in modo evidente nell’interfaccia utente e se necessario disabilitare comandi che potrebbero generare altri errori. </p> <p>Questo è un esempio di come ho implementato la gestione degli errori:</p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/e8caa3a21540_F3D6/image_6.png"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/e8caa3a21540_F3D6/image_thumb_2.png" width="244" height="76" /></a></p> <p> </p> <p>Debbo dire che l’esperienza ha dimostrato che anche in caso di problemi l’utente è sempre in grado di comunicare correttamente l’errore riportato.</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/101429.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2013/02/02/la-notifica-degli-errori.aspx Sat, 02 Feb 2013 19:50:12 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2013/02/02/la-notifica-degli-errori.aspx#feedback 2 http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/101429.aspx The Microsoft design language Community UX http://blogs.ugidotnet.org/allePalle_blog/archive/2012/11/03/the-microsoft-design-language.aspx <p>Ci siamo, finalmente la nuova famiglia dei sistemi operativi Microsoft è disponibile: Windows 8, Windows RT e Windows Phone 8 sono realtà. Tre OS differenti pensati per dispositivi diversi: Personal computer e tablet basati su processori classici, pc e tablet basati su processori ARM e, ovviamente, smartphone.  </p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/872e93e2de4c_F169/image_6.png"><img width="442" height="246" title="image" style="padding-top: 0px; padding-right: 0px; padding-left: 0px; display: inline; background-image: none;" alt="image" border="0" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/872e93e2de4c_F169/image_thumb_1.png" /></a></p> <p>L’idea è che tutti questi oggetti, indipendentemente dalla forma e dalla tecnologia interna, abbiano in comune <strong>la stessa esperienza utente:</strong> personal Computer, notebook, tablet, cellulari e console per videogame possono essere utilizzati nello stesso modo, con estrema facilità per l’utente. </p> <p><strong>Un processo che matura nel tempo <br /> </strong>Nel 2007 Microsoft mette insieme un gruppo, la divisione <em>Microsoft's Entertainment &amp; Devices</em>, guidato da Robbie Bach; gruppo che <a target="_blank" href="http://en.wikipedia.org/wiki/Walter_Mossberg">Walt Mossberg</a> definisce “una piccola Apple”. Fin troppo: il gruppo a mio parere segue una strada già percorsa da Apple che vede una separazione, nell’esperienza utente, del mondo PC dal mondo consumer. Il gruppo si inventa il famoso <em>courier</em>, un device innovativo ma con un’esperienza utente completamente diversa da Windows. Nel 2010 Ballmer capisce che non può esserci una divisione così isolata dal resto della società e <a target="_blank" href="http://www.microsoft.com/en-us/news/press/2010/may10/05-25transition.aspx">manda in pensione Bach</a>, assumendo direttamente il controllo della divisione. La decisone è chiara: Microsoft deve reinventarsi Windows e Office per offrire agli utenti un’unica esperienza utente, dall’intrattenimento alle attività professionali, dai cellulari ai Personal Computer negli uffici.</p> <p><strong>Una <em>vision</em> ambiziosa</strong> <br /> Come è possibile dare la stessa esperienza utente a oggetti che devono essere comandati con le dita ad altri che hanno tastiera e mouse? Semplice, la stessa che ci consente di comunicare con la voce e con il testo scritto: <strong>il linguaggio</strong>. Se altre aziende hanno un design language, esso viene limitato all’hardware: dalle linee sinuose dei prodotti Apple alle auto della Mercedes questi prodotti ci parlano di come sono stati prodotti, progettati e assemblati. Microsoft è la prima società che introduce “<em>un unico e consistente design language per ogni schermo</em>”, questo linguaggio che alcuni conoscono come “Metro”, oggi si chiama <strong>Microsoft design,</strong> proprio per rafforzare il concetto che non si tratta di un modo di concepire una particolare linea di prodotti, ma che diventa il linguaggio di design di <strong>tutti</strong> i prodotti della società.</p> <p><strong>C’era bisogno di tutto ciò?</strong> <br /> Pensiamo alla user experience delle applicazioni Windows che usiamo tutti i giorni, sebbene ci sia un <a target="_blank" href="http://msdn.microsoft.com/en-us/library/windows/desktop/aa511258.aspx">corposo documento</a> che indica come devono essere fatte le applicazioni, questo documento viene regolarmente disatteso (sono semplici linee guida) e spesso le applicazioni non hanno coerenza tra loro. Pensiamo alla interazione tra le diverse applicazioni: se oggi dobbiamo trasferire dati da un’applicazione all’altra non ci rimane che il copia / incolla o affidarci ai filtri di importazione. Pensiamo all’installazione: se oggi abbiamo bisogno di una funzionalità dobbiamo fidarci del nostro motore di ricerca o di portali specifici, ma non abbiamo l’esperienza di uno Store dove le applicazioni vengono certificate e approvate per noi. Se pensiamo a tutto questo probabilmente converremo con Microsoft che c’è bisogno di qualcosa di nuovo e <em>reimmaginato</em> che possa girare sui nostri dispositivi per i prossimi anni.</p> <p><strong><img width="219" height="240" style="display: inline;" alt="" src="http://fc05.deviantart.net/fs70/i/2012/048/7/6/the_new_windows_logo__original_and_colored__by_dakirby309-d4q2ybv.png" /></strong></p> <p><strong>Un cambio di prospettiva <br /> </strong>”Sono salito sulla cattedra per ricordare a me stesso che dobbiamo sempre guardare le cose da angolazioni diverse. E il mondo appare diverso da quassù. Non vi ho convinti? Venite a vedere voi stessi. Coraggio! È proprio quando credete di sapere qualcosa che dovete guardarla da un'altra prospettiva”. [Prof. Keating, L’attimo Fuggente]</p> <p>Solo Windows 8 permette alle vecchie applicazioni di girare nella modalità desktop, Windows Phone 8 consente di utilizzare le applicazioni scritte per Windows Phone 7.5 (ma non quelle per Windows Mobile) mentre Windows RT consente di installare solo le nuove app Windows Store, applicazioni che vengono verificate e certificate da Microsoft. Non siamo obbligati ad abbracciare la nuova modalità: possiamo continuare a sviluppare le applicazioni come abbiamo sempre fatto. Ma se vogliamo dare ai nostri clienti un’esperienza unica, in modo che la nostra applicazione faccia parte della loro vita digitale dobbiamo cominciare a sviluppare in modo nuovo. </p> <p>Insomma, abbiamo un sacco di motivi per divertirci nei prossimi mesi :)</p> <p>A proposito, via aspetto <a target="_blank" href="http://dotdotnet.org/content/2012-DevCamp-Bologna.aspx">giovedì 8 novembre al Dev Camp a Bologna</a>!</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/101302.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/11/03/the-microsoft-design-language.aspx Sat, 03 Nov 2012 11:10:56 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/11/03/the-microsoft-design-language.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/101302.aspx Addio Metro: &egrave; stato bello. XAML Expression Blend WPF Visual Studio Windows Phone 7 Expression Web HTML5 Silverlight UX http://blogs.ugidotnet.org/allePalle_blog/archive/2012/10/03/addio-metro-egrave-stato-bello.aspx <p><img width="444" height="294" title="image" style="border-width: 0px; padding-top: 0px; padding-right: 0px; padding-left: 0px; display: inline; background-image: none;" alt="image" border="0" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/Addio-Metro--stato-bello_A731/image_3.png" /></p> <p>Mancano pochi giorni al lancio ufficiale di Windows 8 e finalmente sembra che si sia chiarita la vicenda intorno al codename “Metro”,  che nella fase Beta indicava sia un’applicazione per Windows 8 e Windows RT che il particolare design che le caratterizza, arrivando fino a definire la nuova pagina Start di Windows 8.</p> <p>Tralascerò i motivi per cui Microsoft ha dovuto abbandonare il codename  e la incredibile vicenda legata ad una nota catena di Cash &amp; Carry tedesca per concentrami sul concetto di Design Language.</p> <p><img width="444" height="272" title="image" style="border-width: 0px; padding-top: 0px; padding-right: 0px; padding-left: 0px; display: inline; background-image: none;" alt="image" border="0" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/Addio-Metro--stato-bello_A731/image12.png" /></p> <p>La versione RTM di Visual Studio chiama correttamente i template per sviluppare applicazioni per Windows 8 e Windows RT “<strong>Windows Store</strong>” e da un <a target="_blank" href="http://www.zdnet.com/microsoft-finally-comes-cleaner-on-post-metro-naming-plans-7000004151/">post di Mary Jo Foley</a> di qualche giorno fa si fa chiarezza (o quasi) sul punto: </p> <p><strong>Windows Store apps <br /> </strong>(per i fanatici del branding la parola <em>apps</em> è in minuscolo) <br /> Sono le app realizzate per Windows 8 e Windows RT che verranno distribuite attraverso il Windows Store, che non necessariamente devono avere un particolare design style, fermo restando il rispetto dei <a target="_blank" href="http://msdn.microsoft.com/en-us/library/windows/apps/hh694083.aspx">requisiti per la certificazione</a>, attualmente alla versione 3.0. </p> <p><strong>Modern apps <br /> </strong>In un primo tempo pensavo che <em>Modern</em> identificasse il nuovo nome del design language, anche perché i concetti base sono simili a quello che viene definito <strong><a target="_blank" href="http://it.wikipedia.org/wiki/Movimento_Moderno">Movimento Moderno</a></strong>, ma mi sono presto dovuto ricredere: Somasegar in una intervista telefonica, definisce <em>"Modern apps" is a sweeping term that mean apps that work on connected devices and make use of continuous services,". </em>Non ci troviamo quindi di fronte ad una definizione di un design ma piuttosto ad una architettura specifica per applicazioni mobili e non solo, in grado di consumare servizi remoti. </p> <p><strong>Microsoft design style</strong> <br /> a quanto pare Microsoft ha messo il cappello al design language: quello che fino ad oggi abbiamo chiamato Metro style è diventato <strong>il design language di Microsoft</strong>, nato e pensato per le <em>Windows Store apps</em> <a target="_blank" href="http://msdn.microsoft.com/en-us/library/windows/apps/hh464920.aspx#traits_8_embrace_metro">i cui principi</a> possono essere estesi ad altri tipi di applicazioni, sia desktop che web, a documenti e presentazioni.</p> <p>La documentazione è ancora in aggiornamento con la nuova nomenclatura, le stesso <a target="_blank" href="http://go.microsoft.com/fwlink/?LinkId=258743">PDF che riassume UX Guildelines</a> in versione RTM citano ancora Metro styles app, in generale però quando si parla di design delle Windows Store apps si fa riferimento al Microsoft design style. </p> <p>Salvo valide motivazioni, ad esempio legate ad un particolare brand dell’app, se volete sviluppare app Windows Store di successo è bene seguire i principi del Microsoft design stile definiti in <a target="_blank" href="http://msdn.microsoft.com/en-us/library/windows/apps/hh464920.aspx">questa pagina</a>.</p> <p>Addio Metro, è stato divertente giocare col quel nome, ma oggi diamo un caloroso benvenuto al <strong>Microsoft design style!</strong></p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/101253.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/10/03/addio-metro-egrave-stato-bello.aspx Wed, 03 Oct 2012 14:39:53 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/10/03/addio-metro-egrave-stato-bello.aspx#feedback 1 http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/101253.aspx Anatomia di un'App: Case Study Expression Blend http://blogs.ugidotnet.org/allePalle_blog/archive/2012/07/12/anatomia-di-unapp-case-study.aspx <p>MSDN Italia ha già  pubblicato (Grandissima Francesca!) su Channel 9 il mio intervento di ieri pomeriggio al <strong>Windows 8 Designer Event</strong>. Il tema è come convertire dal punto di vista della UX un sito web in una corrispondente applicazione Metro Style.  L’applicazione serve per monitorare la posizione delle diverse rosticcerie ambulanti di una ipotetica <strong>Contoso Food Trucks</strong>.</p> <p>Che dire! Un modo come un altro per entrare nei panni del cliente! <img style="border-bottom-style: none; border-left-style: none; border-top-style: none; border-right-style: none" class="wlEmoticon wlEmoticon-smile" alt="Smile" src="http://blogs.scardova.it/alle/img/8738901a6fbc_B160/wlEmoticon-smile.png" /></p> <p><a href="http://channel9.msdn.com/Events/Windows-Camp/Italy-Windows-8-Designer-Event/Anatomia-di-un-App-Case-Study"><img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px" title="image" border="0" alt="image" src="http://blogs.scardova.it/alle/img/8738901a6fbc_B160/image.png" width="244" height="137" /></a></p> <p>I materiali della discussione possono essere scaricati <a href="http://msdn.microsoft.com/en-us/library/windows/apps/hh868264.aspx" target="_blank">qua</a>.</p> <p>Buona visione!</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/101105.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/07/12/anatomia-di-unapp-case-study.aspx Thu, 12 Jul 2012 13:47:21 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/07/12/anatomia-di-unapp-case-study.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/101105.aspx Convivenza tra Expression Blend 5 Preview e Visual Studio 2010 Expression Blend Visual Studio http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/convivenza-tra-expression-blend-5-preview-e-visual-studio-2010.aspx <p>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:</p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/b4fedf883bdb_101F4/image_2.png"><img title="image" style="border-top: 0px; border-right: 0px; background-image: none; border-bottom: 0px; padding-top: 0px; padding-left: 0px; border-left: 0px; display: inline; padding-right: 0px" border="0" alt="image" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/b4fedf883bdb_101F4/image_thumb.png" width="413" height="108" /></a></p> <p>Questo perchè il file in questione è ovviamente nella cartella v11.0!</p> <p>Blend cerca il file nella cartella v10.0 perchè nel file .csproj è contenuta la riga</p> <blockquote> <p>&lt;Import Project="$(MSBuildExtensionsPath)\Microsoft\WindowsXaml\v$(VisualStudioVersion)\Microsoft.Windows.UI.Xaml.CSharp.targets" /&gt;</p> </blockquote> <p>In alcune circostanze, tra cui quella in cui ci sia installato Visual  Stiudio 2010, Blend 5 preview prende come default per <em>VisualStudioVersion</em> il valore 10.0</p> <p>Il problema si risolve in pochi secondi (a saperlo) impostando una variabile di ambiente di Windows con il nome <strong>VisualStudioVersion</strong> e con in valore <strong>11.0</strong>.</p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/b4fedf883bdb_101F4/image_4.png"><img title="image" style="border-top: 0px; border-right: 0px; background-image: none; border-bottom: 0px; padding-top: 0px; padding-left: 0px; border-left: 0px; display: inline; padding-right: 0px" border="0" alt="image" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/b4fedf883bdb_101F4/image_thumb_1.png" width="244" height="108" /></a></p> <p>Fonte: <a href="http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/148f4098-1159-4b22-8d93-a6a2f90c7238" target="_blank">social.msdn.microsoft.com</a></p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100892.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/convivenza-tra-expression-blend-5-preview-e-visual-studio-2010.aspx Sun, 25 Mar 2012 19:40:53 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/convivenza-tra-expression-blend-5-preview-e-visual-studio-2010.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100892.aspx Metro UX con XAML: creare una GridView custom XAML Expression Blend Visual Studio http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/metro-ux-con-xaml-creare-una-gridview-custom.aspx <p>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.</p> <p><a href="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/Creare-una-Grid-Custom-con_E8C8/screenshot1_2.png"><img title="screenshot1" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="screenshot1" src="http://blogs.ugidotnet.org/images/blogs_ugidotnet_org/allePalle_blog/Windows-Live-Writer/Creare-una-Grid-Custom-con_E8C8/screenshot1_thumb.png" width="289" height="149" /></a></p> <p>La soluzione è abbstanza semplice: basta ereditare il controllo GridView e fare un override del metodo <strong>PrepareContainerForItemOverride</strong> 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 <em>VariableSizedWrapGrid</em> in questo modo<em>:</em></p> <p>public class SpannableGridView : GridView <br />{ <br />    protected override void PrepareContainerForItemOverride(Windows.UI.Xaml.DependencyObject element, object item) <br />    { <br />        var dataItem = item as SampleDataItem;</p> <p>        if (dataItem != null) <br />        { <br />            element.SetValue(VariableSizedWrapGrid.ColumnSpanProperty, dataItem.ColumnSpan); <br />            element.SetValue(VariableSizedWrapGrid.RowSpanProperty, dataItem.RowSpan); <br />        }</p> <p>        base.PrepareContainerForItemOverride(element, item); <br />    } <br />} <br /></p> <p>Da notare che:</p> <ul> <li>il <strong>DataTemplate</strong> associato all’item non deve essere a dimensione fissa perchè deve adattarsi alle varie dimensioni; </li> <li>se usate un <em>VariableSizedWrapGrid</em> dovete impostare la dimensione di ItemHeight e ItemWidth alla dimensione che dovrà avere l’item con ColumnSpan  e RowSpan impostati a 1. </li> </ul> <p>Detto questo potete scaricarvi l’esempio <a href="https://skydrive.live.com/redir.aspx?cid=341fc16cf215d488&amp;resid=341FC16CF215D488!494&amp;parid=341FC16CF215D488!169" target="_blank">qua</a>.</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100891.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/metro-ux-con-xaml-creare-una-gridview-custom.aspx Sun, 25 Mar 2012 18:20:35 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/25/metro-ux-con-xaml-creare-una-gridview-custom.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100891.aspx Installare il Framework 3.5 su Windows 8 CP Visual Studio http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/03/installare-il-framework-3.5-su-windows-8-cp.aspx <p>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<font face="Arial"> 0x800F0906, non rimane che installare direttamente dal DVD di Windows 8 Consumer Preview.</font></p> <p>Il commando da eseguire in un <strong>prompt dei comandi amministrativo</strong> è il seguente, dove g è la lettera del CD con la Iso di windows 8.</p> <p><strong>dism.exe /online /enable-feature /featurename:NetFX3 /Source:g:\sources\sxs</strong></p> <p>Da me ha funzionato! <img alt="" src="/Providers/BlogEntryEditor/FCKeditor/editor/images/smiley/msn/regular_smile.gif" /></p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100827.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/03/installare-il-framework-3.5-su-windows-8-cp.aspx Sat, 03 Mar 2012 08:05:29 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/03/installare-il-framework-3.5-su-windows-8-cp.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100827.aspx Metro UX con XAML: introduzione al Semantic Zoom - Parte 1: Grouped Zoom Expression Blend Visual Studio http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/02/metro-ux-con-xaml-introduzione-al-semantic-zoom-parte.aspx <p>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 <a href="http://msdn.microsoft.com/en-us/library/windows/apps/hh465319.aspx">Semantic Zoom.</a></p> <p>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.</p> <p>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.</p> <p>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.</p> <p>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.</p> <p>Il progetto di esempio può essere scaricato <a target="_blank" href="https://skydrive.live.com/redir.aspx?cid=341fc16cf215d488&amp;resid=341FC16CF215D488!455&amp;parid=341FC16CF215D488!169&amp;authkey=!AJPp7990UNABdhI">qua</a>:</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100822.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/02/metro-ux-con-xaml-introduzione-al-semantic-zoom-parte.aspx Fri, 02 Mar 2012 01:43:13 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/03/02/metro-ux-con-xaml-introduzione-al-semantic-zoom-parte.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100822.aspx Metro e l&rsquo;armonia perfetta Expression Blend http://blogs.ugidotnet.org/allePalle_blog/archive/2012/01/28/metro-e-lrsquoarmonia-perfetta.aspx <p><img style="margin: 0px 6px 0px 0px; display: inline; float: left" alt="File:Theo van Doesburg Composition VII (the three graces).jpg" align="left" src="http://upload.wikimedia.org/wikipedia/commons/4/4f/Theo_van_Doesburg_Composition_VII_%28the_three_graces%29.jpg" width="192" height="192" /></p> <p>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 (<a href="http://en.wikipedia.org/wiki/Metro_(design_language)" target="_blank">fonte</a>). 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.</p> <p>Spesso ridotto alla leggenda che lo vuole “ispirato dalle stazioni delle metropolitane”, in realtà Metro ha una storia molto più interessante.</p> <p>Metro è basato sui principi stilistici dell’<em>International Typographic Style,</em> 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à. (<a href="http://it.wikipedia.org/wiki/Stile_tipografico_internazionale" target="_blank">Fonte</a>) 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.</p> <p>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.</p> <p> </p> <p>Al Movimento Moderno, appartiene in particolare una rivista fondata in Olanda nel 1917 chiamata De Stijl. Lo stile.</p> <p><img alt="" src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Destijl_anthologiebonset.jpg/300px-Destijl_anthologiebonset.jpg" width="175" height="137" /></p> <p>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 :</p> <blockquote> <p><em>“Nella poetica neo-plastica è estetico il puro atto costruttivo: combinare una verticale ed una orizzontale oppure due colori elementari è già costruzione.” </em></p> </blockquote> <p>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.</p> <ul> <li>Astrazione </li> <li>Essenzialità </li> <li>Geometria </li> </ul> <p>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.</p> <p>Seguendo questi semplici principi e <a href="http://msdn.microsoft.com/en-us/library/windows/apps/" target="_blank">le linee guida</a> ufficiali, riuscirete a realizzare applicazioni funzionali e belle da usare.</p> <p>Buon Metro!</p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100736.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2012/01/28/metro-e-lrsquoarmonia-perfetta.aspx Sat, 28 Jan 2012 20:21:04 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2012/01/28/metro-e-lrsquoarmonia-perfetta.aspx#feedback http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100736.aspx Una riflessione su Html5 e XAML Silverlight Expression Blend http://blogs.ugidotnet.org/allePalle_blog/archive/2011/11/30/una-riflessione-su-html5-e-xaml.aspx <p><img style="background-image: none; border-bottom: 0px; border-left: 0px; margin: 0px 5px 0px 0px; padding-left: 0px; padding-right: 0px; display: inline; float: left; border-top: 0px; border-right: 0px; padding-top: 0px" title="mondrian" border="0" alt="mondrian" align="left" src="http://blogs.scardova.it/alle/img/30d3ca464d9f_BFF1/mondrian.png" width="206" height="244" />L’occasione è quella dell’uscita della 4 prewiev di Internet Explorer 10 (<a href="http://blogs.msdn.com/b/ie/archive/2011/11/29/html5-for-applications-the-fourth-ie10-platform-preview.aspx" target="_blank">link</a>) 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.</p> <p>La strada di Html5 verso la conquista del desktop è parallela, non conseguente, a quella del web, con scenari molto differenti.</p> <p>Oggi sviluppare un’applicazione Metro in Html5 è vincente quando si verificano almeno una di queste condizioni:</p> <ul> <li>l’applicazione condivide parte del front end con un sito web;</li> <li>il team è fortemente skillato su HTML CSS e JavaScript.</li> </ul> <p>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. </p> <p>Per contro sviluppare applicazioni Metro in Html5 è perdente quando tra i requisiti ci sono:</p> <ul> <li>supporto a Windows 7 o precedenti;</li> <li>mancanza di conoscenze specifiche nel team di sviluppo.</li> </ul> <p>Sviluppare in XAML oggi è vincente se il team ha </p> <ul> <li>conoscenze dei linguaggi del Framework .NET: C# o VB.Net;</li> <li>conoscenza di C++;</li> <li>esperienza di sviluppo di applicazioni Silverlight, WPF o Windows Phone.</li> </ul> <p>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.</p> <p>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.</p> <p>Per concludere questa breve riflessione, XAML è la tecnologia che ci offre maggiore retro compatibilità e migliori strumenti di sviluppo: Html5 <em><strong>oggi</strong></em> ha ancora troppe incognite per rappresentare una soluzione equivalente. </p><img src="http://blogs.ugidotnet.org/allePalle_blog/aggbug/100583.aspx" width="1" height="1" /> Alessandro Scardova http://blogs.ugidotnet.org/allePalle_blog/archive/2011/11/30/una-riflessione-su-html5-e-xaml.aspx Wed, 30 Nov 2011 14:49:45 GMT http://blogs.ugidotnet.org/allePalle_blog/archive/2011/11/30/una-riflessione-su-html5-e-xaml.aspx#feedback 6 http://blogs.ugidotnet.org/allePalle_blog/comments/commentRss/100583.aspx