Étude de cas de conception : adaptation de site Web en application Windows Runtime

La conception de sites Web est une pratique courante depuis de nombreuses années. Avec Windows 8, les concepteurs et les développeurs peuvent exploiter les technologies Web auxquelles ils sont habitués, telles que HTML5, CSS3 (feuilles de style en cascade de niveau 3) et JavaScript, pour créer des applications du Windows Store. Ce document traite de la manière de présenter les fonctionnalités d’un site Web afin d’en faire une application du Windows Store performante. Il montre également comment apporter de la valeur ajoutée, et comment personnaliser et enrichir l’expérience utilisateur au moyen des fonctionnalités de la plateforme Windows 8.

Notre objectif est d’aider les concepteurs et les développeurs à refondre leurs sites Web en applications du Windows Store.

Pour en savoir plus sur les opportunités commerciales de Windows 8, voir Vente d’applications. Pour plus d’informations sur les fonctionnalités permettant de créer des applications du Windows Store, voir le Guide du produit Windows 8 pour développeurs.

Télécharger cet article : Pour télécharger cet article, voir Version hors connexion de cet article.

Le site Web et l’application de camions-restaurants

Le point de départ de cet article est un site Web de camions-restaurants, qui permet aux utilisateurs de parcourir la liste des camions-restaurants de leur voisinage, de s’informer de l’actualité et de donner leur avis. Dans l’étude de cas orientée conception ci-après, nous examinons les moyens de refondre les fonctionnalités internes du site pour les étendre à une application du Windows Store.

La migration vers une application du Windows Store est de mettre en lumière les fonctionnalités les plus intéressantes du site Web, tout en gardant la parité avec les fonctionnalités principales du site. Nous avons déterminé que l’application du Windows Store était parfaite pour permettre aux utilisateurs de rechercher des camions-restaurants dans le voisinage. L’illustration suivante montre l’anatomie de l’interface utilisateur du site Web des camions-restaurants. Nous voyons ici comment convertir chacun de ces composants de l’interface utilisateur dans le style de conception Microsoft.

1. Disposition et navigation
2. Commandes et actions
3. Contrats : recherche, partage et paramètres
4. Action tactile
5. Mise à l’échelle et vues
6. Notifications

Disposition et navigation

Priorité au contenu, non au chrome

La plupart des sites Web sont conformes à des modèles bien établis. La page d’accueil dispose d’une interface utilisateur pour la navigation (en-tête et pied de page), des utilitaires (inscription, recherche) et donne accès à d’autre contenu (blog et actualité). Ces éléments sont courants sur les sites Web, mais ils empêchent les utilisateurs de se concentrer sur le plus important : trouver un camion-restaurant près de chez eux. Lors de la conception de l’application du Windows Store, nous avons retiré une grande partie de cette interface utilisateur et de son contenu, car elle n’était pas directement liée à la fonction première de l’application.

Site Web :

• Le site Web a une mise en page classique sur deux colonnes, avec le contenu principal sur la gauche et le reste sur la droite.
• L’essentiel du site, les camions-restaurants, occupe environ un tiers de l’écran.

Application du Windows Store :

Tout l’espace de la page d’accueil est consacré à la raison d’être de cette application : trouver un camion-restaurant près de chez soi.

Exemple : mise en surbrillance de contenu sur la page d’accueil du site Web et l’écran d’accueil de l’application du Windows Store.

Le site Web comme l’application du Windows Store présentent les camions-restaurants et les catégories sur leur page principale. L’espace sur le site Web étant limité, chaque catégorie de camions-restaurants est représentée par une image unique. Lors de la conception de l’écran d’accueil de l’application du Windows Store, nous avons choisi de placer davantage d’informations sur les camions-restaurants au niveau supérieur, afin de mieux situer le contexte et de présenter une interface plus accueillante.

