Applications Windows
Réduire la table des matières
Développer la table des matières

Bords

Application Magnétophone

 

Les bords sont un outil d’interaction puissant et élégant qui fait partie intégrante de Windows. La conception des bords est basée sur le principe En faire plus avec moins. Les bords offrent toute une gamme d’options pour en faire plus avec moins. Ils vous permettent de déplacer des éléments en dehors du Canvas s’ils ne sont pas liés directement au contenu affiché. Ils procurent aux utilisateurs des manières de naviguer fiables et intuitives qui semblent naturelles sur n’importe quel appareil.

Bords dans Windows

Barres d’application

Barres d’application dans l’application Finance

 

La barre d’application supérieure porte également le nom de barre de navigation, car c’est là que les applications placent en général les contrôles de navigation.

La barre d’application inférieure porte également le nom de barre de commandes, car c’est là que les applications placent en général les commandes.

C’est à vous qu’il revient de concevoir les barres d’application. Elles n’interagissent pas avec le système. Vous pouvez choisir de placer dans la barre d’application supérieure ou inférieure d’autres informations pertinentes au contexte au lieu (ou en plus) des commandes et contrôles de navigation. Par exemple, dans une application d’achat, vous pourriez placer le contenu du panier de l’utilisateur dans la barre d’application supérieure. Cela permet à l’utilisateur de se concentrer sur ses achats mais aussi de consulter rapidement son panier et d’accéder à la procédure de validation de sa commande. Dans une application musicale, vous pourriez placer les contrôles multimédias (tels que Lecture, Pause et Avance rapide) dans la barre d’application inférieure. Ces contrôles sont masqués jusqu’à ce que l’utilisateur sélectionne un morceau, contexte dans lequel ils deviennent alors pertinents.

 

Icônes

Application Finance et icônes

 

Les icônes représentent l’utilisation la plus emblématique des bords. Elles initient des interactions système. Un utilisateur appelle les icônes en balayant à partir du bord droit de l’écran ou en pointant avec la souris en haut ou en bas à droite. Pour plus d’informations, voir Icônes et contrats.

 

Bord gauche

liste d’applications récentes

 

Le bord gauche est le centre de commande de l’utilisateur pour afficher les applications utilisées récemment, passer d’une application à une autre et placer plusieurs applications côte à côte à l’écran.

Innovation avec les bords

Nous vous encourageons à innover et à trouver de nouveaux modes d’utilisation des bords dans la conception de votre application. Vous pouvez même choisir de ne pas ajouter de barres d’application ou de les utiliser avec parcimonie. Par exemple, l’application Xbox Music inclut la plupart des commandes sur le Canvas et place très peu de contrôles dans la barre d’application.

Les contrôles standard et le positionnement par défaut ne constituent qu’un point de départ. N’hésitez pas à faire preuve de créativité dans l’utilisation des bords de votre application.

Exemples de bords

Dans l’exemple suivant, l’application utilise la barre d’application supérieure pour afficher des vidéos associées et la barre d’application inférieure pour les commandes en rapport avec la vidéo en cours de lecture.

 

Application Vevo avec des barres d’application

 

Dans l’application NatureSpace, la barre d’application inférieure est très discrète et ne couvre pas toute la largeur de l’application. Elle offre toutefois un espace de commande correct permettant à l’utilisateur de contrôler le morceau en cours de lecture.

 

Application NatureSpace avec une barre d’application inférieure

 

Il n’est pas obligatoire que les barres d’application aient la même apparence que dans les modèles standard. Vous pouvez faire en sorte qu’elles soient joliment adaptées à votre marque. Dans cet exemple Disney, la barre d’application semble faire partie du livre.

 

Application Disney Princess Dress-Up Sticker Book avec une barre d’application inférieure

 

Rubriques associées

Modèles de navigation
Modèles de commandes

 

 

Afficher:
© 2017 Microsoft