Qu’est-ce que Metro ?

J’avais parlé des raisons qui me poussent à écrire sur Windows Phone 7. Metro, l’expérience utilisateur novatrice de Windows Phone 7 en fait partie intégrante. Avant de se pencher sur ce qu’est Metro, regardons tout de suite ce que n’est pas Metro. Metro n’est pas :

1. Une technologie / une application.
2. Un composant de Windows Phone 7.
3. Un Framework.

Qu’est-ce que Metro ?

Dans ce cas qu’est-ce que Metro ? C’est un ensemble de principes sur lesquels sont basée des technologies et des applications. Windows Phone n’est pas le premier système à l’intégrer, étant donné que Metro a été pensé à l’origine pour Windows Media Center. Avant de rentrer dans les détails, prenons quelques exemples d’interfaces construites sur ce modèle.

Comme je l’ai dit, Metro a été pensé pour Windows Media Center. De cet exemple on voit apparaître quelque similitude avec l’interface de Windows Phone 7, en particulier la typographie (la police de caractère Segoe faisant partie intégrante de l’interface Metro). On voit également que le contenu de l’utilisateur (en l’occurrence la vidéo en train d’être visionnée) sert de graphisme pour l’application tout comme les photos sur Windows Phone 7 servent de fond pour le hub photo.

La nouvelle version du Dashboard de la Xbox360 qui arrivera à l’automne avec Microsoft Kinect est un autre exemple d’interface purement Metro, claire avec sa disposition organisée et sa typographie caractéristique. Tout comme les « carreaux » de l’écran d’accueil de Windows Phone 7, on retrouve du contenu à l’intérieur de rectangles.

Le Zune HD a posé les bases du concept d’un certain nombre de composants de Windows Phone 7. En particulier le Pivot, ce composant central de l’interface utilisateur de Windows Phone 7 est apparu sur Zune HD. En outre les règles de typographie, les couleurs et l’iconographie de Windows Phone 7 sont eux aussi issu du baladeur de Microsoft.

Quels sont les principes de Metro ?

Microsoft défini Metro comme un langage de conception, et comme tous langage il répond donc à un certain nombre de règles. Voyons à présent quelles sont ces règles.

Clair, fluide, rapide

L’application doit être claire et intuitive. L’interface utilise les marges pour combler l’espace sans être surchargée. Chaque écran se concentre sur sa tâche principale, évitez donc au maximum les écrans fourre-tout. Le but est de faire beaucoup de chose à partir de très peu d’éléments et de garder toujours ce côté organisé.

L’utilisateur ne doit pas avoir le temps d’attendre l’application, même lors de tâches de longue durée. Il doit y avoir toujours à l’écran quelque chose pour attirer l’attention de l’utilisateur (ex : ProgressBar).

Typographie, iconographie, contenu

Le style de Metro serait sans doute très différent sans sa police de caractères Segoe UI (Segoe WP sous Windows Phone 7). Le texte dans les applications Windows Phone 7 ne sert pas qu’à afficher des contenus, il fait partie de la décoration de l’application au même rang que les images et les icônes.

L’iconographie est également au cœur du style Metro. Ils permettent de faire passer des messages sans la barrière de la langue. Le nom « Metro » vient d’ailleurs de la signalétique des transports, où les indications très sobres et directes doivent permettre à tous les voyageurs de trouver leur chemin. Les applications Metro doivent donc de la même manière permettre aux utilisateurs de trouver leur chemin dans les écrans de l’application. Les icônes doivent êtres simples et sont le plus souvent monochromes pour profiter du contraste avec la couleur du fond sur lequel ils sont implantés.

Enfin le contenu est primaire dans l’application Metro. Cela permet à une application d’être hautement personnalisé et donc perçu différemment par ses multiples utilisateurs. Il faut donc réduire au maximum le nombre de contrôles qui ne sont pas du contenu.

Tactile, dynamique, en mouvement

Metro rassemble aussi un certain nombre de recommandation sur l’aspect tactile de l’application, en particulier la taille des éléments tactiles. En effet sur un système qui se veut complètement utilisable aux doigts et bénéficiant d’au moins 4 points simultanément, toute l’interface doit être interactive. Lors des interactivités, l’application doit montrer immédiatement que les mouvements sont pris en compte.