Site Web : Chaque catégorie de camions-restaurants est représentée par une image unique. L’utilisateur doit se rendre sur une autre page pour découvrir les autres camions-restaurants de cette catégorie puis en sélectionner un pour afficher plus de détails.	Application du Windows Store : Chaque catégorie est représentée par un groupe d’images. Les utilisateurs peuvent ainsi déterminer rapidement quels camions-restaurants d’une catégorie donnée sont dans le voisinage. Les utilisateurs accèdent directement à un camion-restaurant à partir de l’écran d’accueil.

 

Pour vous aider à choisir le meilleur modèle de navigation pour votre application, voir Modèles de navigation.

Voir le Modèle de navigation plat en action dans le cadre de notre série Fonctionnalités d’application de A à Z.

Utiliser la manipulation directe pour naviguer

Sur le site Web, les éléments de navigation se répètent dans la barre de navigation du haut et dans le pied de page. Les éléments de navigation sont permanents et toujours visibles. Nous avons conçu les éléments de navigation dans le style des applications du Windows Store, afin qu’ils soient à la fois intégrés directement dans le contenu et repoussés sur le côté tant que l’utilisateur n’en a pas besoin.

Exemple : accès à une catégorie particulière de camions-restaurants sur le site Web et dans l’application du Windows Store.

Site Web : A. Un utilisateur navigue jusqu’à une page de catégorie séparée du site Web pour voir toutes les catégories de camions-restaurants. B. L’utilisateur sélectionne ensuite une catégorie (par exemple, « Camions-restaurants de grillades »), puis accède à celle-ci. C. Enfin, l’utilisateur choisit un camion-restaurant dans la catégorie sélectionnée.

Application du Windows Store : A. L’écran d’accueil comprend une page comprenant plusieurs groupes de contenu : les camions-restaurants spécialisés, les camions-restaurants de proximité et la vue catégorie. B. Les utilisateurs peuvent toucher l’écran pour le faire défiler dans un sens ou dans l’autre, afin de voir les différentes catégories de camions-restaurants directement sur l’écran d’accueil. C. Sachant que chaque page montre plusieurs camions-restaurants dans chaque catégorie, l’utilisateur peut appuyer sur l’une d’elles pour aller directement à la page correspondante, ou le titre du groupe de catégories (par exemple, « asiatiques ») pour accéder à la page d’une catégorie.

 

Commandes et actions

Les commandes et les actions doivent rester sur la barre de l’application.

Les sites Web utilisent souvent des commandes ad hoc, qui apparaissent sous forme d’actions de l’utilisateur associées au contenu. Par exemple, sur notre site Web, chaque page de camion-restaurant comporte un lien permettant aux utilisateurs de télécharger des photos d’un camion-restaurant donné. Ces actions contextuelles se répètent sur chaque page de camion-restaurant.

Selon l’approche privilégiant « le contenu plutôt que la forme » de la conception d’une application du Windows Store, nous plaçons toutes les actions contextuelles dans la barre de l’application. Il s’agit d’un contrôle commun à tout le système. En outre, les commandes les plus utilisées sont placées près des bords afin d’être plus accessibles. Ainsi, la surface de l’application n’est pas encombrée de contrôles et quel que soit l’endroit où il se trouve, l’utilisateur peut effectuer un balayage vertical pour voir les actions autorisées dans la barre de l’application. Toutes les applications du Windows Store peuvent utiliser la barre de l’application pour leurs commandes. Les utilisateurs étant habitués aux interactions avec la barre de l’application, ils utilisent l’application plus volontiers et l’ensemble du système est plus cohérent.

Exemple : téléchargement de la photo d’une catégorie particulière de camions-restaurants sur le site Web et dans l’application du Windows Store.

Site Web : Commandes ad hoc. Les actions de l’utilisateur concordent avec le contenu.	Application du Windows Store : Par défaut, la barre de l’application est masquée pour offrir une expérience utilisateur immersive. L’utilisateur peut effectuer un balayage vertical pour accéder aux actions contextuelles. Les actions changent selon l’emplacement de l’utilisateur dans l’application ou le contenu sélectionné.

 

Contrats

