Applications de productivité

Windows 8.1 est une plateforme idéale pour les applications de productivité. Parallèlement à l’environnement de bureau traditionnel qui assure le fonctionnement des applications de productivité existantes, le nouvel environnement pour applications du Windows Store permet de créer des applications de productivité dans des styles plus modernes. Nous allons vous montrer ici divers aspects sous lesquels les applications de productivité profitent du style de conception Microsoft et des fonctionnalités de Windows 8.1.

Vue d’ensemble

Windows 8.1 offre une portée sans égal sur une large gamme de périphériques, des tablettes tactiles aux ordinateurs portables et de bureau haute résolution. Pour les applications de productivité, cela signifie une opportunité unique d’utiliser des entrées différentes pour permettre aux utilisateurs d’être productifs dans des scénarios et des cas d’utilisation variés.

Le Windows Store offre de nouvelles opportunités de distribution, de promotion et de vente de vos applications. Des scénarios tels que les achats en ligne et les versions d’évaluation sont pris en charge avec un codage minimal, ce qui vous permet de rapidement commencer à gagner de l’argent.  

Cette rubrique présente les fonctionnalités de Windows 8.1 qui revêtent une importance particulière pour les applications de productivité, notamment :

• Applications du Windows Store : un nouveau langage de conception pour les applications qui met l’accent sur la création de contenu plein écran et sur les scénarios de productivité immersifs. Windows s’efface, laissant la vedette à votre contenu.
• Vignettes dynamiques : optimisez l’engagement des utilisateurs et faites en sorte qu’ils reviennent dans votre application en créant des vignettes dynamiques qui montrent le contenu récent sur lequel ils ont travaillé. Les vignettes secondaires facilitent l’établissement de liens ciblés dans le contenu et permettent aux utilisateurs d’épingler le contenu fréquemment utilisé dans votre application.
• Contrat de partage : Windows 8.1 facilite le partage et la collaboration entre applications. Votre application peut ainsi travailler avec d’autres pour faire en sorte que les utilisateurs soient productifs.
• Contrat de recherche : nouvelle fonctionnalité de premier niveau du système d’exploitation qui rend plus facile que jamais la recherche et l’organisation de leur contenu par les utilisateurs. Votre application est incluse dans les résultats de recherche lorsque les utilisateurs recherchent du contenu.
• Zone de recherche : permet aux utilisateurs d’effectuer des recherches au sein du contenu de votre application et fournit un affichage des résultats personnalisé.
• Sélecteur de fichiers : avec le sélecteur de fichiers, les utilisateurs de votre application de productivité peuvent plus facilement utiliser des fichiers, des documents et des photos du système de fichiers et d’autres applications et services qui participent au contrat de sélecteur de fichiers.
• Zoom sémantique : cette fonctionnalité de Windows 8.1 permet aux utilisateurs de quitter la vue détaillée d’une application et d’afficher une vue d’ensemble de leur contenu et de ce sur quoi ils travaillent. Essayez-le dans l’écran d’accueil pour le voir en action.
• Fenêtres redimensionnables : les utilisateurs peuvent redimensionner les applications afin que plusieurs applications puissent d’exécuter côte à côte en même temps. Les utilisateurs peuvent utiliser plusieurs applications à la fois ce qui leur permet d’être productif tout le temps.

Plein écran

L’un des avantages les plus évidents des applications du Windows Store pour la productivité est qu’elles ne se disputent pas l’espace avec d’autres applications ou éléments d’interface utilisateur de Windows. Une application utilise le moindre pixel visible de l’écran pour afficher son contenu. Les éléments d’interface utilisateur non essentiels ou perturbants peuvent être masqués et affichés d’un mouvement simple, ce qui signifie que l’application dispose d’une vaste espace pour afficher les informations les plus importantes pour la tâche en cours. La philosophie de conception « le contenu avant le chrome », qui est si agréable dans les applications de magazine ou vidéo, s’applique également aux applications de productivité. Lorsque toutes les sources de distraction sont retirées, il est facile de se concentrer sur le contenu présenté par l’application.

Lors de la conception d’une application de productivité, commencez par identifier la tâche principale de l’utilisateur. Exploitez ensuite chaque pixel de l’écran de manière à ce que votre application excelle dans cette tâche précise. Réfléchissez à la manière dont le fait de disposer de davantage de place peut rendre la tâche plus facile, rapide et plaisante. Pensez en termes de visualisations riches d’informations intéressantes et interactives plutôt qu’en termes de représentations statiques de données. Réfléchissez à la manière dont votre application peut utiliser l’espace et le positionnement pour véhiculer un sens. Nombre des conventions et contrôles en usage aujourd’hui ont été développés lorsque les écrans d’affichage des ordinateurs de bureau avaient une résolution inférieure à celle des smartphones actuels. Les applications du Windows Store offrent une chance de redéfinir la manière dont les utilisateurs interagissent avec les informations, les analysent et les manipulent pour arriver à faire ce qu’ils doivent faire.

Les applications de productivité résultent généralement d’un mélange intéressant de scénarios de création de contenu et de consommation de contenu. Par exemple, les applications de productivité peuvent être utilisées pour créer et lire des documents ou encore pour créer et gérer des listes de tâches. La complexité des applications de productivité varie également énormément selon la façon dont elles gèrent la navigation et l’exposition des commandes et des expériences — des applications de tâches simples et légères aux applications de création de contenu complexes et riches avec des menus à plusieurs niveaux contenant une myriade d’options. Une application de productivité Windows 8.1 réussie est une application qui permet de naviguer entre ces expériences de manière rapide, fluide et plaisante.

Disposition et navigation dans les applications de productivité