Enfin les transitions et animations ont un grand rôle à jouer dans l’application Metro : les transitions permettent de distraire l’utilisateur pendant le chargement des composants de l’application. Les animations permettent de simuler une interaction physique avec l’utilisateur.

Comment concevoir une application Metro ?

Microsoft a rendu disponible un document qui explique un grand nombre de best practices sur la conception d’application pour Windows Phone 7. Avant de vous lancer dans le développement je vous conseille de lire attentivement ce guide. Vous pouvez télécharger le Windows Phone UI Design and Interaction Guide à l’adresse suivante : http://go.microsoft.com/?linkid=9713252. Vous pouvez en outre lire le document explicatif du concept de Metro : http://go.microsoft.com/fwlink/?LinkID=189338

Ensuite il va vous falloir penser à comment votre idée d’application peut se traduire en langage Metro. Suivez bien les recommandations du guide, elles permettent à votre application d’être cohérente avec le système lui-même et avec les autres applications.

Sachez cependant qu’il n’y a pas une seule façon de faire une application sur un thème donnée qui soit conforme au style. Par exemple Microsoft a créé deux applications météo bien distinctes avec le style Metro ; Metro ne doit donc pas être un frein à la créativité mais un guide.

N’oubliez pas non plus que l’utilisateur doit être au centre de l’application. Essayer de penser en tant qu’utilisateur afin de faire les meilleurs choix pour les utilisateurs. L’utilisateur appréciera également si votre application se plie à sa personnalité et à son contenu. La personnalisation est donc un élément clé à ne pas oublier pendant la conception.

Une fois votre idée fixée sur le papier, vous pouvez passer au développement. N’oubliez pas, les contrôles de Silverlight pour Windows Phone 7 ont été entièrement stylisés pour respecter le style Metro. Cela ne vous empêche pas d’éditer leur aspect visuel, mais tâchez de rester dans l’esprit Metro, en évitant par exemple les boutons chromés ou les contrôles avec beaucoup de nuances de couleurs.

Microsoft a créé un style graphique attrayant basé sur un certain nombre de critères. En normalisant ces critères dans le langage de conception Metro, l’opportunité est offerte aux développeurs de créer des applications qui vont en quelque sorte étendre Windows Phone 7. Une chose est sûre, le prochain système d’exploitation mobile de Microsoft va offrir une expérience utilisateur particulièrement soignée et cohérente.

Comment persister les données sous WP7 ?

Conserver des données sur le téléphone est le commun d’une grande majorité des applications, pour ne pas dire toutes les applications mobiles. Dans Windows Mobile, l’application avait accès à l’intégralité du système de fichiers du terminal, ce qui rendait la tâche assez similaire à ce qui se fait sous Windows. Sous Windows Phone 7, on se rapproche plus de ce qui se fait dans Silverlight pour PC / Mac ; aucun accès au système de fichiers, et encore moins à la base de registre de l’appareil. Tout, ou presque, passe par l’IsolatedStorage.

L’IsolatedStorage est un espace de stockage qui comme son nom le suggère est isolé des espaces de stockage des autres applications. Il ne sera donc pas question de partager les fichiers de l’application A avec l’application B. Ou presque. En effet certains fichiers gérés par les hubs de Windows Phone 7, pourront être accessibles par toutes les applications qui veulent étendre le hub en question. Pour l’instant il est surtout question du Hub photos, mais qui sait peut-être sera-t-il possible à l’avenir d’étendre d’autre hubs, voir même d’étendre les applications.

Pour cet article je vais uniquement m’intéresser à l’accès à l’IsolatedStorage et à la configuration des applications grâce à l’IsolatedStorageSettings.

L’Isolated Storage

Tout ce qui concerne l’utilisation de l’IsolatedStorage se trouve dans l’espace de nom System.IO.IsolatedStorage. Pour commencer il faut récupérer la racine des fichiers ; pour cela une seule façon de faire, appeler la méthode statique GetUserStoreForApplication de la classe IsolatedStorageFile qui renvoie une instance de cette même classe.