Le site Web des camions-restaurants suit les conventions habituelles des sites Web concernant des actions globales telles que la recherche et l’inscription. Ces actions sont fixées de manière permanente dans l’angle supérieur droit de la page du site. Lors de la conception de l’application du Windows Store, nous n’avons pas inclus notre propre interface utilisateur pour ces actions globales. Au lieu de cela, nous avons exploité les fonctionnalités intégrées du système telles que les contrats de recherche, de partage et de paramètres. Sachant que ces éléments de l’interface utilisateur ne sont pas toujours visibles, l’espace de l’application est plus dégagé et laisse plus de place au contenu.

Le contrat de recherche permet de centraliser les recherches.

À l’instar de la plupart des sites Web, toutes les pages du site des camions-restaurants comportent une zone de recherche ; la recherche s’étend uniquement au site. Autrement dit, l’utilisateur doit d’abord accéder au site des camions-restaurants avant d’effectuer une recherche.

Lors de la conception de l’expérience de recherche dans l’application du Windows Store, nous avons utilisé le contrat de recherche pour permettre aux utilisateurs de trouver un camion sans avoir à ouvrir l’application. L’icône Rechercher donne accès aux fonctionnalités de recherche qui peuvent être appelées depuis n’importe quel emplacement du système.

Exemple : recherche d’une catégorie particulière de camions-restaurants via le site Web et l’application du Windows Store.

Site Web :

• La zone de recherche et toujours visible sur le site.
• Lorsque les résultats sont affichés, tous les éléments superflus du site sont toujours présents.
• Les utilisateurs doivent toujours accéder au site Web avant de rechercher un camion-restaurant.

Application du Windows Store :

• Les utilisateurs peuvent effectuer une recherche partout dans l’application en balayant le bord pour afficher les icônes et choisir une recherche. Vous pouvez également fournir une zone de recherche dans l’application qui s’affiche dans la barre de l’application ou sur le Canvas de l’application.
• L’application des camions-restaurants est sélectionnée par défaut, car l’utilisateur est actuellement dans l’application. Lorsque l’utilisateur commence la saisie, l’application propose des suggestions dans le volet de recherche. L’utilisateur voit ainsi rapidement quels termes produisent des résultats. Lorsque l’utilisateur a validé sa requête (par exemple, « camion-restaurant de grillades »), l’application affiche une vue montrant les résultats de la recherche.
• Cette vue dégagée, sans aucune fioriture, est réservée exclusivement aux résultats de la recherche. Si vous ajoutez une zone de recherche, vous contrôlez l’intégralité de l’expérience de recherche de l’utilisateur.

Exemple : recherche d’un camion-restaurant en dehors de l’application (disponible uniquement dans l’application du Windows Store).

Outre la recherche à l’intérieur de l’application, les utilisateurs peuvent effectuer des recherches hors de celle-ci en sélectionnant l’application des camions-restaurants comme cible de recherche. Dans l’exemple donné ici, l’utilisateur recherche « camion-restaurant de grillades » à partir de l’écran d’accueil. Il appuie sur l’application du camion-restaurant dans la liste des applications du volet de recherche. Cela a pour effet de lancer l’application et d’exécuter la requête. L’application étant optimisée pour rechercher les camions-restaurants du voisinage, un seul appui permet à l’utilisateur d’effectuer la recherche et de trouver les camions-restaurants près de chez lui.

Utilisez le contrat de partage pour rechercher d’autres destinations et les gens qui vous sont chers.

Sur le site Web des camions-restaurants, les utilisateurs peuvent partager des informations sur un camion-restaurant par e-mail ou sur Facebook ou Twitter. Les options de partage sont souvent accessibles en de nombreux emplacements d’un site Web, à proximité du contenu sur lequel il est possible d’effectuer des recherches.

