Liste de vérification de l’expérience utilisateur pour les applications du Windows Store
Pour faciliter la certification des applications et garantir une expérience utilisateur de qualité, servez-vous de cette liste de vérification pour vérifier que votre application respecte les recommandations en matière d’expérience utilisateur.
Obligatoire
Les recommandations suivantes sont les plus prioritaires pour votre application. Vous devez respecter toutes les recommandations de cette section pour certifier votre application pour le Windows Store.
| Vérification | Description | Indications |
|---|---|---|
| [ ] | L’application doit offrir aux clients un intérêt unique et novateur. | Planification d’applications du Windows Store |
| [ ] | L’application doit être plus qu’un site Web encapsulé dans une application du Windows Store. | Planification d’applications du Windows Store |
| [ ] | Chaque application doit afficher une vignette après son installation. L’image sur la vignette d’une application doit raisonnablement être en relation avec le contenu de l’application. | Utilisation de vignettes, badges et notifications toast (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | La vignette de l’application doit utiliser un modèle de vignette standard. | Utilisation de vignettes, badges et notifications toast (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application ne doit pas utiliser sa description, ses vignettes, ses notifications, sa barre de l’application ni le mouvement de balayage depuis le bord pour afficher des publicités. | Recommandations en matière de publicité |
| [ ] | L’application doit entièrement prendre en charge les manipulations tactiles, de même qu’elle doit entièrement prendre en charge les entrées via la souris et le clavier. | Réponse à l’interaction utilisateur (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les entrées et les actions tactiles doivent être conformes au langage tactile de Windows. L’application ne doit pas utiliser d’entrées tactiles non disponibles dans le langage tactile de Windows. | Modèles tactiles |
| [ ] | L’application doit utiliser le langage tactile de Windows 8. | Réponse aux interactions de la souris (JavaScript et HTML or C#/VB/C++ et XAML) |
| [ ] | Les éléments d’interface utilisateur interactifs doivent offrir un retour visuel. Les éléments d’interface utilisateur non interactifs ne doivent offrir aucun retour visuel. | Recommandations en matière de retour visuel (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | L’application doit rester fonctionnelle lorsque le client redimensionne l’application sur une taille quelconque jusqu’à la taille minimale par défaut. | Recommandations pour le redimensionnement et Recommandations pour le redimensionnement vers des dispositions étroites |
| [ ] | En orientation Paysage, les fonctions de l’application doivent être entièrement accessibles lorsque ses dimensions d’affichage sont de 1024 x 768. | Recommandations pour l’adaptation à la taille des écrans |
| [ ] | L’application ne doit pas se fermer par programme ou offrir des moyens de la fermer via l’interface utilisateur. La gestion de la durée de vie des processus de Windows 8 ferme automatiquement les applications du Windows Store. | Recommandations pour la suspension et la reprise d’une application |
| [ ] | L’application doit être dans un état de fonctionnement raisonnable lorsque vous suspendez ou reprenez son exécution. | Recommandations pour la suspension et la reprise d’une application |
| [ ] | Si l’application implémente une barre de l’application inférieure, cette barre doit apparaître au moyen d’un mouvement de balayage de bas en haut. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Si votre application implémente une barre de navigation, cette barre doit apparaître au moyen d’un mouvement de balayage du haut vers le bas. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application doit respecter les paramètres système liés aux notifications et rester fonctionnelle lorsque ceux-ci sont désactivés. | Utilisation de vignettes, badges et notifications toast (JavaScript et HTML ou C#/VB/C++ et XAML) |
Hautement recommandé
Nous vous conseillons fortement d’adapter votre application aux recommandations énoncées dans la section qui suit. Chacune de ces recommandations contribuent à l’élaboration d’une application bien conçue.
| Vérification | Description | Indications |
|---|---|---|
| Objectifs de l’application | ||
| [ ] | L’application doit afficher des objectifs évidents en matière d’expérience utilisateur et une liste de points forts claire. | Planification d’applications du Windows Store |
| [ ] | La page principale de l’application ou la page Hub doit être plus qu’un site Web incorporé. | Planification d’applications du Windows Store Modèles de navigation |
| Disposition et alignement | ||
| [ ] | Pour organiser le contenu, l’application doit exploiter de façon cohérente l’alignement, la typographie et les espaces blancs dans l’ensemble des pages et des vues. | Disposition d’une page d’application Recommandations concernant la typographie |
| [ ] | L’application ne doit pas utiliser le chrome (lignes, zones et autres éléments d’interface utilisateur) comme moyen principal d’organisation du contenu. | Disposition d’une page d’application Étude de cas de conception : adaptation de site Web en application du Windows Store |
| [ ] | Si l’application dispose d’une page Hub, cette page ne doit pas servir avant tout de menu menant à d’autres pages de l’application. Le contenu qu’il renferme doit être utile. | Modèles de navigation |
| Grille | ||
| [ ] | Les éléments d’interface utilisateur doivent être alignés sur la grille. | Disposition d’une page d’application |
| Silhouette | ||
| [ ] | Le titre de l’application doit apparaître de manière homogène sur toutes les pages. | Disposition d’une page d’application |
| [ ] | Les marges doivent être cohérentes sur toutes les pages. | Disposition d’une page d’application |
| [ ] | Si l’application possède une disposition fluide, la marge de gauche doit être au moins de 120 pixels. | Disposition d’une page d’application |
| [ ] | La marge inférieure doit être au moins de 50 pixels. | Disposition d’une page d’application |
| Panoramique et défilement | ||
| [ ] | Dans une page Hub ou principale à défilement panoramique horizontal, une liste de défilement vertical doit utiliser des points d’ancrage. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Dans une page Hub ou principale à défilement panoramique vertical, une liste de défilement horizontal doit utiliser des points d’ancrage. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Une page ne doit pas prendre en charge simultanément un défilement panoramique vertical et horizontal, sauf si le contenu nécessite un défilement panoramique libre. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Si le défilement est possible dans une page, celle-ci doit fournir des indicateurs de défilement panoramique. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Une page avec défilement panoramique horizontal ne doit pas contenir plusieurs listes de défilement panoramique vertical. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Une page avec défilement panoramique vertical ne doit pas contenir plusieurs listes de défilement panoramique horizontal. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| Typographie | ||
| [ ] | L’application doit utiliser un ensemble fixe de tailles et d’épaisseurs de types différents (gamme de types). | Recommandations concernant la typographie Recommandations concernant les polices |
| [ ] | Les polices et la hiérarchie des polices doivent être homogènes dans toutes les pages. | Recommandations concernant la typographie Recommandations concernant les polices |
| [ ] | La casse et la mise en majuscules doivent être cohérentes. | Recommandations concernant la typographie |
| [ ] | L’application ne doit contenir aucune faute d’orthographe. | Recommandations concernant la typographie |
| [ ] | L’application ne doit contenir aucun texte tronqué. | Recommandations concernant la typographie |
| Contenu Web hébergé | ||
| [ ] | L’application ne doit renfermer aucun contenu Web hébergé dans un <iframe> dans la page Hub. | Démarrage rapide : utilisation de la navigation sur une seule page |
| Si l’application est dotée d’un contenu Web hébergé dans un <iframe>, elle doit procurer un moyen de revenir à l’application. | Démarrage rapide : utilisation de la navigation sur une seule page | |
| [ ] | Les pages Web qui ne correspondent pas à un contenu d’application direct doivent être ouvertes dans un navigateur externe. | Recommandations et liste de vérification sur les liens |
| [ ] | Le contenu Web hébergé doit être aligné sur la silhouette de l’application. | Disposition d’une page d’application |
| Personnalisation | ||
| [ ] | L’application doit être dotée d’une image d’écran de démarrage (620 x 320 pixels). | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | L’écran de démarrage ne doit pas inclure de publicités. | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | L’écran de démarrage ne doit pas contenir d’informations cruciales, notamment des informations sur l’application ou sur l’aide. | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | La transition entre l’écran de démarrage et la première vue ne doit dévoiler aucun écran noir. | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | Aucun logo ne doit empêcher le placement ou l’alignement en bonne et due forme du titre de la page et ne doit perturber un autre contenu. | Personnalisation |
| [ ] | L’application ne doit pas faire référence à des plateformes non Windows dans des éléments de personnalisation ou d’autres éléments de l’application. | Personnalisation |
| [ ] | Les images en arrière-plan ne doivent pas nuire au contenu d’analyse et de lecture ni même le perturber. | Personnalisation |
| Barres d’application | ||
| [ ] | La barre de l’application inférieure ne doit inclure aucune navigation, seulement des commandes. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | La barre de navigation ne doit inclure aucune commande, seulement la navigation. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les barres d’application ne doivent pas dupliquer les actions dans les icônes. La seule exception est l’impression qui peut figurer dans la barre de l’application inférieure. | |
| [ ] | Les barres d’application doivent se fermer lorsque l’utilisateur appuie sur la page ou effectue un balayage en partant du bas ou du haut de l’écran. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Quand un utilisateur effectue un balayage pour sélectionner un élément, la barre de l’application doit s’ouvrir pour afficher les actions disponibles pour l’élément sélectionné. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application ne doit pas montrer simultanément plus d’une barre de l’application inférieure. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les commandes contextuelles doivent être placées sur le côté gauche de la barre de l’application inférieure (ou le côté droit pour les langues écrites/lues de droite à gauche). | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Le texte des boutons de la barre de l’application doit apparaître justifié au centre. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les commandes ne doivent pas être dupliquées dans les barres d’application. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les commandes qui sont partagées entre plusieurs pages doivent être placées aussi proches que possible du même emplacement dans la barre de l’application. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application ne doit pas utiliser un glyphe existant pour un nouvel usage. Si aucune icône n’existe pour l’action ou la commande, créez-en une. | WinJS.UI.AppBarIcon Images des styles de bouton AppBar |
| Menus volants | ||
| [ ] | Quand un utilisateur modifie un élément dans un menu volant, le contenu doit instantanément être mis à jour afin de refléter les modifications apportées. | Recommandations et liste de vérification sur les menus volants |
| [ ] | L’application ne doit pas utiliser de boîtes de dialogue modales pour l’interface utilisateur d’information ou contextuelle. Utilisez des menus volants pour l’information et des menus contextuels pour l’interface utilisateur contextuelle. | Disposition de votre interface utilisateur (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Un menu volant doit se fermer lorsque l’utilisateur appuie sur la page ou doit être pourvu d’une commande de fermeture ou d’annulation. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Un menu volant doit être placé près du bouton correspondant dans la barre de l’application. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Un menu volant ne doit pas masquer la commande qui l’a ouvert. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Les menus volants ne doivent pas contenir d’ombres ou d’autres éléments créant un effet en relief ou 3D. Les effets visuels dans Windows sont plats et non en relief. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Si un menu volant inclut la navigation, il doit être muni d’un bouton Précédent. Par exemple, le volet Paramètres permet à l’utilisateur d’accéder à des menus volants Paramètres, tels que À propos de et Commentaires. Ces menus volants Paramètres comprennent un bouton Précédent qui permet de revenir au volet Paramètres. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Un menu volant positionné le long du périphérique ne doit pas gêner les mouvements de balayage à partir du bord. | Recommandations et liste de vérification sur les menus volants |
| Menus contextuels | ||
| [ ] | Les objets que vous pouvez sélectionner directement ne doivent pas être pourvus d’un menu contextuel. | Recommandations et liste de vérification sur les menus contextuels |
| [ ] | Les commandes ne doivent pas être dupliquées dans la barre de l’application et dans les menus contextuels. | Recommandations et liste de vérification sur les menus contextuels |
| Boîtes de message | ||
| [ ] | Les messages d’erreur ne doivent contenir ni traces de pile ni informations de débogage. | Recommandations et liste de vérification sur les boîtes de message |
| [ ] | Les messages d’erreur ou les questions de confirmation qui s’affichent dans les boîtes de dialogue doivent être appliqués à l’ensemble de l’application. | Recommandations et liste de vérification sur les boîtes de message Disposition de votre interface utilisateur (JavaScript et HTML ou C#/VB/C++ et XAML) |
| Tri et filtrage | ||
| [ ] | Les filtres ouverts depuis la barre de l’application doivent utiliser un menu volant. | Modèles de navigation |
| [ ] | Des menus volants de tri et de filtrage doivent être placés près du bouton correspondant dans la barre de l’application. | Modèles de navigation Recommandations et liste de vérification sur les menus volants |
| [ ] | Les menus volants de tri et de filtrage doivent se fermer quand l’utilisateur appuie sur la page. | Recommandations et liste de vérification sur les menus volants |
| [ ] | Les options de tri et de filtrage doivent être placées dans une liste déroulante si les interfaces utilisateur de tri et de filtrage se trouvent sur la zone de dessin et si l’application se base sur plusieurs critères pour trier et filtrer. | Modèles de navigation Recommandations et liste de vérification sur les menus volants |
| [ ] | L’application ne doit pas recourir au tri ou au filtrage pour la navigation (par exemple, pour imiter les onglets). Utilisez plutôt le tri et le filtrage pour permettre aux utilisateurs d’améliorer en un clin d’œil l’affichage des données. | Modèles de navigation |
| Contrôles | ||
| [ ] | L’application doit autoriser une manipulation directe plutôt que de recourir à des modes de modification et de réorganisation distincts. | Conception des commandes Étude de cas de conception : iPad vers application du Windows Store |
| [ ] | L’application ne doit pas contenir des actions ou gestes personnalisés pour sélectionner les éléments à modifier ou réorganiser. | Recommandations en matière de glissement croisé |
| [ ] | La coche associée à un élément doit servir uniquement à indiquer que l’élément est sélectionné. | Recommandations en matière de glissement croisé |
| [ ] | Si l’utilisateur peut sélectionner un élément, une ou plusieurs commandes doivent être associées à l’élément choisi. | Recommandations en matière de glissement croisé Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les commandes nécessaires à l’utilisateur pour progresser doivent être placées dans la zone de dessin. | Disposition de votre interface utilisateur (JavaScript et HTML ou C#/VB/C++ et XAML) |
| Navigation | ||
| [ ] | L’application ne doit pas être dotée de contrôles de navigation dans la zone de dessin ou la zone de page, ni même dans la barre de l’application inférieure. Les contrôles de navigation doivent se trouver dans la barre de navigation.
Remarque Le bouton Précédent est une exception et peut apparaître dans la zone de dessin. |
Modèles de navigation |
| [ ] | Pour la navigation, l’application ne doit pas utiliser d’onglets dans la zone de dessin. | Étude de cas de conception : adaptation de site Web en application du Windows Store |
| [ ] | Les en-têtes de section et de détail doivent ouvrir la page de section ou de détail correspondante. | Modèles de navigation |
| [ ] | Les en-têtes de section doivent avoir une interface utilisateur visible et interactive pour afficher davantage de contenu. Par exemple, un indice entre chevrons ou le texte, "Afficher tous les <x>". | Modèles de navigation |
| [ ] | Le bouton Précédent doit apparaître dans le coin supérieur gauche de la page ou dans la partie gauche de la barre de navigation. Pour les langues de droite à gauche, placez le bouton Précédent dans le coin supérieur droit de la page ou dans la partie droite de la barre de navigation. | Modèles de navigation |
| [ ] | Le bouton Précédent ne doit pas être désactivé dans la page ou dans la barre de navigation. | Modèles de navigation |
| Zoom sémantique | ||
| [ ] | Le zoom sémantique ne doit pas être utilisé pour accéder à une page différente dans l’application. Il sert à accéder à un emplacement différent dans la même page. | Recommandations en matière de zoom sémantique (JavaScript et HTMLou C#/VB/C++ et XAML) Recommandations et liste de vérification sur les contrôles SemanticZoom (C#/VB/C++ and XAML) |
| [ ] | Si la vue actuelle contient plus de huit pages de contenu, vous devez utiliser le zoom sémantique. | Recommandations en matière de zoom sémantique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| Entrées tactiles | ||
| [ ] | Les éléments d’interface utilisateur, les contrôles et d’autres parties de l’application ne doivent pas gêner les mouvements à partir du bord dans Windows ou l’interface utilisateur associée à ces mouvements. | Recommandations en matière d’interactions utilisateur courantes (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Si un élément n’a aucun état sélectionné, il ne doit pas appliquer le mouvement de sélection par balayage. | Recommandations en matière de glissement croisé |
| [ ] | Un élément d’interface utilisateur ne doit pas avoir plus d’une commande associée. L’usage de plusieurs commandes dans un élément d’interface utilisateur unique est source d’ambiguïté pour les mouvements tactiles. | Recommandations en matière d’interactions utilisateur courantes |
| [ ] | Les mouvements tactiles ne doivent pas se chevaucher. L’application ne doit pas avoir un contrôle de défilement sur carte, un bouton bascule ou un autre type de contrôle dans une visionneuse à défilement qui gêne le défilement panoramique ou le défilement simple. | Recommandations en matière d’interactions utilisateur courantes |
| Cibles tactiles | ||
| [ ] | Les interactions tactiles doivent générer des commentaires en retour pour les utilisateurs. | Modèles tactiles |
| [ ] | Si un élément n’est pas interactif, il ne doit fournir aucun retour visuel à l’utilisateur. | Modèles tactiles |
| [ ] | L’application ne doit pas valider une interaction au moindre geste d’appui. Les interactions doivent être réversibles. | Modèles tactiles |
| [ ] | Si l’utilisateur déplace un élément en le faisant glisser, l’action tactile doit être annulée. | Modèles tactiles |
| [ ] | Les cibles tactiles doivent être de 5 mm ou plus. | Recommandations en matière de ciblage (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | L’application doit avoir au moins 2 sous-unités (10 pixels) entre chaque cible tactile. | Recommandations en matière de ciblage |
| Saisie de texte | ||
| [ ] | L’application doit utiliser le clavier logiciel Windows ou un éditeur de méthode d’entrée (IME). Il ne doit pas utiliser un clavier logiciel personnalisé. | Recommandations et liste de vérification sur le développement IME Recommandations relatives au clavier tactile et au volet d’écriture manuscrite |
| [ ] | Le clavier logiciel ne doit pas couvrir les contrôles requis pour mener à bien le processus de saisie de texte. Par exemple, le clavier logiciel employé pour la zone de texte d’un nom d’utilisateur ou d’un mot de passe ne doit pas masquer le bouton de connexion. | Recommandations relatives au clavier tactile et au volet d’écriture manuscrite |
| Animations | ||
| [ ] | L’application doit implémenter des animations lorsque cela est nécessaire. | Animation de votre interface utilisateur (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les animations personnalisées ne doivent pas amoindrir les performances ou avoir un impact négatif sur l’expérience utilisateur. | Animation |
| [ ] | Les performances des animations et les transitions ne doivent pas être d’une qualité médiocre. Par exemple, l’utilisateur ne doit pas remarquer que les vignettes ont été redessinées. | Animation Rendre les animations fluides |
| Tailles d’écran et orientations | ||
| [ ] | Les applications dotées d’une disposition fluide doivent être réorganisées pour des écrans de plus grande taille. | Recommandations en matière de dispositions Recommandations pour l’adaptation à la taille des écrans |
| [ ] | Les applications ne doivent pas faire apparaître des artefacts visuels ou une dégradation de la qualité des images sur des écrans volumineux ou à haute densité de pixels. | Recommandations pour l’adaptation à la taille des écrans Recommandations pour la mise à l’échelle d’après la densité de pixels |
| [ ] | Les applications doivent prendre en charge l’orientation portrait des périphériques et des moniteurs. Les applications doivent prendre en charge un redimensionnement où l’application est plus grande que large. | Recommandations pour le redimensionnement |
| [ ] | L’application doit maintenir le contexte et l’état lorsque l’utilisateur redimensionne l’application. | Recommandations pour le redimensionnement |
| [ ] | L’application doit être entièrement fonctionnelle, y compris avec la taille minimale par défaut. Si l’application prend en charge une taille minimale inférieure à la taille par défaut, elle doit conserver autant de fonctionnalités qu’il lui est possible d’en avoir dans le cadre de la taille minimale. | Recommandations pour le redimensionnement Recommandations pour le redimensionnement vers des dispositions étroites |
| [ ] | La disposition de l’application et l’ensemble des contrôles doivent évoluer comme il se doit lorsque l’utilisateur redimensionne l’application. L’interface utilisateur et les contrôles doivent être exploitables quelle que soit la taille de la fenêtre. | Recommandations pour le redimensionnement |
| [ ] | Si l’application prend en charge des largeurs entre 320 et 499 pixels, elle doit passer à un affichage vertical étroit adapté à des largeurs plus étroites. Passez au défilement panoramique vertical et utilisez des marges, un en-tête, un bouton Précédent et des décalages d’animation/transition plus petits. | Recommandations pour le redimensionnement vers des dispositions étroites |
| [ ] | L’application ne doit pas changer la taille par programme. L’utilisateur peut à tout moment redimensionner l’application. | Recommandations pour le redimensionnement vers des dispositions étroites |
| [ ] | L’application ne doit pas passer à une autre partie lorsque la taille de la fenêtre change. | Recommandations pour le redimensionnement vers des dispositions étroites |
| Contrats et icônes | ||
| [ ] | L’application ne doit pas dupliquer les icônes Paramètres, Partager ou Périphériques dans sa zone de dessin ou dans la barre de l’application. | Modèles de commandes |
| [ ] | L’application doit prendre en charge l’utilisation des icônes quelles que soient la taille, l’orientation ou la position sur l’écran. Les icônes s’appliquent à la dernière application employée par l’utilisateur. | Recommandations pour le redimensionnement vers des dispositions étroites |
| Contrat et icône de recherche | ||
| [ ] | L’application ne doit pas utiliser le contrat de recherche pour la recherche dans la page. Placez les contrôles de recherche dans la page dans la barre de l’application. | Recommandations et liste de vérification sur la recherche dans la page (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Si l’application est pourvue d’un contrôle de recherche dans sa zone de dessin, elle doit ouvrir le contrat de recherche. | Recommandations et liste de vérification sur la recherche |
| Contrat et icône de partage | ||
| [ ] | Le partage doit être mis en place par le biais de l’icône Partager. | Recommandations pour le partage de contenu |
| [ ] | L’application doit afficher le message correct si elle met en place l’icône Partager mais qu’aucun contenu partageable n’est disponible dans le contexte actuel. | Recommandations pour le partage de contenu |
| Contrat et icône Paramètres | ||
| [ ] | Les paramètres de l’application, y compris la configuration, les options et la gestion des comptes, doivent être mis en place au moyen de l’icône Paramètres et pas dans les pages ou les menus volants personnalisés de l’application. | Recommandations pour les paramètres d’application |
| [ ] | Les pages À propos de, Déclaration de confidentialité, Conditions d’utilisation, Aide et Commentaires doivent être mises en place via l’icône Paramètres. | Recommandations pour les paramètres d’application |
| [ ] | L’application doit utiliser les contrôles de manière cohérente dans le volet Paramètres. | Recommandations pour les paramètres d’application |
| [ ] | Le volet Paramètres doit se fermer lorsque l’utilisateur appuie sur l’application. | Recommandations pour les paramètres d’application |
| [ ] | Le volet Paramètres doit être doté d’un bouton Précédent. | Recommandations pour les paramètres d’application |
| [ ] | Le menu volant Paramètres doit respecter la largeur actuelle de l’application. | Recommandations pour le redimensionnement vers des dispositions étroites |
| Sélecteur de fichiers | ||
| [ ] | L’application doit se servir du sélecteur de fichiers pour ouvrir et enregistrer des fichiers ou bien y accéder. | Recommandations pour les sélecteurs de fichiers Recommandations et liste de vérification sur les contrats de sélecteurs de fichiers |
| [ ] | L’application ne doit pas utiliser le sélecteur de fichiers pour explorer ou exploiter du contenu. | Recommandations pour les sélecteurs de fichiers |
| Vignettes | ||
| [ ] | Si l’application utilise une vignette large, elle doit bénéficier d’un contenu en direct pour cette vignette. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | Les couleurs, polices et icônes de la vignette de l’application doivent être cohérentes avec celles de l’application. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | L’icône ou le logo de l’application dans la vignette doivent être de haute qualité et ne pas dévoiler des artefacts visuels. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | L’orthographe du texte de la vignette doit être correcte. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | Une vignette secondaire ne doit pas être liée à un contenu statique. | Recommandations et liste de vérification sur les vignettes secondaires |
| [ ] | Une vignette secondaire ne doit pas être un bouton de commande qui permet à l’utilisateur d’interagir avec l’application. | Recommandations et liste de vérification sur les vignettes secondaires |
| [ ] | Une vignette secondaire doit mener directement au contenu associé. Elle ne doit pas ouvrir la page d’accueil de l’application. | Recommandations et liste de vérification sur les vignettes secondaires |
| [ ] | L’application ne doit pas utiliser de vignettes secondaires pour afficher des publicités. | Recommandations et liste de vérification sur les vignettes secondaires |
| Notifications toast | ||
| [ ] | L’application ne doit pas utiliser de notifications toast pour des messages d’erreur. | Recommandations et liste de vérification pour les notifications toast |
| [ ] | Les notifications toast doivent être interactives et permettre d’accéder à l’application quand l’utilisateur appuie dessus. | Recommandations et liste de vérification pour les notifications toast |
| [ ] | L’application ne doit pas utiliser de notifications toast pour des publicités. | Recommandations et liste de vérification pour les notifications toast |
| [ ] | L’application ne doit pas utiliser de notifications toast pour des modifications mineures. | Recommandations et liste de vérification pour les notifications toast |
| Itinérance | ||
| [ ] | L’itinérance des données doit être cohérente et précise. Par exemple, si les données ne doivent pas être itinérantes pour un périphérique, elles ne doivent pas l’être pour un autre. | Recommandations en matière de données d’application itinérantes |
| Gestion des comptes | ||
| [ ] | Des fonctionnalités de gestion des comptes doivent être mises en place à partir de l’icône Paramètres. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’utilisateur doit être en mesure de se déconnecter de l’icône Paramètres. | Recommandations et liste de vérification sur les contrôles d’ouverture de session |
| [ ] | Un point d’entrée pour la connexion à partir de l’application doit ouvrir l’icône Paramètres. (Exception : authentification Web) | Recommandations et liste de vérification sur les contrôles d’ouverture de session |
| [ ] | Si l’application n’exige aucune authentification, elle ne doit pas afficher de contrôles d’ouverture de session. | Recommandations et liste de vérification sur les contrôles d’ouverture de session |
| [ ] | Une boîte de dialogue d’authentification standard doit être utilisée le cas échéant. | Service Broker d’authentification Web |
Recommandé
Les recommandations énoncées dans la section qui suit améliorent l’expérience utilisateur de l’application.
| Vérification | Description | Indications |
|---|---|---|
| Disposition et alignement | ||
| [ ] | Le contenu doit être aligné à gauche (aligné à droite pour les langues écrites/lues de droite à gauche) sur toutes les pages d’application, dans toutes les vues. | Recommandations concernant la typographie |
| [ ] | La page Hub ou principale de l’application doit inclure des différences visuelles. | Modèles de navigation |
| Silhouette | ||
| [ ] | Les colonnes doivent être au moins de 560 pixels (28 unités). | Disposition d’une page d’application |
| [ ] | Si l’application utilise la silhouette standard, elle doit respecter les consignes suivantes :
|
Disposition d’une page d’application |
| Panoramique et défilement | ||
| [ ] | Dans une page à défilement panoramique horizontal, le défilement du contenu doit se faire en direction du bord gauche. Le défilement du contenu ne doit pas s’arrêter dans la marge de gauche. | Recommandations en matière de défilement panoramique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Toutes les zones d’une page doivent répondre au défilement panoramique et au défilement simple. | Recommandations en matière de défilement panoramique |
| Typographie | ||
| [ ] | La gamme de types de l’application ne doit pas contenir plus de cinq tailles. | Recommandations concernant la typographie |
| [ ] | L’application doit utiliser des majuscules en début de phrase. | Recommandations concernant la typographie |
| Personnalisation | ||
| [ ] | Si l’application est munie d’un écran de démarrage étendu, celui-ci doit être similaire à l’écran de démarrage de départ. | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | L’application doit inclure des écrans de démarrage pour prendre en charge la mise à l’échelle à 140 % (868 x 420 pixels) et à 180 % (1116 x 540 pixels). | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | Si l’écran de démarrage est visible pendant plus de 7 secondes, il doit inclure un signal visuel indiquant à l’utilisateur qu’il doit attendre le chargement de l’application. | Recommandations et liste de vérification sur les écrans de démarrage |
| [ ] | La page Hub de l’application doit être dotée d’un logo. | Personnalisation |
| Barres d’application | ||
| [ ] | La barre de l’application ne doit pas contenir de commandes Précédent et Suivant. Elle doit inclure à la place un contrôle de rotation dans la zone de dessin. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) Ajout de contrôles FlipView (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application ne doit pas être munie d’une barre de l’application vide. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | Les barres d’application ne doivent pas dupliquer des actions contenues dans les icônes. | Modèles de commandes |
| Menus contextuels | ||
| [ ] | Les menus contextuels doivent être placés près de l’objet cible. | Recommandations et liste de vérification sur les menus contextuels |
| Tri et filtrage | ||
| [ ] | Les commandes de tri et de filtrage indispensables au scénario d’application doivent être insérées dans la zone de dessin. Les commandes de tri et de filtrage sans importance peuvent être placées dans la barre de l’application. | Modèles de navigation |
| [ ] | L’application ne doit pas posséder plus d’un bouton de tri et d’un bouton de filtre par barre de l’application. | Recommandations et liste de vérification sur les barres d’application (JavaScript et HTML ou C#/VB/C++ et XAML) |
| Navigation | ||
| [ ] | Si l’application possède plus de quatre niveaux hiérarchiques, elle doit utiliser une liste déroulante d’en-têtes ou bien la barre de navigation pour accéder à différentes sections. | Modèles de navigation |
| [ ] | Vous devez implémenter le bouton Précédent en tant que pile Back afin qu’il se comporte comme un bouton d’historique de navigation. | Modèles de navigation |
| [ ] | Le bouton Précédent ne doit pas apparaître dans une vidéo en plein écran. Il doit disparaître en fondu ou être placé dans la barre de navigation. | Performances audio et vidéo Optimiser les ressources multimédias |
| Zoom sémantique | ||
| [ ] | Si la vue actuelle contient plus de cinq pages de contenu, vous devez utiliser le zoom sémantique. | Recommandations en matière de zoom sémantique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Le zoom sémantique doit inclure des informations pertinentes supplémentaires. | Recommandations en matière de zoom sémantique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Lorsque l’utilisateur effectue un zoom arrière, l’application doit avoir une marge standard à gauche. | Recommandations en matière de zoom sémantique (JavaScript et HTMLou C#/VB/C++ et XAML) |
| Action tactile | ||
| [ ] | Les cibles tactiles des actions où la précision est primordiale, notamment les actions Supprimer et Fermer, doivent être de 9 mm ou plus. | Modèles tactiles |
| [ ] | Toutes les cibles tactiles doivent être de 7 mm ou plus. | Modèles tactiles |
| Clavier et souris | ||
| [ ] | L’application doit prendre en charge la navigation et la sélection via un clavier. | Recommandations en matière d’interactions utilisateur courantes (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Les conteneurs de contenu disponibles dans l’application, tels que les listes et les grilles, doivent prendre en charge le défilement à l’aide de la roulette de la souris. | Interactions de la souris (JavaScript et HTML ou C#/VB/C++ et XAML) |
| [ ] | L’application doit prendre en charge le retour par pointage de souris. | Interactions de la souris (JavaScript et HTML ou C#/VB/C++ et XAML) |
| Animations | ||
| [ ] | Les animations ne doivent pas gêner le déroulement naturel des opérations dans l’application. | Utilisation d’animations dans votre application (JavaScript et HTMLou C#/VB/C++ et XAML) |
| [ ] | Les animations ne doivent pas distraire l’utilisateur. | Utilisation d’animations dans votre application (JavaScript et HTMLou C#/VB/C++ et XAML) |
| Tailles d’écran et orientations | ||
| [ ] | Les applications dotées d’une disposition fixe doivent être centrées sur toutes les tailles d’écran et densités de pixels. | Recommandations pour l’adaptation à la taille des écrans |
| [ ] | Les transitions entre les orientations doivent être fluides. Elles ne doivent pas afficher les opérations de redessin. | Recommandations pour le redimensionnement |
| [ ] | Les transitions doivent être fluides lors du redimensionnement. Elles ne doivent pas afficher les opérations de redessin. | Recommandations pour le redimensionnement |
| Contrat et icône de recherche | ||
| [ ] | Si une application a un contenu dans lequel il est possible d’effectuer des recherches, elle doit mettre en place le contrat de recherche. | Recommandations et liste de vérification sur la recherche |
| [ ] | Si aucun résultat de recherche n’est renvoyé, l’application doit émettre un message significatif à l’utilisateur. | Recommandations et liste de vérification sur la recherche |
| [ ] | L’application doit afficher les critères de recherche avec les résultats de la recherche. | Recommandations et liste de vérification sur la recherche |
| [ ] | Si l’application met en place le contrat de recherche, elle doit activer la fonctionnalité de recherche par saisie. | Recommandations et liste de vérification sur la recherche |
| Contrat et icône de partage | ||
| [ ] | Une application avec du contenu partageable doit mettre en place le contrat de partage source. | Recommandations pour le partage de contenu |
| [ ] | Une application qui autorise la publication, le stockage ou la création de contenu doit mettre en place le contrat de partage cible. | Recommandations pour le partage de contenu |
| Contrat et icône Paramètres | ||
| [ ] | Les modifications qu’apporte l’utilisateur dans le volet Paramètres doivent être immédiatement validées. | Recommandations pour les paramètres d’application |
| [ ] | Tout contrôle désactivé dans le volet Paramètres doit être accompagné d’un message descriptif expliquant les raisons de sa désactivation. | Recommandations pour les paramètres d’application |
| [ ] | Le menu volant Paramètres doit être soit étroit (346 pixels) soit large (646 pixels). | Recommandations pour les paramètres d’application |
| Sélecteur de fichiers | ||
| [ ] | Si l’application fournit un emplacement sûr, elle doit mettre en place le contrat de sélecteur d’ouverture de fichier. | Recommandations et liste de vérification sur les contrats de sélecteurs de fichiers |
| Vignettes | ||
| [ ] | Si une application a un contenu dynamique, elle doit mettre en place une vignette dynamique. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | La vignette ne doit pas dupliquer le nom ou le logo. | Recommandations et liste de vérification sur les vignettes et les badges |
| [ ] | Les vignettes secondaires larges doivent avoir du contenu en direct. | Recommandations et liste de vérification sur les vignettes secondaires |
| Notifications toast | ||
| [ ] | Lorsque l’application est visible à l’écran, les notifications toast ne doivent pas être affichées. | Recommandations et liste de vérification pour les notifications toast |
| [ ] | Les notifications toast n’ont pas besoin d’une icône 'x' pour fermer la notification. | Recommandations et liste de vérification pour les notifications toast |
| Itinérance | ||
| [ ] | L’application doit permettre un accès itinérant aux données appropriées, notamment les paramètres et les préférences de l’application, son historique, les favoris et les listes définies par l’utilisateur. | Recommandations en matière de données d’application itinérantes |
Rubriques associées
Cas de test de l’expérience utilisateur procurée par les applications du Windows Store