Comment savoir si une animation est mauvaise pour votre UX ?

Comment savoir si une animation est mauvaise pour votre UX ?

Aujourd’hui, il est difficile d’imaginer une interface sans animation. Pour impressionner voire surprendre vos utilisateurs, l’animation est un excellent moyen. Il montre l’interaction entre les écrans, explique comment utiliser l’application, retient l’attention de l’utilisateur, etc. Mais comment savoir si c’est mauvais ou pas ? Découvrons cela.

 

animation ux

 

Principes de conception d’animations

 

Des études d’autorité ont montré que la vitesse optimale d’animation de l’interface est de 200 à 500 ms. Ces chiffres sont basés sur les qualités spécifiques du cerveau humain. Toute animation inférieure à 100 ms sera à peine perçue. Si l’animation dure plus d’une seconde, elle donnera l’impression d’un retard et sera donc fastidieuse pour l’utilisateur. Donc, si vous voulez réussir avec le meilleur motion design pour votre produit, vous feriez mieux de faire attention et de respecter les critères d’animation de qualité supérieure. Voici quelques principes à garder à l’esprit lors du processus de conception de l’animation.

 

Durée & vitesse de l’animation

Lorsque les éléments changent de condition ou de position, la durée de l’animation doit être suffisamment lente pour permettre aux utilisateurs de remarquer le changement. Mais, en même temps suffisamment rapide pour ne pas provoquer d’attente. Alors, définissez la durée correcte de l’animation. Ne le faites pas trop vite et ne laissez pas beaucoup de temps à l’utilisateur pour l’ennui.

 

 

Ainsi, des appareils mobiles sont également proposés pour limiter la durée de l’animation jusqu’à 200-300 ms. En ce qui concerne les tablettes, le temps devrait être 30 % plus long, soit environ 400 à 450 ms. La raison est simple : la taille de l’écran est plus grande, donc les objets franchissent une longue distance lorsqu’ils changent de position. Sur d’autres gadgets, la durée devrait être 30 % plus courte, soit environ 150-200 ms, car, sur un écran plus petit, la distance est plus courte.

 

Flou de mouvement

Attention à l’effet. Le fait est que des éléments tels que les éléments de liste (cartes de nouvelles, listes de diffusion, etc.) devraient avoir une latence d’affichage très faible. Chaque nouvelle apparition d’élément doit durer entre 20 et 25 ms. Une apparition plus lente des éléments peut gêner l’utilisateur.

 

Anticipation

L’adoucissement aide à déplacer l’objet de manière plus naturelle et organique. Donc, si vous ne voulez pas que votre animation ait l’air mécanique et artificielle, l’objet doit procéder avec une certaine accélération ou décélération, comme tous les objets vivants dans le monde physique.

 

Chorégraphie dans les interfaces d’animation

Comme dans la chorégraphie de ballet, l’idée principale est de diriger l’attention de l’utilisateur sur le changement lors du passage d’un état à un autre. Ainsi, pour une bonne animation, l’attention de l’utilisateur doit être dirigée dans une direction à la fois, sauf pour les vues du tableau. Ici, c’est un peu plus compliqué, et l’attention de l’utilisateur doit être diagonale – montrer les éléments les uns après les autres est une mauvaise idée.

 

Mouvement linéaire

Les objets qui ne sont soumis à aucune force physique se déplacent linéairement, c’est-à-dire à vitesse constante. Et ce n’est qu’à cause de cela qu’ils peuvent sembler très peu naturels et artificiels à l’œil humain.

C’est pourquoi il est préférable d’utiliser un mouvement linéaire, par exemple, uniquement lorsque l’objet change de couleur ou de transparence. En règle générale, nous pouvons l’utiliser dans les cas où l’objet ne change pas de position.

 

Dans le cas où vous avez besoin d’une aide approfondie pour tout autre effet d’animation, style ou principe de conception UX pour vos projets de conception, n’hésitez pas à nous contacter pour une consultation détaillée en un rien de temps.

 

Conclusion

Tous les principes ci-dessus sont les moindres mais pas les derniers pour dire si votre animation est mauvaise ou non. Généralement, une bonne animation dans l’interface doit refléter les mouvements que nous connaissons du monde physique – frottement, accélération, etc. En imitant le comportement des objets du monde réel, nous pouvons créer une séquence qui permettra aux utilisateurs de comprendre à quoi s’attendre depuis l’interface. Il dira si c’est génial parce que lorsque l’animation est construite correctement, elle est discrète et ne détourne pas les utilisateurs de la réalisation de leurs objectifs. Cela signifie également que l’animation ne doit pas ralentir le travail de l’utilisateur ou empêcher la tâche.

Chez Wapiyeah, nos experts créent des vidéos motion design sur mesure pour vos entreprises.