Dans notre application du Windows Store, les scénarios de partage sont bien mis en évidence grâce au contrat de partage. Quant à l’icône Partager intégrée au système, elle évite de partager les boutons devant apparaître dans toute l’application. Les options de partage sont toujours accessibles au même emplacement, quelle que soit l’application utilisée. Cette modification simplifie à la fois la conception et le développement. En effet, il n’est plus nécessaire de se connecter à tous les services que l’utilisateur est susceptible de vouloir utiliser. Après l’avoir intégrée avec Partager, notre application est connectée à toutes les applications Windows ayant implémenté le contrat de partage. Il n’est pas nécessaire de modifier des API pour les services Web externes.

Exemple : partage d’une photo de camion-restaurant

Site Web : Chaque service de partage dispose de son propre bouton. Les boutons de partage sont disséminés dans tout le site Web.	Application du Windows Store : Un emplacement constant dans toutes les applications du Windows Store pour toutes les options de partage. Les utilisateurs peuvent appeler le contrat de partage n’importe où dans l’application. Lorsqu’un utilisateur choisit un service de partage, l’application cible peut personnaliser le volet de l’interface utilisateur et le marquage.

 

Exemple : vue rapprochée du volet de partage

Application du Windows Store :

• Toute application implémentée comme cible de partage apparaît dans la liste des applications du volet de partage. Par exemple, Socialite, Tweet@Rama ou Mail.
• Il est possible d’utiliser les divers types de contenu pris en charge par une application. Par exemple, les utilisateurs peuvent partager des liens, des photos ou enregistrer des informations dans une application de type bloc-notes.
• Les cibles de partage fréquentes apparaissent en premier, facilitant le partage pour les utilisateurs.

Utilisation du volet des paramètres

Le site Web des camions-restaurants dispose d’un certain nombre de fonctions utilitaires telles que À propos de, Inscription, Contact et Lettres d’information. Ces fonctions occupent des parties spécifiques de l’écran selon le modèle de conception utilisé, permettant aux utilisateurs de les trouver facilement. Elles sont cependant disséminées dans différentes parties du site. La configuration et l’administration ne sont pas les tâches essentielles de l’application du Windows Store. Le contrat de paramètres et son accès constant évitent aux utilisateurs de devoir se rappeler où se trouvent ces fonctions de gestion de l’application. Ils peuvent ainsi les appeler à tout moment.

Exemple : configuration d’options sur le site Web et dans l’application du Windows Store

Site Web :

• Les fonctions utilitaires telles que l’inscription, À propos de, Contact et Lettre d’information sont présentes dans différentes parties du site.

Application du Windows Store :

A. Les options de paramétrage sont centralisées dans le volet des paramètres.

B. Les utilisateurs peuvent s’inscrire n’importe où dans l’application sans sortir du contexte actuel.

C. Le paramètre de notification permet aux utilisateurs de spécifier le type de notification qu’ils souhaitent recevoir. Il remplace la lettre d’information du site et fournit aux utilisateurs des informations de l’application en temps opportun.

Utiliser le sélecteur de fichiers pour accéder aux fichiers des différents emplacements

Le site des camions-restaurants incite les utilisateurs à télécharger des photos des camions-restaurants proches de leur domicile. Dans une application du Windows Store, cette fonctionnalité peut être dupliquée facilement à l’aide d’un sélecteur de fichiers. Il s’agit d’une boîte de dialogue en plein écran, qui permet aux utilisateurs d’accéder aux fichiers et aux dossiers du PC, aux périphériques de stockage connectés ou à d’autres ordinateurs d’un réseau domestique. Les utilisateurs peuvent également accéder à des éléments des applications qui participent au moyen du contrat de sélection de fichiers.

Exemple : téléchargement d’une photo de camion-restaurant à partir du système de fichiers local

Application du Windows Store :

• L’utilisateur appuie sur le bouton Télécharger dans la barre de l’application et l’interface utilisateur du sélecteur de fichiers s’ouvre. Cette zone de l’interface utilisateur, qui a toujours le même aspect, apparaît chaque fois que l’utilisateur souhaite accéder à des fichiers.
• En appuyant sur le titre Fichiers, l’utilisateur voit un menu volant présentant tous les emplacements disponibles et accède au dossier qui l’intéresse.
• Lorsqu’il sélectionne plusieurs photos dans le dossier, une liste de miniatures en bas à gauche montre les photos sélectionnées.

