Concevoir l'interface utilisateur des modules complémentaires d'Office

  • Article

Les compléments Office prolongent les fonctionnalités d’Office en offrant des fonctions contextuelles auxquelles les utilisateurs peuvent accéder au sein de clients Office. Les compléments permettent aux utilisateurs d’en faire plus en leur permettant d’accéder à des fonctionnalités externes au sein d’Office, sans changement de contexte coûteux.

La conception de l'interface utilisateur de votre module complémentaire doit s'intégrer parfaitement à Office pour offrir une interaction efficace et naturelle à vos utilisateurs. Profitez des commandes de complément pour donner accès à votre complément et appliquez les meilleures pratiques que nous recommandons lorsque vous créez une interface utilisateur personnalisée basée sur HTML.

Principes de conception Office

Les applications Office suivent un ensemble général de directives d’interaction. Les applications partagent du contenu et ont des éléments qui se présentent et se comportent de la même façon. Cette compatibilité est basée sur un ensemble de principes de conception. Les principes aident l’équipe d’Office à créer des interfaces qui prennent en charge les tâches des clients. Découvrez-les et suivez-les pour prendre en charge les objectifs de vos clients au sein d’Office.

Suivez les principes de conception d’Office pour créer des expériences de complément positives.

  • Privilégiez une conception explicitement orientée vers Office. Les fonctionnalités, ainsi que l'aspect et la convivialité, d'un module complémentaire doivent compléter harmonieusement l'expérience d'Office. Les modules complémentaires doivent avoir l'air d'être natifs. Ils doivent s'intégrer parfaitement à Word sur un iPad ou à PowerPoint sur le web. Un module complémentaire bien conçu sera un mélange approprié de votre expérience, de la plateforme et de l'application Office. Appliquez les thèmes des documents et de l'interface utilisateur, le cas échéant. Considérez l'utilisation de Fluent UI pour le web comme votre langage de conception et votre ensemble d'outils. L’interface utilisateur Fluent pour le web a deux versions.

    • Pour les interfaces utilisateur non React : utilisez Fabric Core, une collection open source de classes CSS et de mixins Sass qui vous donnent accès aux couleurs, animations, polices, icônes et grilles. (Il est appelé «Fabric Core» au lieu de «Fluent Core» pour des raisons historiques). Pour commencer, voir Fabric Core dans Office Compléments.

    Remarque

    Bien que Fabric Core soit la bibliothèque recommandée pour concevoir des compléments non React, l’équipe travaille sur les composants web Fluent UI pour fournir une solution plus récente. Basée sur FAST, la bibliothèque composants web Fluent UI vous permet d’utiliser, de personnaliser et de générer des composants web pour créer une interface utilisateur plus moderne et basée sur des normes. Nous vous invitons à tester cette bibliothèque en suivant le guide de démarrage rapide et les commentaires bienvenus sur votre expérience via GitHub.

    • Pour les interfaces utilisateur React :utilisez Fluent UI React, un cadre frontal React conçu pour créer des expériences qui s'intègrent parfaitement dans une large gamme de produits Microsoft. Il fournit des composants robustes, à jour, accessibles et basés sur React, qui sont hautement personnalisables à l'aide de CSS-in-JS. Pour commencer, voir Fluent UI React dans Office Compléments.

  • Privilégiez le contenu plutôt que l’apparence. Permettez à la page, à la diapositive ou à la feuille de calcul du client de rester au centre de l'expérience. Un complément est une interface auxiliaire. Aucun gadget accessoire ne doit interférer avec le contenu et les fonctionnalités du complément. Personnalisez votre expérience de manière judicieuse. Nous savons qu'il est important d'offrir aux utilisateurs une expérience unique et reconnaissable, tout en évitant les distractions. Efforcez-vous de toujours privilégier le contenu et la capacité à effectuer des tâches plutôt que de chercher à attirer l’attention sur votre marque.

  • Rendez-la agréable et laissez suffisamment de contrôle aux utilisateurs. Nous aimons tous utiliser des produits qui sont à la fois attrayants visuellement et fonctionnels. Créez votre expérience avec soin. Obtenez les détails directement en tenant compte de chaque interaction et détail visuel. Permettez aux utilisateurs de contrôler leur expérience. Les étapes nécessaires pour exécuter une tâche doivent être claires et pertinentes. Les décisions importantes doivent être faciles à comprendre. Les actions doivent être facilement réversibles. Un complément n’est pas une destination : c’est une amélioration des fonctionnalités Office.

  • Prenez en compte toutes les plateformes et les méthodes d’entrée lors de la conception. Les compléments sont conçus pour fonctionner sur toutes les plateformes prenant en charge Office ; aussi l’expérience utilisateur de votre complément doit-elle être optimisée pour fonctionner avec toutes les plateformes et tous les facteurs de forme. Veillez à ce que votre complément prenne aussi bien en charge les périphériques de type souris/clavier que les appareils et assurez-vous que votre interface utilisateur HTML personnalisée puisse s’adapter à différents facteurs de forme. Pour plus d’informations, consultez notre section relative aux fonctions tactiles.

Voir aussi