IsolatedStorageFile root = IsolatedStorageFile.GetUserStoreForApplication();

Cet objet remplace les traditionnelles classes File et Directory du framework .NET. On peut par exemple vérifier la présence d’un fichier ou d’un dossier avec les méthodes FileExists et DirectoryExists. On peut également créer de nouveaux dossiers et fichiers (CreateDirectory et CreateFile), obtenir la liste des fichiers et dossiers (GetFileNames et GetDirectoryNames) et finalement ouvrir un fichier en lecture ou en écriture à l’aide de la méthode OpenFile et de la classe IsolatedStorageFileStream.

IsolatedStorageFileStream fs = root.OpenFile("file.xml", System.IO.FileMode.Open);

L’IsolatedStorageFileStream s’apparente à un FileStream classique et permet donc d’exécuter toutes les opérations habituelles, lire, écrire, repositionner le curseur, et pour finir fermer le flux. Il peut également être utilisé au travers d’un StreamWriter ou d’un StreamReader, respectivement pour lire ou écrire plus facilement dans le fichier.

L’IsolatedStorageFile permet donc de gérer tout l’espace de fichier réservé à l’application. Il s’apparente en beaucoup d’aspects aux APIs de .NET en matière de gestion de fichiers. En revanche, l’IsolatedStorage d’une application est limitée en taille. Il est donc nécessaire de vérifier le Quota via la propriété du même nom. A priori une application ne devra pas dépasser les 2Go de mémoire sur le téléphone, ce qui paraît déjà être une limite assez haute. Attention également, quand l’utilisateur supprimera l’application, il effacera du même coup toutes les données de l’application.

La configuration des applications

Pour gérer les paramètres de l’application, la solution que je viens de détailler paraît un peu lourde. C’est pour cela qu’existe l’IsolatedStorageSettings. Ce n’est ni plus ni moins qu’un dictionnaire persisté sur l’IsolatedStorage. Les clés sont des chaînes de caractères, et les valeurs sont les objets à persister. La classe IsolatedStorageSettings est donc idéale pour conserver la configuration de vos applications.

IsolatedStorageSettings.ApplicationSettings["Key"] = "Value";

Pour toute autre information, la MSDN est comme toujours d’une grande aide : http://msdn.microsoft.com/en-us/library/ff402541%28VS.92%29.aspx

Qu’en est-il de SQL Compact ?

Enfin la grande question, existe-t-il une version de SQL Compact disponible sur WP7 ? Hélas non, du moins pas pour le moment. Il existe en revanche un certain nombre de personnes qui se sont penché sur le sujet, en open-source ou non.

• Chris Koenig a répertorié quelques-uns de ces projets sur son blog : http://chriskoenig.net/2010/06/30/open-source-databases-for-windows-phone-7/.
• Alex Yakhnin explique sur son blog comment créer un Provider LINQ pour utiliser l’IsolatedStorage comme une base de données : http://blogs.msdn.com/b/priozersk/archive/2010/04/14/creating-linq-data-provider-for-wp7-part-1.aspx

Hello world!

Windows Phone 7 apporte un vent de changement dans le monde de la mobilité selon Microsoft. Au centre de sa philosophie, un concept, Metro. Ce concept a pour but premier d’offrir à l’utilisateur une expérience riche et agréable dans toutes les fonctionnalités du logiciel. J’aurai bien entendu l’occasion de revenir plus en détail sur cette philosophie d’un point de vue développeur autant que de mon point de vue d’utilisateur.

Windows Phone 7 concentre également toutes les dernières nouveautés en un; on retrouve le Silverlight, superstar des technologies de développement Microsoft de ces dernières années, le cloud computing avec Windows Azure, la conception de jeux vidéos avec le framework XNA, et bien d’autres encore. Toutes ces nouveautés ont de quoi émerveiller les développeurs et les graphistes qui pourront créer de superbes applications, et ainsi séduire les utilisateurs avides de nouvelles technologies.

Au travers de ce blog, je souhaiterai partager mes découvertes sur cette nouvelle plateforme qui s’annonce vraiment riche en surprises !