Action tactile

Défilement horizontal pour mise en page horizontale

Le site Web et l’application du Windows Store des camions-restaurants sont conçus pour faciliter les interactions avec l’utilisateur et optimiser l’ergonomie. Le site Web est conçu principalement pour une interaction au moyen de la souris. Ainsi, le contenu de chaque page est disposé verticalement et l’utilisateur peut le faire défiler rapidement et facilement avec sa souris. L’application du Windows Store privilégie le mode tactile. Ainsi, elle apparaît en mode paysage, comme sur la plupart des PC de bureau et portable. La mise en page horizontale optimise l’exploitation de l’écran. Il est également plus pratique et naturel pour les utilisateurs de faire défiler le contenu horizontalement en touchant un terminal en mode paysage que de le faire défiler verticalement.

Exemple : navigation dans le contenu sur le site Web et sur l’écran d’accueil de l’application du Windows Store.

Glisser transversal pour sélectionner des objets

Sur les sites Web, une convention courante veut que des cases à cocher soient placées en regard des objets pour indiquer les choix multiples. Sous Windows 8, l’utilisateur peut balayer rapidement un objet, perpendiculairement au sens de défilement, pour le sélectionner dans une liste ou un tableau. Lorsque les objets sont sélectionnés, la barre de l’application apparaît automatiquement pour afficher les commandes correspondantes.

Exemple : sélection de plusieurs camions-restaurants sur l’écran d’accueil pour les épingler à l’écran d’accueil.

Lorsque l’utilisateur balaie la page d’accueil de l’application pour sélectionner un camion-restaurant, une barre de l’application apparaît. Elle affiche une commande Ajouter aux favoris permettant de placer un signet sur le ou les camions-restaurants sélectionnés. Ce geste est réversible. De ce fait, la sélection est beaucoup plus efficace dans les applications du Windows Store. Quant aux utilisateurs, ils sont ainsi plus en confiance pour les explorer.

Pincer et étirer les doigts pour effectuer un zoom sémantique

Le pincement et l’étirement des doigts permettent aux utilisateurs de parcourir rapidement une liste longue. La page d’accueil de l’application du Windows Store affiche un certain nombre de groupes tels que les camions-restaurants spécialisés, du voisinage, asiatiques, de grillades et spécial petit-déjeuner. Les utilisateurs peuvent faire défiler la page pour en savoir plus ou, au moyen du zoom sémantique, passer directement à un emplacement spécifique. Grâce à la fonction de zoom sémantique, le pincement fait un zoom arrière pour afficher toutes les parties de l’affichage actuel à la fois. L’utilisateur peut alors accéder directement au début, à la fin ou à une partie spécifique de la liste. Il est également possible de configurer le zoom arrière pour afficher le contenu intéressant de chaque section, ou bien des méta-informations sur une section donnée (telles que le nombre de camions-restaurants de chaque catégorie). Il est également possible de l’utiliser pour la navigation à la place des éléments de navigation persistants sur le Canvas de l’application.

Exemple : accès à une catégorie particulière de camions à l’aide du zoom sémantique

Site Web : L’utilisateur doit accéder à une page distincte pour voir toutes les catégories.	Application du Windows Store : Il peut utiliser le zoom sémantique sur l’écran d’accueil pour voir toutes les catégories sans quitter l’écran. Dans le zoom sémantique, chaque catégorie est représentée par une image. Toutes les catégories sont accessibles depuis l’écran d’accueil sans qu’il soit nécessaire de les faire défiler pour voir la liste complète.

 

Mise à l’échelle et redimensionnement

Concevoir une disposition qui s’adapte à différentes orientations et tailles d’écran