Le modèle de navigation que vous choisissez dépend des types de scénarios pris en charge par votre application. Si votre application propose des expériences riches multiples (comme la présentation de plusieurs documents), avec une organisation et une structure entre ces expériences, un modèle hiérarchique peut vous aider à placer l’ensemble de votre contenu au premier plan au lieu de l’enfouir dans des menus ou des onglets. Toutefois, si la densité d’informations de votre application n’est pas importante ou si les scénarios qu’elle propose n’ont pas besoin de hiérarchie ni de structure, optez pour un modèle plat qui permet aux utilisateurs de naviguer rapidement entre les expériences dans votre application. Les applications proposant des affichages « maître/détails » (comme les applications de messagerie électronique ou instantanée) peuvent utiliser un mode liste pour mieux présenter leur contenu. Dans certaines applications de productivité, des scénarios peuvent nécessiter des types d’entrée de données différents, comme des formulaires, et ainsi avoir recours à la disposition de formulaire suggérée plus loin dans cet article. Choisissez le modèle qui permettra le mieux à vos utilisateurs de trouver rapidement et aisément le contenu qu’ils souhaitent.

Pour plus d’informations sur les modèles 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.

Modèle hiérarchique

Les applications de productivité avec une structure hiérarchique et un jeu de données important, comme une application de notes avec de nombreux bloc-notes et notes, peuvent utiliser un modèle hiérarchique qui présente l’ensemble du contenu de l’utilisateur au premier niveau. Ce modèle plaît aux utilisateurs car tout le contenu leur est directement présenté.

Page Hub de votre application

Votre page Hub comporte différentes sections, correspondant chacune aux différentes sections de votre application. Chaque section peut présenter du contenu ou une fonctionnalité. Le Hub doit être varié sur le plan visuel de manière à séduire les utilisateurs et les amener vers différentes parties de l’application. Par exemple, l’application de notes ci-dessous affiche une partie des notes les plus récentes de chaque bloc-notes directement au premier niveau. L’image suivante montre un exemple de page Hub.

Un simple appui sur une note conduit l’utilisateur directement dans cette note. Si l’utilisateur appuie sur l’en-tête (« Voyage - NYC », par exemple), la page de section de ce bloc-notes s’affiche, si le bloc-notes offre davantage de contenu que ce qui est affiché sur la page d’accueil.

Envisagez de laisser les utilisateurs choisir le mode de tri de leur contenu. Ils pourront par exemple choisir de le trier dans l’ordre alphabétique, par date, par type de contenu ou selon qu’il est ou non partagé. Tout dépend du contenu présenté par votre application et du schéma d’utilisation standard de vos utilisateurs. L’image suivante illustre un exemple de tri de notes.

Barre de l’application supérieure

Vous pouvez utiliser la barre de l’application supérieure pour permettre aux utilisateurs de passer rapidement d’une section à l’autre de votre application, latéralement. Par exemple, un utilisateur qui lit une note dans un bloc-notes peut très simplement et rapidement passer à une autre note dans un autre bloc-notes en utilisant la barre de l’application supérieure. L’image suivante montre une barre de l’application supérieure qui s’affiche dans une application de prise de notes quand l’utilisateur effectue un balayage vertical.

¾

Zoom sémantique

Le zoom sémantique permet aux utilisateurs de naviguer rapidement au sein d’une vue unique en leur montrant visuellement comment se présente le contenu en fonction du niveau de zoom (avant ou arrière). Par exemple, dans une application de prise de notes, les utilisateurs peuvent rapidement passer d’un bloc-notes à un autre en faisant un mouvement de pincement suivi d’un mouvement panoramique. Si les utilisateurs choisissent d’afficher leurs notes par date, ils peuvent également rapidement passer des notes les plus récentes aux plus anciennes.

Cette image illustre le regroupement de contenu lors d’un zoom arrière.

Le zoom sémantique peut également être utilisé dans une page de section spécifique pour naviguer dans le contenu de cette section ou catégorie. Par exemple, dans une application de prise de notes, les utilisateurs peuvent se servir du zoom sémantique pour parcourir rapidement différentes notes dans le même bloc-notes.

Pour plus d’informations sur le zoom sémantique, voir Recommandations en matière de zoom sémantique.

Modèle de disposition plat

Si la majorité du contenu de votre application se trouve au même niveau, sans hiérarchie complexe, envisagez d’utiliser un système de navigation plat. Avec ce modèle, les utilisateurs peuvent naviguer entre les documents, pages, onglets ou modes qui résident tous au même niveau hiérarchique de manière rapide et fluide. Pour en savoir plus sur le modèle plat, voir Conception de la navigation pour les applications du Windows Store.

Le modèle plat est également un bon choix si votre application comprend des scénarios tirant parti d’une interface multidocument. La barre de navigation supérieure est l’outil idéal pour naviguer entre plusieurs contextes. Par exemple, dans une application de création de feuilles de calcul, le modèle plat peut permettre de basculer rapidement entre les différentes feuilles de calcul sur lesquelles un utilisateur travaille.

Certaines applications peuvent choisir d’inclure d’autres fonctionnalités dans la barre de l’application supérieure, par exemple en ajoutant un bouton « + » pour créer une feuille de calcul directement dans la barre de l’application supérieure. En voici un exemple dans le navigateur (application du Windows Store) illustré ici.

Modèle de disposition liste

Si votre application de productivité comprend des scénarios qui impliquent la notion d’affichage « maître/détails », dans lequel la sélection d’un élément détermine ce qui est affiché dans un volet de détails, envisagez d’utiliser une disposition en liste pour le volet maître. Par exemple, une application de gestion de projet peut afficher les jalons et les échéances dans un volet maître et, lorsqu’un élément est sélectionné dans ce volet, afficher les détails de cet élément dans la section de détails. Une application de messagerie électronique pleut placer la boîte de réception à gauche et le volet de lecture du côté droit de l’écran, comme illustré ici.

Modèles de disposition formulaire

Les scénarios des applications de bureau requièrent souvent une disposition en formulaire, dans laquelle les utilisateurs doivent entrer des informations à propos de quelque chose. Par exemple, lors de la création d’une invitation à une réunion dans une application de calendrier, les utilisateurs doivent entrer le lieu, l’heure de début, l’heure de fin, la date, les participants et d’autres informations similaires. Ce type de disposition utilise généralement un mélange de types de contrôles différents et fonctionne mieux avec un modèle à base de colonnes.

