Oui aux transitions animées dans les designs d’interface !
Les transitions animées sont-elles forcément à mettre au rebut? Pas sûr. C’est en tous cas ce qu’on peut lire dans un article paru sur UX matters Interfaces That Flow: Transitions as Design Elements. L’auteur tord le cou à cette affirmation catégorique de certains. Il reconnaît toutefois que nombre d’entre elles sont faites n’importe comment, soit trop rapides ou trop lentes, et nuiraient donc à l’expérience utilisateur.
Il déplore que beaucoup de designers—lui y compris—ont une approche des projets qui n’inclue que l’architecture informationnelle, le design d’information, le design d’interaction, et le design visuel. Ces disciplines étant fondamentalement différentes de celles utilisées par ceux qui créent des narrations linéaires continues (au cinéma, à la télévision, et même dans la musique). Or de nouvelles applications vont rendre les éléments narratifs comme le timing, l’allure, et le rythme de plus en plus importants, et vont permettre de faire passer les utilisateurs de la simple compréhension à l’implication, et au final, à l’immersion dans les produits et services digitaux.
Tout l’article porte sur le concept de pause, qui fait défaut dans la plupart des designs d’interface. Il n’y a rien de moins naturel qu’un système qui ne se repose jamais entre deux activités. De même, à un moment ou à un autre, les utilisateurs ont besoin de souffler. D’ailleurs, dans la plupart, sinon toutes, les formes de communication humaine, nous utilisons des pauses pour indiquer que l’on passe d’un état à un autre. Dans l’écriture, ce sont les paragraphes. Dans le design graphique, ce sont les blancs. A l’oral, ce sont les silences. Et en matière de design d’interface, on utilise les transitions animées.
Je n’ai retenu que l’exemple parlant de l’interface collaborative Basecamp, car je l’utilise tous les jours. Quand un utilisateur poste un nouveau message, un cadre jaune met en valeur le texte du message, puis se dissipe rapidement. On a donc une transition qui marque le passage de l’écran de saisie où il a posté son message au message board lui-même. A pomdoo, on apprécie beaucoup cette délicate attention, à la fois reposante et porteuse de sens.


En bref, quand elle est utilisée de manière appropriée, une transition animée peut donc susciter l’anticipation, et faire le ménage dans le fouillis qui se dispute l’attention de l’utilisateur, ce qui lui permet de se concentrer plus efficacement sur ce qui va suivre. Elle contribue à la fluidité et au rythme de l’expérience utilisateur.