Nous avons conçu la mise en page du site des camions-restaurants de manière à pouvoir l’adapter à divers périphériques, tailles d’écran, résolutions et orientations. À l’instar d’un site Web fluide, les PC fonctionnant sous Windows 8 sont très divers : petites tablettes tactiles, ordinateurs portables et ordinateurs de bureau de plus grandes dimensions. Il est essentiel de concevoir l’application de manière à ce qu’elle reste conviviale sur toute la gamme d’appareils compatibles avec l’application du Windows Store pour atteindre davantage de clients.

De nombreux principes de la conception de sites Web peuvent s’appliquer au développement d’applications du Windows Store. Des modèles et des commandes intégrés facilitent le passage du mode paysage au mode portrait et inversement. Lorsque l’orientation passe en mode portrait, chaque catégorie affiche davantage de camions-restaurants. De même, l’application montre davantage de camions-restaurants dans chaque catégorie pour profiter de l’espace supplémentaire offert par les écrans haute résolution.

Exemple : site Web et application du Windows Store des camions-restaurants sur différents appareils

Site Web :

• Le site Web des camions-restaurants adapte sa mise en page et son défilement à la taille de l’écran et au matériel.

Application du Windows Store :

• L’application du Windows Store en mode portrait, en mode paysage et sur un écran haute résolution. L’espace supplémentaire permet d’afficher davantage de contenu.

Utiliser des largeurs étroites pour impliquer vos utilisateurs

Windows 8 permet aux utilisateurs de travailler en multitâche en plaçant des applications côte à côte à l’écran. La conception de votre application pour des largeurs étroites permet d’accroître le temps d’affichage de l’application à l’écran et incite l’utilisateur à l’utiliser plus longtemps. Il est facile pour l’utilisateur de modifier la taille de l’application en déplaçant le séparateur qui les divise. Il est donc important de préserver le contexte d’un redimensionnement à un autre. En effet, l’utilisateur ne doit pas perdre l’état actuel de l’application lorsqu’il la redimensionne.

Pour plus d’informations sur le redimensionnement, voir Recommandations en matière de tailles de fenêtre et de mise à l’échelle à la taille des écrans et Recommandations en matière de redimensionnement des fenêtres vers des dispositions hautes et étroites.

Exemple : écran d’accueil de l’application du Windows Store en largeurs étroite et large.

• À gauche : l’application Camions-restaurants en taille large occupe presque tout l’écran. L’utilisateur peut afficher une application météo et l’application de camions-restaurants côte à côte.
• À droite : en largeur étroite, l’utilisateur fait défiler l’écran verticalement pour accéder à du contenu supplémentaire, car le défilement est plus pratique le long du bord long. Cela est différent du mouvement panoramique horizontal en plein écran, qui est également optimisé pour le défilement le long du bord long.

Notifications

Utiliser des vignettes pour les mises à jour persistantes et dynamiques

Les utilisateurs du site Web des camions-restaurants peuvent accéder au site pour consulter l’actualité et les blogs, afin de connaître les nouveaux camions-restaurants de leur voisinage ou ceux qui ont changé d’adresse. Le site Web permet également aux utilisateurs de suivre les annonces des camions-restaurants sur Facebook et Twitter. Cependant, les utilisateurs doivent alors soit accéder au site Web pour consulter les nouveautés, soit s’inscrire pour en être informés. Les utilisateurs risquent alors de ne prendre connaissance des nouveautés que lorsqu’il est trop tard.

Lors de l’adaptation de cette fonctionnalité pour une application du Windows Store, nous avons opté pour les vignettes et les notifications toast, afin de fournir aux utilisateurs des informations plus à jour et selon leurs besoins particuliers. Les vignettes de l’écran d’accueil représentent les portes d’entrée de l’application du Windows Store. Elles sont conçues pour indiquer une activité et proposer du contenu personnalisé, nouveau, sur mesure, afin d’inciter l’utilisateur à utiliser l’application. L’application continue à afficher ce contenu même lorsqu’elle n’est pas en cours d’exécution.

Site Web :

• La section de l’actualité du site Web affiche le dernier emplacement en date d’un camion-restaurant.
• Le blog du site Web recense les nouveaux camions-restaurants et indique quand ils se trouveront dans un quartier donné.