Lorsque vous décidez quelle disposition en formulaire utiliser, prenez en considération le flux de la tâche que vous souhaitez que l’utilisateur réalise et à quel endroit de ce flux le défilement sera nécessaire. Lorsque le clavier tactile est visible, le défilement augmente de manière significative dans la mesure où celui-ci occupe environ 50 % de l’espace disponible de l’écran dans l’orientation paysage. Les notifications d’erreurs en ligne éventuellement affichées augmentent à la fois la longueur du contenu et le besoin de défilement.

Au lieu d’essayer de faire entrer tous les contrôles dans un seul formulaire très long, envisagez de scinder la tâche en une séquence de plusieurs formulaires.

Une disposition à colonne unique peut convenir aux formulaires longs ou courts à défilement vertical. Dans l’exemple de disposition à colonne unique suivant, l’ordre de lecture et de tabulation est de haut en bas et de gauche à droite.

Une disposition formulaire à deux colonnes fait le meilleur usage de l’espace horizontal visible dans une orientation paysage. Pour réduire au maximum le défilement nécessaire, faites en sorte que l’ordre de lecture et de tabulation aille de gauche à droite, puis de haut en bas.

L’image suivante illustre une disposition à deux colonnes.

N’utilisez pas un ordre de lecture et de tabulation de haut en bas et de gauche à droite dans une disposition à deux colonnes longue avec défilement. Cela est très contraignant car l’utilisateur doit atteindre le bas de la première colonne, puis revenir en haut de la seconde et descendre de nouveau pour remplir tout le formulaire. De la même manière, une disposition à deux colonnes ne convient pas dans l’orientation portrait car les colonnes sont alors trop étroites.

Les exemples suivants montrent ce qui doit être évité dans une disposition à deux colonnes longue avec défilement.

Navigation dans le contenu d’une application de productivité

Les applications de productivité impliquent souvent du multitâche ; les utilisateurs faisant des allers-retours entre différents types de contenu dans votre application. Par exemple, un utilisateur peut basculer entre de multiples documents, comme des articles de recherche ou des archives, lorsqu’il fait un devoir. Avec cet accès rapide et fluide à l’ensemble de ce contenu, les utilisateurs maximisent leur productivité au sein de votre application. Pensez à utiliser la barre de l’application supérieure décrite dans Conception de la navigation pour les applications du Windows Store pour accéder aux documents récemment utilisés, aux documents actuellement ouverts et à tout type de contenu de votre application en rapport avec le travail actuel de l’utilisateur. Pensez également à prendre en charge plusieurs fenêtres afin que les utilisateurs puissent effectuer plusieurs tâches entre différentes parties de votre application. Pour plus d’informations, voir Recommandations en matière de fenêtres multiples.

Commandes

Les applications de productivité ont tendance à avoir beaucoup plus de commandes que d’autres types d’applications. Il est donc nécessaire de penser à la meilleure façon d’afficher les commandes tout en conservant le contenu de l’utilisateur au premier plan. Les utilisateurs doivent pouvoir réaliser les scénarios principaux de votre application (ceux-là même qui constituent vos points forts) en utilisant uniquement la zone de dessin de l’application. Laissez dans la mesure du possible les utilisateurs manipuler directement le contenu sur le Canvas, plutôt que d’ajouter des commandes qui agissent sur le contenu. Par exemple, lorsque les utilisateurs lisent un document, offrez-leur la possibilité de pincer et d’étirer directement sur le Canvas pour agrandir ou réduire la taille de police d’affichage plutôt que d’ajouter un contrôle ayant cette même fonction. Pour en savoir plus sur les commandes, voir Modèles de commandes.

Certaines commandes et contrôles font tellement partie intégrante de votre application qu’il serait ridicule de ne pas les voir tout le temps à l’écran. Par exemple, le bouton Lire sur une application multimédia mise en pause ne sera probablement jamais masqué. Mais la plupart des commandes n’ont pas besoin d’être en permanence sur l’écran. Pour aider les utilisateurs à rester productifs sur leur contenu, de nombreuses commandes distrayantes peuvent être retirées de l’écran et réaffichées uniquement si nécessaire au moyen d’un mouvement commun et simple.

La barre de l’application inférieure est la barre d’outils courante qui peut apparaître sur le bord inférieur de votre application. Elle est généralement hors écran, mais peut être affichée en balayant du doigt l’écran à partir du bord supérieur ou inférieur, en cliquant dessus avec le bouton droit de la souris ou en appuyant sur la touche du logo Windows+Z sur un clavier. Par ailleurs, la barre de l’application inférieure s’affiche automatiquement lorsqu’une sélection est effectuée dans le contenu d’une application. Les outils présentés dans la barre de l’application inférieure sont contextuels, de sorte que seules les commandes appropriées sont affichées. Par exemple, lorsqu’un mot est sélectionné, la barre de l’application inférieure s’affiche automatiquement et présente des commandes de mise en forme du texte. Si une image est sélectionnée, la barre de l’application inférieure présente des commandes d’édition d’image. La nature contextuelle de la barre de l’application signifie que des commandes non appropriées ne viennent pas vous perturber. Ainsi, les outils sont toujours à portée de main, mais en dehors de votre route jusqu’à ce que vous en ayez besoin.

La barre de navigation supérieure peut également apparaître lorsque vous appelez manuellement les barres d’application. Elle permet à l’utilisateur d’atteindre différents emplacements au sein d’une application. Par exemple, un navigateur peut utiliser cette barre pour afficher des miniatures des onglets actuellement ouverts. Une application de traitement de texte peut utiliser cette barre pour basculer entre différents documents ouverts. Une application d’achat peut utiliser cet espace pour basculer entre différents rayons du magasin.

La barre de l’application supérieure et la barre de l’application inférieure peuvent toutes les deux contenir des boutons et des menus. Si vous avez de nombreuses commandes connexes qui sont toutes contextuellement appropriées au même moment, il peut être judicieux de les placer dans un menu qui est ouvert à partir de cette barre.

Barre de l’application inférieure

