Disposition

La disposition de votre application, qu’il s’agisse du contenu ou de la navigation entre les pages, est essentielle pour la conception et l’aspect de l’application. La disposition peut créer une hiérarchie, organiser votre contenu et refléter votre marque. L’expérience d’un utilisateur avec une application dépend de la structure des pages et du contenu.

Disposition dans Windows

Les dispositions Windows sont 100 % numériques. Elles utilisent les médias numériques et évitent les métaphores réalistes qui sont souvent inutiles ou équivoques dans le monde numérique. La liberté offerte par les dispositions numériques sans contraintes permet de créer des applications et des expériences à la fois puissantes et agréables à l’œil pour les utilisateurs.

Les dispositions Windows ont un aspect épuré et net, et essaient de ne pas surcharger visuellement le canvas. Vous pouvez choisir de déplacer des contrôles vers les barres de l’application sur les bords de l’application. Les principales fonctionnalités d’une application peuvent alors être mises en avant sur le canvas, ce qui rend votre application plus conviviale.

En fonction du contenu de votre application, vous souhaiterez peut-être créer une composition aérée avec des éléments interactifs de grande taille, ou une expérience plus dense qui propose beaucoup de contenu et des commandes à explorer. Par exemple, l’application Liste de lectures a une disposition minimale et ouverte. Pensez à ce qui est visible dans votre application et à ce que vous pouvez déplacer hors du canvas et également à la façon dont vos choix de disposition affectent l’expérience et l’utilisation de votre application.

L’application Xbox Music utilise une grille verticale non traditionnelle et un mouvement panoramique vertical pour afficher simultanément une large gamme de contenu. La barre de l’application persistante située en bas garantit que les contrôles fréquemment utilisés sont toujours disponibles. Ainsi, les utilisateurs peuvent se déplacer rapidement dans leurs sélections lorsqu’ils explorent d’autres zones de l’application.

Innovation dans la disposition

Songza, une application musicale qui change en fonction du scénario utilisateur, utilise une disposition horizontale minimale. Étant donné que l’utilisateur passera la majorité du temps d’utilisation de cette application à écouter et non pas à naviguer activement, une disposition épurée est préférable.

De nombreuses applications utilisent un système hiérarchique de navigation. Le Hub, ou page d’accueil, est le point d’entrée de l’utilisateur dans l’application et le point de départ vers les autres niveaux de contenu. Il affiche du contenu dans une vue panoramique détaillée qui permet aux utilisateurs d’avoir un aperçu de ce qui est nouveau et digne d’intérêt, puis d’explorer le contenu de votre application. Le contrôle Hub vous offre une infrastructure et la possibilité de personnaliser votre application pour qu’elle reflète votre marque.

La navigation hiérarchique est seulement un modèle de disposition d’application. Votre application doit tirer parti du modèle de disposition et de navigation qui correspond le mieux à votre marque et qui optimise l’expérience des utilisateurs de l’application. La composition et la disposition sont ouvertes à la créativité, et fournissent une immense opportunité pour les créateurs de rendre quelque chose unique.

Pensez aux orientations portrait et paysage pour votre application. Décidez s’il est préférable que le contenu disposé sur la grille soit vertical ou horizontal. Étant donné que de plus en plus d’applications tirent parti du langage de conception moderne de Windows, les approches de la disposition et de la conception d’applications évoluent pour correspondre aux besoins et à la marque de chaque application. La disposition vous permet d’innover et de faire sortir votre application du lot. Pour plus d’informations sur le système de grille de Windows, voir Disposition d’une page d’application.

Exemples

Facebook

Facebook utilise une disposition de type grille pour organiser tout son contenu et ses commandes sur le canvas afin que les utilisateurs soient immédiatement attirés par tous les services fournis par l’application.

Foursquare

Foursquare est une application totalement dédiée aux lieux et aux nouvelles expériences. La disposition de cette application reflète cette mission avec des images éclatantes qui montrent chaque lieu proposé. Les évaluations et les critiques sont affichées sous l’image, ce qui crée une composition unifiée permettant aux utilisateurs d’évaluer un lieu en un coup d’œil et d’appuyer dessus pour l’étudier plus en détail.

La disposition de Foursquare est dynamique et est réorganisée automatiquement pour s’adapter au mieux au contenu sur chaque zone de son application. Un mouvement panoramique vers la gauche de l’application affiche une carte des endroits à la mode à proximité. En appuyant sur un lieu, l’utilisateur affiche une page détaillée avec tous les lieux visités et commentaires des utilisateurs. S’il appuie sur l’une de ces informations, un extrait de la recommandation s’affiche.

NOOK

L’application NOOK de Barnes and Noble utilise les concepts fondamentaux d’un modèle hiérarchique basé sur le Hub, mais le modifie en profondeur pour créer une expérience unique propre à la marque NOOK. En plus des images de couverture, une légère ombre sous chaque livre donne une indication du format des livres. Dans le cas présent, une analogie avec la réalité améliore l’expérience de l’utilisateur.

Rubriques associées

Recommandations en matière de contrôle Hub

Modèles de navigation

Disposition d’une page d’application

Disposition de votre interface utilisateur (applications Windows Runtime)

Choix d’une disposition (applications du Windows Store en JavaScript et HTML)

Disposition de votre interface utilisateur (XAML)

Galerie