Minutage et accélération

Bien que le mouvement soit basé sur le monde réel, nous sommes également un média numérique, qui s’accompagne d’une attente de rapidité et de performances.

Exemples

Si vous avez installé l’application WinUI 2 Gallery , cliquez ici pour ouvrir l’application et voir L’accélération des fonctions en action. Obtenir l’application WinUI 2 (Microsoft Store) Obtenir le code source (GitHub)

Valeurs de durée d’animation standard

WinUI fournit un ensemble de durées d’animation standard qui sont utilisées dans les contrôles de plateforme. Vous pouvez également utiliser ces ressources nommées lors de la création d’animations de storyboard personnalisées.

ThemeResource Name	Valeur
ControlNormalAnimationDuration	250 ms
ControlFastAnimationDuration	167 ms
ControlFasterAnimationDuration	83 ms

Accélération dans le mouvement Fluent

L’accélération est un moyen de manipuler la vélocité d’un objet pendant son déplacement. C’est le ciment qui relie toutes les expériences de mouvement Fluent. Bien qu’extrême, l’accélération utilisée dans le système permet d’unifier la sensation physique des objets se déplaçant dans le système. C’est une façon d’imiter le monde réel et de faire en sorte que les objets en mouvement se sentent comme ils appartiennent à leur environnement.

Appliquer l’accélération au mouvement

Ces assouplissements vous aideront à obtenir une sensation plus naturelle, et constituent la base de référence que nous utilisons pour le mouvement Fluent.

Sortie rapide, entrée lente

cubic-bezier(0, 0, 0, 1)

Utilisez pour les objets ou l’interface utilisateur entrant dans la scène, en naviguant ou en frayant.

Une fois sur place, l’objet est confronté à des frictions extrêmes, ce qui ralentit le repos de l’objet. L’impression qui en résulte est que l’objet a voyagé d’une longue distance et est entré à une vitesse extrême, ou qu’il retourne rapidement à un état de repos.

Même s’il est précédé d’un moment de non-réponse, la vélocité de l’objet entrant a pour effet de se sentir rapide et réactif.

Slow Out, Fast In

cubic-bezier(1 , 0 , 1 , 1)

Utilisez pour l’interface utilisateur ou les objets qui quittent la scène.

Les objets deviennent alimentés et prennent de l’élan jusqu’à ce qu’ils atteignent la vitesse d’échappement. L’impression qui en résulte est que l’objet fait tout son possible pour sortir de la voie de l’utilisateur et faire de l’espace pour que de nouveaux contenus arrivent.

Articles connexes

• Vue d’ensemble du mouvement
• Direction et gravité