Il est important d’organiser et de présenter les commandes de manière cohérente afin que les utilisateurs ne soient pas accablés par le nombre de commandes. Par exemple, dans une application de notes, les utilisateurs voudront peut-être créer des notes ou des bloc-notes, trier les blocs-notes dans l’ordre alphabétique ou par date, modifier les options de mise en forme pour le texte des notes, spécifier l’emplacement et ajouter des balises et des images. La barre de l’application permet de placer toutes les commandes de votre application sur une surface homogène qui est prévisible pour les utilisateurs de sorte qu’ils peuvent trouver toutes leurs commandes sous un même toit.

Dressez un inventaire de l’ensemble des commandes de votre application et déterminez dans quels scénarios elles seront utilisées. Un moyen de réduire les commandes présentées dans la barre de l’application consiste à les organiser en deux catégories : les commandes globales qui s’appliquent à l’ensemble de l’application et les commandes qui sont utiles seulement sur la sélection. Pour ces dernières, n’affichez pas toujours les commandes contextuelles sur la barre de l’application, mais affichez-les uniquement lorsque l’utilisateur a sélectionné quelque chose ou uniquement dans le contexte de l’application dans laquelle elles sont appropriées.

Placez les commandes globales présentes partout dans l’application, comme les opérations synchroniser et « créer nouveau », sur le côté droit de la barre de l’application. En particulier, placez la commande Nouveau—la commande qui crée du contenu comme une nouvelle note ou un nouveau bloc-notes— contre le bord droit de la barre. Cela confère à chaque commande Nouveau un placement cohérent quel que soit le contexte ou l’application spécifique, et elle est facilement accessible avec le pouce pour l’entrée tactile.

Utilisez les commandes Supprimer et Nouveau si votre application porte sur la gestion d’entités individuelles susceptibles de persister en dehors de votre application, —comme dans une application de messagerie ou d’appareil photo. Les commandes Supprimer et Nouveau doivent toujours apparaître dans l’ordre indiqué ici.

Utilisez les commandes Supprimer et Ajouter si votre application porte sur la gestion d’une liste, comme une liste de tâches. Les commandes Supprimer et Ajouter doivent toujours apparaître dans l’ordre montré ici.

D’autres commandes affectent quant à elles les sélections. Elles doivent toujours apparaître complètement à gauche, qu’il s’agisse de commandes contextuelles qui apparaissent au moment de la sélection ou de commandes qui affectent une sélection existante, comme les options de mise en forme, « Sélectionner tout » et « Effacer la sélection ».

Réfléchissez aux commandes qui sont fonctionnellement connexes et doivent être placées les unes à côté des autres. Assurez-vous de placer les commandes de façon cohérente chaque fois que cela est possible. Par ailleurs, créez des jeux de commandes pour gérer le nombre de commandes qui s’affichent dans la barre de l’application et envisagez de créer des menus de commandes pour les jeux de commandes partout où cela est possible. Par exemple, dans une application de notes, le tri des notes dans l’ordre alphabétique ou le tri par date peuvent être accomplis par une seule et même commande en utilisant un menu de commandes. Les menus de commandes permettent d’organiser les commandes et de réduire considérablement leur nombre, comme indiqué ici. Dans la première image, chaque commande Nouveau est une commande séparée sur la barre de l’application. Dans la seconde image, toutes les commandes Nouveau sont regroupées dans un menu des commandes Nouveau.

Assurez-vous que les paramètres sont affichés dans le contrat de paramètres et non dans la barre de l’application. Les utilisateurs peuvent ainsi configurer votre application via des mécanismes communs avec lesquels ils sont déjà familiarisés.

Extension des barres d’application

Les deux barres d’application peuvent contenir des boutons et des menus. Si vous avez de nombreuses commandes connexes toutes contextuellement appropriées au même moment, il est cohérent de les placer dans un menu qui est ouvert à partir de la barre. Les barres d’application ne sont pas limitées à des boutons et des menus : toutes deux vous permettent de créer vos propres contrôles uniques. Dans ce cas, réfléchissez à la meilleure manière dont les utilisateurs peuvent interagir avec ces nouveaux contrôles, avec une souris, un clavier ou par interaction tactile.

Dans les applications avec un nombre important de commandes, l’extension de la barre de l’application peut être envisagée et ce de différentes façons. Pour assurer une cohérence maximale avec le reste du système, essayez de suivre les recommandations ci-après :

• Gardez l’utilisateur concentré sur le contenu—Partez du principe que la plupart des interactions débutent par la manipulation directe du Canvas. Il est attendu que la plupart des commandes, voire toutes, soient placées hors écran sans incitation visuelle à les afficher à l’écran. Appuyez-vous sur les mouvements utilisés à l’échelle du système pour afficher et masquer la barre de l’application pour afficher et masquer votre interface utilisateur. Si vous ajoutez votre propre interface utilisateur masquée avec des méthodes d’invocation différentes, vous devrez également placer des boutons, widgets et flèches supplémentaires à l’écran afin de former l’utilisateur. En vous appuyant sur les mouvements système, vous évitez aussi l’ajout à l’écran d’éléments qui détournent l’attention du contenu de l’utilisateur.
• Placez les commandes sur la barre de l’application inférieure—Dans les applications du Windows Store, l’emplacement naturel et attendu des commandes est sur le bord inférieur de l’application (ou juste au-dessus du clavier tactile). Cet emplacement permet aux utilisateurs tactiles d’interagir avec les commandes sans que cela ne cache le contenu. Cet emplacement est également lié au mouvement tactile qui est utilisé pour afficher les commandes manuellement. Les commandes placées à un autre endroit sont moins prévisibles et elles risquent d’interférer avec le contenu que l’utilisateur essaie d’afficher ou avec lequel il essaie d’interagir.
• Placez les contrôles de navigation sur la barre de l’application supérieure— Dans les applications du Windows Store, l’emplacement naturel et attendu de la navigation est sur le bord supérieur de l’écran. Étant donné que cette barre sert à quitter le contenu actuellement affiché, il est acceptable que la main de l’utilisateur bloque la vue de l’écran pendant qu’il utilise la barre. La barre de l’application supérieure affiche généralement des miniatures plutôt que des boutons afin de la distinguer de la barre de l’application inférieure.
• Regroupez toutes les commandes masquées dans la barre de l’application— Toutes les commandes qui sont masquées hors écran doivent l’être au même endroit. Le mouvement système offre un moyen simple et standardisé d’afficher à l’écran les commandes masquées. Si des commandes sont masquées à plusieurs endroits, vous aurez besoin de plusieurs façons d’appeler ces surfaces masquées. Très rapidement, cela conduit à créer trop d’endroits que l’utilisateur doit vérifier pour trouver vos commandes. Pire encore, chaque surface peut être masquée derrière un mouvement secret distinct ou tout autre astuce de l’interface utilisateur et les utilisateurs se casseront la tête pour savoir s’ils les ont toutes trouvées.

