Cadres de fenêtre

Remarque

Ce guide de conception a été créé pour Windows 7 et n’a pas été mis à jour pour les versions plus récentes de Windows. La plupart des conseils s’appliquent toujours en principe, mais la présentation et les exemples ne reflètent pas nos conseils de conception actuels.

La plupart des programmes doivent utiliser des cadres de fenêtre standard. Les applications immersives peuvent avoir un mode plein écran qui masque le cadre de la fenêtre. Envisagez d’utiliser le verre de manière stratégique pour une apparence plus simple, plus légère et plus cohésive.

Avec un cadre de fenêtre, les utilisateurs peuvent manipuler une fenêtre et afficher le titre et l’icône pour identifier son contenu.

Cadre de fenêtre classique.

Note: Les instructions relatives à la gestion des fenêtres et à la personnalisation sont présentées dans des articles distincts.

Concepts de conception

Cadres de fenêtre en verre

Les cadres de fenêtres en verre sont un nouvel aspect frappant de l’esthétique Microsoft Windows, visant à être à la fois attrayant et léger. Ces trames translucides donnent aux fenêtres une apparence ouverte, moins intrusive, aidant les utilisateurs à se concentrer sur le contenu et les fonctionnalités plutôt que sur l’interface qui l’entoure.

Cadres de fenêtre en verre.

Vous pouvez utiliser le verre de manière stratégique dans de petites régions dans une fenêtre qui touche le cadre de la fenêtre. Ces régions semblent faire partie du cadre de la fenêtre, même si techniquement elles font partie de la zone cliente de la fenêtre.

Dans cet exemple, le verre est utilisé dans la zone cliente pour qu’il ressemble à une partie du cadre.

Images masquées

Parfois, le meilleur cadre de fenêtre n’est pas du tout un cadre. C’est souvent le cas pour la fenêtre principale d’applications en plein écran immersif qui ne sont pas utilisées conjointement avec d’autres programmes, tels que les lecteurs multimédias, les jeux et les applications kiosque.

Les visionneuses de contenu bénéficient souvent de l’option permettant d’afficher le contenu en plein écran. Par exemple, Windows Internet Explorer, Windows Live Photo Gallery, Windows Movie Maker HD, Microsoft PowerPoint et Microsoft Word.

Dans cet exemple, le lecteur Windows Media peut afficher son contenu en plein écran.

Images personnalisées

La plupart des applications Windows doivent utiliser les cadres de fenêtre standard. Toutefois, pour les applications immersives, plein écran, autonomes comme les jeux et les applications kiosque, il peut être approprié d’utiliser des images personnalisées pour toutes les fenêtres qui ne sont pas affichées en plein écran. La motivation à utiliser des cadres personnalisés doit être de donner à l’expérience globale une sensation unique, pas seulement pour la personnalisation.

Les images personnalisées sont appropriées pour les applications autonomes, immersives, plein écran, telles que les jeux.

Lignes directrices

Cadres de fenêtre

• Utilisez des cadres de fenêtre standard.

  • Exception: Pour donner un plein écran immersif aux applications autonomes une sensation unique :

    • Envisagez de masquer le cadre de fenêtre de la fenêtre principale .

    • Envisagez d’utiliser des cadres personnalisés pour la fenêtre secondaire.

    • Si un cadre personnalisé est approprié, choisissez une conception légère et ne attire pas trop l’attention sur elle-même.

      Incorrect:

      

      Dans cet exemple, le cadre personnalisé attire trop d’attention sur lui-même.

• N’ajoutez pas de contrôles à un cadre de fenêtre. Placez les contrôles dans la fenêtre.

  Incorrect:

  

  C’est bien ça:

  

  Dans l’exemple correct, le contrôle se trouve dans la zone cliente au lieu du cadre de fenêtre.

Mode plein écran

• Pour les programmes qui ont un mode plein écran facultatif, pour activer le mode plein écran :

  • Utilisez une commande modale plein écran dans la barre de menus ou la barre d’outils. Lorsque l’utilisateur clique sur la commande, affichez la commande dans son état sélectionné.

    

    Cet exemple montre la commande plein écran, ainsi que sa touche de raccourci standard.

• Utilisez F11 pour la touche de raccourci plein écran.

• S’il existe une barre d’outils et un mode plein écran couramment utilisés, disposez également d’un bouton de barre d’outils graphique avec une info-bulle plein écran.

  

  Exemples de boutons de barre d’outils plein écran.

• Pour revenir en mode plein écran :

  • Utilisez une commande modale plein écran dans la barre de menus ou la barre d’outils. Lorsque l’utilisateur clique sur la commande, affichez la commande dans son état effacé.
  • Utilisez F11 pour la touche de raccourci plein écran. S’il n’est pas déjà attribué, échap peut également être utilisé à cet effet.

Verre

Les cadres de fenêtre standard utilisent automatiquement du verre dans Windows, mais vous pouvez également utiliser du verre dans les régions qui touchent le cadre de la fenêtre.

• Envisagez d’utiliser du verre de manière stratégique dans de petites régions touchant le cadre de fenêtre sans texte. Cela peut donner à un programme une apparence plus simple, plus légère et plus cohésive en faisant apparaître la région comme faisant partie du cadre.
• 
• Dans cet exemple, le verre concentre l’attention de l’utilisateur sur le contenu au lieu des contrôles.
• N’utilisez pas de verre dans les situations où un arrière-plan de fenêtre simple serait plus attrayant ou plus facile à utiliser.

C’est bien ça:

Dans cet exemple, le verre est utilisé pour donner à la fenêtre Alt+Tab une apparence légère. Le verre fonctionne pour cette fenêtre, car elle se compose de graphiques et d’une étiquette de texte forte unique.

Incorrect:

Dans cet exemple incorrect, l’utilisation du verre est distrait. Un arrière-plan de fenêtre simple serait un meilleur choix.