Application du Windows Store :

• La vignette principale de l’application Camions-restaurants montre celles qui sont dans le voisinage de l’utilisateur et pour combien de temps. Il est possible d’actualiser les vignettes même lorsque l’application Camions-restaurants n’est pas active, afin que les utilisateurs restent informés via l’écran d’accueil.
• L’utilisateur peut épingler ses camions-restaurants (par exemple, celui qui vend des cheeseburgers) sous forme de vignettes sur l’écran d’accueil, afin d’être tenu informé des nouveautés les concernant. Cette fonctionnalité offre un niveau de personnalisation élevé répondant au plus près à ses besoins. De nombreux modèles de vignettes et tailles sont disponibles aux concepteurs d’applications, afin de faciliter leur implémentation.

Utiliser des toasts pour les notifications temporaires et importantes

Outre les notifications par vignette, il est également possible d’utiliser les notifications toast pour informer les utilisateurs d’événements en temps réel. À la différence des mises à jour par vignette qui sont passives, les notifications toast des applications du Windows Store sont des mises à jour importantes qui interrompent les utilisateurs. Elles s’affichent en haut à droite de l’écran et peuvent apparaître n’importe où dans le système. En règle générale, il est préférable de laisser les utilisateurs choisir eux-mêmes s’ils souhaitent recevoir ces notifications au premier lancement de l’application. Le cas échéant, il est possible d’afficher les notifications toast dans les vignettes tant qu’elles restent pertinentes.

Exemple : un des camions-restaurants préférés de l’utilisateur a changé d’adresse.

L’utilisateur a choisi d’activer la notification toast dans le volet des paramètres, afin de savoir quand son camion-restaurant a changé d’adresse.

Conclusion

Lorsque vous concevez une application du Windows Store à partir d’un site Web existant, demandez-vous toujours dans quel domaine votre application est la plus performante. Lorsque vous avez trouvé la réponse, optimisez votre application du Windows Store pour ce scénario. N’oubliez jamais que le contenu est plus important que le chrome : utilisez les commandes intégrées du système telles que Partager, Rechercher et Paramètres, pour donner accès aux fonctionnalités courantes d’une manière intuitive, à laquelle les utilisateurs sont habitués. Dissimulez les commandes hors de l’écran lorsqu’elles ne sont pas nécessaires au moyen de la barre de l’application et des commandes de zoom sémantique. Utilisez les vignettes et les notifications en direct pour que les utilisateurs continuent de profiter de votre application, même lorsqu’elle n’est pas en cours d’exécution. Vous obtiendrez ainsi une application du Windows Store attrayante, que vos utilisateurs apprécieront et qui vous aidera à développer votre activité.

À propos des auteurs

Nicholas Huttema est concepteur d’interfaces visuelles chez Plain Concepts. Il aime les idées nouvelles et les interfaces utilisateur nettes. Nick a commencé sa formation et sa vie professionnelle au Michigan en tant que dessinateur de gravures. Depuis, il a ajouté UX Design à ses compétences en travaillant dans différentes entreprises de Los Angeles et de Seattle. Il a notamment travaillé pour Microsoft, Myspace, Amazon.com et Herman Miller. En dehors du travail, il pratique la randonnée, le camping et le snowboard.

Qixing Zheng est User Experience Program Manager chez Microsoft. Elle fait partie de l’équipe qui a créé l’interface utilisateur de Windows 8 et a fait découvrir le style de conception Microsoft aux concepteurs. Sa passion est profondément ancrée dans le désir d’aider les autres à améliorer leurs conditions de vie quotidiennes grâce à la technologie. Avant d’intégrer l’équipe Windows, Qixing a travaillé comme premier conseil UX chez Microsoft Canada, où elle intervenait dans des universités, chez des designers et dans des entreprises au sujet de l’investissement de Microsoft dans UX. Elle a également participé à l’identification de héros de bande dessinée et à la collecte de témoignages auprès des dessinateurs.