Menus contextuels

Les commandes du Presse-papiers comme Couper, Copier et Coller pour le texte sélectionné, de même que les commandes permettant de copier et d’ouvrir des liens pour les URL peuvent utiliser les menus contextuels qui sont fournis par défaut par le système. Voici des exemples de commandes du Presse-papiers dans un menu contextuel.

Entrée de données dans les applications de productivité

Les applications de productivité peuvent présenter de nombreux scénarios d’entrée de données. Par exemple, que ce soit la création d’une liste de tâches ou d’un nouveau document, la modification d’une feuille de calcul existante ou la création d’une invitation de calendrier, toutes ces actions nécessitent une entrée de données. Faire en sorte que l’entrée de données puisse se faire de manière aussi rapide et fluide que possible peut aider vos utilisateurs à accomplir leur travail rapidement et efficacement.

Étudiez bien vos scénarios et, dès lors que cela est possible, réduisez la quantité de texte que les utilisateurs doivent entrer dans le système. Stratégies allant dans ce sens :

• Contrôles courants—Pour les entrées avec beaucoup de mise en forme et nécessitant une validation (comme la date, l’heure ou l’emplacement), utilisez des contrôles courants comme le contrôle de sélection, les zones de liste déroulante, les boutons d’option, les cases à cocher et les sélecteurs de dates et d’heure.
• Remplissage automatique—Utilisez le Remplissage automatique dès que cela est possible pour apporter une satisfaction immédiate à l’utilisateur. Les utilisateurs n’en seront que plus efficaces avec l’entrée de données.

L’image suivante illustre les suggestions dans un sélecteur de contacts.

Clavier tactile

Suivez les recommandations fournies dans Réponse à l’entrée de clavier de manière à concevoir une application faisant le meilleur usage des claviers. En ce qui concerne plus particulièrement le clavier tactile, suivez les recommandations ci-après :

• Dans la mesure du possible, placez les contrôles d’entrée de texte en haut du Canvas de votre application. Ainsi, le contexte ou la partie visible pour l’utilisateur ne change pas à l’affichage du clavier tactile.
• Si l’entrée de texte est telle qu’elle ne peut pas être placée entièrement en haut du Canvas, lorsque l’utilisateur appuie sur le contrôle d’entrée de texte ou y accède avec la touche tabulation, l’application remonte automatiquement là où le contrôle apparaît de sorte que l’utilisateur puisse voir le texte qu’il tape. La fenêtre doit défiler afin de laisser au minimum 30 pixels entre le contrôle qui a le focus et le bord de l’écran/haut du clavier tactile, pour les divers mouvements partant des bords de l’écran, les élément d’interface utilisateur et la barre de redimensionnement du texte sélectionné. Pour en savoir plus sur la sélection de texte, voir Recommandations en matière de sélection de texte et d’images.
• Ne gardez pas le clavier en haut simplement pour garder le clavier à l’écran. Si aucune entrée de texte n’est attendue, fermez le clavier en définissant le champ d’entrée en lecture seule ou en déplaçant le focus.

Voici une illustration du clavier tactile.

Si votre application comporte un écran de type formulaire combinant des contrôles d’édition (zones de texte) et d’autres contrôles (comme des cases d’option et des cases à cocher), l’expérience utilisateur est médiocre si le clavier tactile apparaît et disparaît sans cesse. Windows 8 résout ce problème en empêchant la fermeture du clavier tactile lorsqu’un utilisateur se trouve dans un formulaire et navigue entre certains contrôles courants comme les cases d’option, les zones de texte, les contrôles de sélection et la barre de l’application. Avec les contrôles courants, votre application bénéficie gratuitement d’une expérience fluide. Voici une illustration du maintien du clavier tactile à mesure que l’utilisateur passe de contrôle à contrôle.

Vérification de l’orthographe

Activez la vérification de l’orthographe dans votre application. Les utilisateurs peuvent ainsi entrer rapidement du texte en toute confiance. (La vérification de l’orthographe peut être activée au moyen du contrôle RichEdit). Lorsque l’utilisateur tape un mot qui ne se trouve dans le dictionnaire, puis qu’il appuie sur la barre d’espace, un trait de soulignement rouge ondulé s’affiche sous le mot mal orthographié. Un appui sur le mot mal orthographié appelle le menu de vérification de l’orthographe dans lequel l’utilisateur peut corriger la faute ou l’ignorer, comme illustré ici.

Entrée manuscrite et reconnaissance de l’écriture manuscrite

Les utilisateurs ayant souvent tendance à utiliser plusieurs modes d’entrée de texte pour les applications de productivité, réfléchissez à la prise en charge d’autres moyens d’entrer du texte, comme un stylet. En leur offrant la possibilité d’écrire du texte manuscrit et de gribouiller dans leurs notes et documents dans votre application, vous enchanterez les utilisateurs et vous leur permettrez de rapidement et naturellement entrer du texte avec un stylet. Voir Recommandations en matière d’interactions utilisateur courantes pour plus d’informations sur les différentes méthodes d’entrée.

Sélection de texte

Dans de nombreux scénarios de productivité, notamment la création et la consommation de documents, les utilisateurs ont besoin de sélectionner du texte. Autorisez la sélection du texte tapé par les utilisateurs afin qu’ils puissent le modifier. Le texte peut également provenir d’autres utilisateurs, comme le texte du corps des messages électroniques que les utilisateurs voudront parfois copier. Voici une illustration de l’expérience de sélection de texte.

Lorsque vous activez la sélection de texte, laissez une marge équivalente à la moitié de la largeur de la barre de redimensionnement (4 millimètres) de chaque côté du texte et de la hauteur d’une barre de redimensionnement (8 millimètres) en bas de la zone si le texte est sans défilement. Les barres de redimensionnement seront ainsi tactiles dans tous les cas et n’interfèreront pas avec l’expérience utilisateur au bord de l’écran. L’image suivante montre les marges correctes à conserver lorsque vous activez la sélection de texte.

Typographie dans les applications de productivité

L’utilisation de la grille typographique et de l’échelle de taille dans les applications de productivité crée une hiérarchie visuelle qui permet aux utilisateurs d’analyser et de consommer beaucoup d’informations rapidement et facilement. Même si la police d’interface utilisateur Segoe proposée dans la gamme de types convient pour le contenu des applications de productivité, envisagez plutôt d’utiliser Calibri, la police recommandée pour les « documents modernes » ou Cambria, la police recommandée pour les « documents traditionnels ». Calibri est la police sans serif par défaut dans Microsoft Office et Cambria est la police serif par défaut ; les deux sont donc fortement associées avec les applications de productivité. Pour plus d’informations sur la typographie, voir Recommandations en matière de polices.

Si vous décidez de spécifier d’autres polices système, vérifiez qu’elles sont installées avec Windows 8 et qu’elles ne nécessitent pas l’installation d’une application distincte comme Microsoft Office. Si vous utilisez votre propres polices personnalisées ou sous licence, assurez-vous de disposer des droits légaux suffisants pour les inclure dans votre application. Quelles que soient les polices que vous utilisez, la gamme de types Windows 8 fournit une bonne indication du nombre maximal de tailles et de styles que vous devez utiliser.

La personnalité de l’interface utilisateur de Windows 8 requiert l’utilisation d’une majuscule au début des noms d’en-têtes, c’est également ce que nous recommandons pour les applications de productivité. Toutefois, la mise en majuscules des titres peut également être appropriée dans certains cas. L’utilisation de texte tout en minuscules peut sembler trop informel dans un application de productivité, de même que l’utilisation de texte tout en majuscules peut être ressenti de manière agressive. Notez que ces traitements typographiques ne seront pas appliqués dans de nombreuses langues localisées. Veillez également à utiliser les styles de mise en majuscules de façon cohérente. Utilisez-les pour différencier les parties du contenu, pas simplement pour ajouter un intérêt visuel à la typographie de votre application.

L’utilisation d’un jeu restreint de tailles de police dans l’ensemble de l’application, comme indiqué dans les recommandations relatives à la gamme de types, structure et rythme le contenu. Si plusieurs éléments de votre application utilisent la même taille de police dans la gamme de types pour véhiculer des types d’informations différents, pensez à jouer sur la couleur et l’épaisseur de police pour hiérarchiser les informations.

Contrats

Les contrats sont le ciment qui lie les applications du Windows Store entre elles et à l’interface utilisateur du système. Deux applications ayant implémenté le même contrat peuvent fonctionner ensemble pour mener à bien un scénario important ou complexe. Pour obtenir la liste complète des contrats des applications, voir Contrats et extensions d’application.

Partage

Le partage de contenu est un composant clé des applications de productivité actuelles et il existe de nombreux scénarios intéressants de partage vers, mais aussi depuis, les applications de productivité. Pour permettre aux utilisateurs de partager du contenu à partir de l’application, cette dernière doit être une source de partage. Pour permettre à votre application de consommer des données provenant d’autres applications, l’application doit être une cible de partage.

Partage à partir de votre application

Parce que la productivité implique souvent la création de contenu, les utilisateurs partagent généralement du contenu avec d’autres. Windows 8.1 offre une expérience transparente de partage entre les applications. À mesure que l’utilisateur acquiert de nouvelles applications, cette interopérabilité élargit la portée du contenu de votre application à une large gamme de possibilités.

Ainsi, les utilisateurs souhaiteront peut-être partager des listes de tâches et de listes de courses avec leur famille en utilisant une application de contacts, partager des documents avec des collègues à l’aide d’une application de collaboration ou partager leurs créations sur des blogs en utilisant une application de blogs, pour ne citer que quelques scénarios de partage. Ces captures d’écran illustrent diverses manières de partager du contenu dans les applications de productivité.

Le fait d’être une source de partage signifie que le contenu de votre application, qu’il soit sous la forme d’URI, d’images bitmap, de code HTML, de texte, d’éléments de stockage ou de types de données personnalisés, est mis à la disposition d’autres applications qui peuvent exploiter ces formats. En tant qu’application source, il est important de prendre en charge tous les types de données significatifs pour le contenu que vous voulez que les utilisateurs partagent. Cela permet aux utilisateurs de partager le contenu de votre application avec un large éventail d’applications cibles de partage.

En prenant en charge le contrat de partage source, vous permettez également à votre application de partager directement du contenu vers des appareils situés dans un rayon de communication en champ proche, comme le permet la technologie Approcher pour envoyer.

Partage vers votre application

Les applications de productivité constituent généralement une cible idéale pour le partage de contenu provenant d’autres applications car la création de contenu commence souvent par la consommation de contenu. Si votre application est une cible de partage, vos utilisateurs peuvent y importer du contenu de façon transparente sans avoir à changer le contexte de l’activité dans laquelle ils sont impliqués. Il existe de nombreux scénarios intéressants d’utilisation des applications de productivité en tant que cible de partage. Par exemple, le partage d’URL, d’extraits de texte, de photos du navigateur et de contenu d’un livre peut cibler une application de création de documents et servir de sources de référence pour des devoirs. Autre exemple, les utilisateurs peuvent partager les bons de réduction d’une application de bons de réduction avec la liste de courses de votre application de tâches. Les captures d’écran ci-dessous montrent des exemples d’une application utilisée comme cible de partage. Vous pouvez également imaginer une plus grande interopérabilité entre une suite d’applications de productivité qui s’appuient sur le partage des données entre elles à l’aide du contrat de partage.

Recherche

La recherche est un scénario important de vos applications de productivité et votre application aura peut-être besoin d’afficher de nombreuses données dans les résultats de recherche. Vous pouvez utiliser le contrôle de zone de recherche de Windows 8.1 pour fournir l’interface utilisateur de recherche sur le Canvas. La zone de recherche est intégrée au contrat de recherche afin d’améliorer l’expérience de recherche et de permettre une personnalisation avancée. Votre application pourra ainsi offrir aux utilisateurs des expériences de recherche au plus près de leurs besoins.

Lors de la conception de l’expérience de recherche de votre application, gardez à l’esprit les points suivants :

• Proposez des suggestions de requête pour aider les utilisateurs à compléter automatiquement leurs requêtes de recherche et accélérez la recherche en ne leur imposant pas de taper l’ensemble de la chaîne de recherche.
• Prévoyez des filtres de recherche pour l’affichage des résultats.
• Montrez la requête de recherche dans l’affichage des résultats.
• Indiquez le nombre total de résultats trouvés.
• Maintenez l’état de votre application de manière à ce que les utilisateurs aient un moyen de revenir à ce qu’ils faisaient avant leur recherche.
• Indiquez pourquoi un résultat correspond à la recherche.
• Montrez les suggestions de résultats pour aider les utilisateurs à accéder rapidement au résultat le plus approprié. La sélection d’une suggestion de résultat doit conduire à l’affichage des détails de ce résultat. Limitez le nombre de suggestions à cinq afin de faciliter l’analyse par les utilisateurs.

Pour plus d’informations sur le contrôle de zone de recherche, voir Mises à jour de la recherche.

La capture d’écran ci-dessous illustre l’utilisation de la recherche dans une application de notes.

Rechercher dans la page

Comme la recherche, la recherche dans la page est un scénario courant dans les applications de productivité. Les utilisateurs pourront ainsi par exemple trouver toutes les instances d’un mot dans un document particulier. N’utilisez pas l’icône Rechercher pour implémenter la fonctionnalité de recherche dans la page pour votre application. Implémentez-la dans la barre de commandes de votre application plutôt que dans le volet de recherche. La recherche dans la page permet à l’utilisateur de trouver toutes les instances dans l’affichage actuel. Mettez en évidence les résultats de la recherche dans le document et affichez les boutons « précédent » et « suivant » dans la barre de l’application pour que l’utilisateur puisse rapidement naviguer entre les différentes instances du mot trouvé ou d’une phrase. Dans les applications de productivité, la recherche dans la page est principalement utilisée en complément de l’expérience de recherche. La recherche dans la page porte toujours sur l’affichage actuel, comme illustré ici.

Paramètres

Tous les paramètres applicables aux applications (comme les paramètres de confidentialité, les paramètres de notification et les préférences d’affichage) doivent être regroupés dans l’icône Paramètres. L’icône Paramètres offre un lieu unique dans lequel les utilisateurs peuvent ajuster leurs paramètres et évite que l’interface utilisateur de votre application ne soit surchargée de paramètres distincts. Pour plus d’informations sur les paramètres, voir Recommandations en matière de paramètres de l’application.

Périphériques

L’impression de documents et de notes est un scénario courant dans les applications de productivité. Proposez la fonctionnalité d’impression aux utilisateurs via les icônes Périphériques pour une expérience d’impression transparente. Voici une illustration de l’expérience de périphériques pour l’impression.

Il peut être intéressant pour votre application de productivité d’utiliser le contrat de périphérique. Si votre application regroupe beaucoup de contenu multimédia et de scénarios de présentation potentiels, vos utilisateurs voudront peut-être l’afficher sur une télévision dans le cadre d’expériences multimédias partagées. Cela est possible grâce à l’intégration avec le contrat de périphérique.

Sélecteur de fichiers

Les applications de productivité peuvent mettre en œuvre des scénarios intéressants d’utilisation de contenu provenant d’autres applications. Le sélecteur de fichiers permet à votre application d’avoir accès aux fichiers et dossiers d’un utilisateur sur votre ordinateur local, aux périphériques de stockage connectés, au groupe résidentiel et à d’autres applications qui implémentent un contrat de sélecteur de fichiers. Les utilisateurs peuvent ainsi insérer dans votre application du contenu provenant d’autres applications et ainsi enrichir leur expérience. Par exemple, dans une application de notes, l’utilisateur peut vouloir insérer une photo provenant d’une application de photos ou des notes audio provenant d’une application d’enregistrement de sons.

Votre application peut également personnaliser différents aspects du sélecteur de fichiers. Plus particulièrement :

• Mode du sélecteur de fichier : vous pouvez définir le mode du sélecteur de fichier de sorte qu’il corresponde à votre tâche. La sélection de fichiers, l’enregistrement d’un fichier et la sélection d’un dossier sont également pris en charge dans le sélecteur de fichiers. Par exemple, autoriser l’utilisateur à sélectionner un dossier lui permet de sélectionner un dossier entier et de le télécharger à un emplacement de stockage sur le Cloud.
• Mode d’affichage : lorsque l’utilisateur choisit une photo ou une vidéo, vous pouvez personnaliser le sélecteur de fichiers de sorte qu’il affiche les fichiers dans le mode d’affichage miniatures. Pour tous les autres types de fichiers, utilisez le mode d’affichage mosaïque.

De la même manière, le contenu de votre application de productivité peut intéresser d’autres utilisateurs dans d’autres contextes et l’accès à ce contenu à partir d’autres applications laisse entrevoir de fantastiques scénarios pour vos utilisateurs. L’utilisation de contrats de sélecteur de fichiers offre l’opportunité de rendre disponible le contenu de votre application à d’autres applications Windows 8. Les utilisateurs peuvent ainsi accéder à leur contenu depuis votre application sans avoir à passer par un processus intermédiaire comme l’enregistrement préalable de ces fichiers sur l’ordinateur local. Lorsque les applications activent cette expérience, les utilisateurs peuvent sélectionner votre application dans la liste des emplacements dans le sélecteur de fichiers. Lorsque votre application est sélectionnée, son contenu devient accessible par les utilisateurs via un affichage du sélecteur de fichiers qui est spécifique à votre application et que vous pouvez contrôler.

La fonctionnalité de sélecteur de fichiers ouvre la voie à des scénarios intéressants. Par exemple, si un utilisateur veut envoyer une note créée dans votre application de notes par messagerie électronique à des amis, il peut joindre directement du contenu depuis l’application de notes sans avoir à l’enregistrer au préalable localement.

Le sélecteur de fichiers permet également l’enregistrement direct dans votre application. Et cela ouvre également la voie à des scénarios vraiment intéressants. Par exemple, un utilisateur peut enregistrer un message électronique ou un texte griffonné dans une autre application directement dans votre application sous forme de note. Voici un exemple de personnalisation du sélecteur de fichiers.

Connecté et dynamique

Les applications qui s’exécutent sur Windows 8.1 doivent intégrer des expériences et afficher une personnalité qui les font se démarquer. En utilisant des titres, des notifications, l’itinérance et les contrats, votre application s’adaptera aisément à l’écosystème Windows 8.1.

Vignettes et notifications

L’affichage de contenu actualisé et personnalisé sur la vignette de l’application renouvelle l’engagement des utilisateurs et maintient leur implication dans votre application lorsqu’ils notent du contenu intéressant sur votre vignette. Vous pouvez par exemple imaginer que des notifications sont affichées sur la vignette lorsque quelqu’un met à jour un document partagé, partage une nouvelle note avec l’utilisateur ou modifie la liste de courses en barrant ou ajoutant de nouveaux articles. Une notification peut également montrer la position d’un point d’intérêt, comme dans cet exemple.

Permettre aux utilisateurs d’épingler des vignettes secondaires pour un accès rapide à leurs notes et contenu favori leur permet de voir des notifications personnalisées pour ce contenu et les implique, là encore, dans votre application.

Pour les applications de productivité comprenant des scénarios de rappel avec une composante temps — par exemple un élément de liste de tâches concernant le paiement d’une facture à la fin du mois— les utilisateurs voudront peut-être associer des rappels et des dates de fin aux tâches. Envisagez l’affichage de notifications toast planifiées pour l’heure à laquelle l’utilisateur souhaite recevoir un rappel. Au cas où l’utilisateur manquerait la notification toast, il est judicieux de l’afficher également sur la vignette, comme illustré ici.

Pour plus d’informations sur les meilleures pratiques relatives aux notifications toast, voir Recommandations et liste de vérification sur les notifications toast. Pour plus d’informations sur les meilleures pratiques pour les vignettes, voir Recommandations et liste de vérification sur les vignettes.

Itinérance

La plupart des gens ont plus d’un ordinateur Microsoft Windows. Et ils attendent de l’expérience utilisateur proposée par votre application qu’elle soit homogène sur tous leurs PC Windows. Vous pouvez rendre itinérants les paramètres de votre application, les informations sur ce que l’utilisateur a fait en dernier dans votre application et toute autre préférence de votre application qui peut être utilisée sur tous les PC. Pour plus d’informations sur les meilleures pratiques pour l’itinérance, voir Recommandations en matière de données d’application itinérantes.

Taille et orientation de fenêtre

Dans la mesure où Windows 8.1 s’exécute sur différents types d’appareils et utilise un modèle multitâche, assurez-vous que votre application prend en charge les orientations paysage et portrait et fonctionne correctement quelle que soit sa taille, même dans sa largeur minimale.

Lors de la conception de votre application de productivité pour Windows 8.1, prenez en considération tous les affichages de votre application, comme les résolutions d’écran et les tailles d’appareils différentes. Windows 8.1 facilite la mise à l’échelle de votre conception en incluant plus de contenu dans votre application pour les appareils plus grands. Voici une application de prise de notes avec un affichage haut et étroit.

Les dispositions hautes et étroites et l’orientation portrait sont également parfaites pour lire et passer en revue de grandes quantités de contenus. Assurez-vous que votre application réorganise votre contenu pour s’adapter à la taille de la fenêtre.

Quand un utilisateur redimensionne votre application, le contexte et l’état ne doivent pas être perdus. Cela est particulièrement important dans les applications de productivité où les utilisateurs peuvent avoir investi de nombreux efforts pour créer du contenu. Préservez l’entrée de texte, la position de défilement et toute sélection que l’utilisateur a effectuée lorsque l’utilisateur redimensionne votre application.

Quand votre application est plus étroite, le contrôle de la barre de l’application supprime automatiquement les étiquettes et réduit l’espacement entre les commandes. Si vous utilisez de nombreuses commandes, n’hésitez pas à être créatif pour afficher ces commandes. Par exemple, utilisez deux lignes de commandes dans la barre de l’application ou utilisez des menus volants dans les commandes. Pour plus d’informations, voir Recommandations en matière de barres d’application.

De plus, réfléchissez à la manière dont votre application apporte une valeur ajoutée et enrichit ces scénarios. Montrez à un utilisateur pourquoi votre application fonctionne bien avec d’autres applications. Par exemple, il est facile d’imaginer une application de prise de notes ou de constitution de listes fonctionnant avec une autre application. Si un utilisateur fait des recherches ou rédige un document, il lui sera naturel de conserver une application de référence ou d’analyse à l’écran à côté de l’application principale. Les applications de lecture et de création de contenu sont très utiles avec des largeurs étroites, pour pouvoir y faire référence pendant que vous faites autre chose. Envisagez toutes les fois où votre application ne sera pas affichée à sa taille maximale sur le bureau traditionnel. Il s’agit des scénarios que votre application doit prendre en charge lorsqu’elle est redimensionnée à une largeur étroite.

La conception de votre application pour des largeurs étroites permet à l’application de rester à l’écran et à l’utilisateur de s’y attarder. Voici un exemple d’application de prise de notes et de navigateur côte à côte.

Rubriques associées

Découvrir les applications du Windows Store

Recommandations en matière d’expérience utilisateur pour les applications du Windows Store