« Ne faites pas attendre les utilisateurs » – l’une des règles essentielles. Pourtant, malgré tous nos efforts, il est parfois impossible de fournir une réponse instantanée à la demande de l’utilisateur. Il est donc crucial de tenir les utilisateurs informés de ce qui se passe, c’est le rôle des 4 types d’indicateurs de progression que nous allons voir ensemble.
Un indicateur de progression devrait être utilisé pour toute action prenant plus d’une seconde.
Dans cet article, je vais passer en revue 4 styles populaires d’indicateurs de progression et expliquer quand utiliser chacun.
1. Chargement « Loading spinner »
Un spinner est le type le plus courant d’indicateur de chargement. Il informe simplement les utilisateurs qu’ils doivent patienter car une action est en train de se faire, sans fournir de détails de durée.
Ce type de chargement infini est mieux perçu qu’un message statique du type « Chargement » car il comporte une animation de base. Le simple fait que quelque chose bouge à l’écran donne aux utilisateurs l’idée que ça fonctionne et que c’est en cours.
Quand l’utiliser : Utilisez-le pour un temps d’attente relativement court (2 à 10 secondes). 10 secondes est à peu près la limite pour maintenir l’attention de l’utilisateur concentrée sur la tâche particulière.
Astuce : Vous pouvez fournir des informations à l’utilisateur avec le spinner. Ajoutez un message expliquant pourquoi l’utilisateur attend. Par exemple, vous pourriez afficher un message sur l’action en cours en cours. Cela réduira l’incertitude de l’utilisateur.
2. Chargement Barre de progression
Une barre de progression est un indicateur déterminé qui se remplit de 0% à 100% et ne diminue jamais en valeur.
Quand l’utiliser : Utilisez une barre de progression pour les processus plus longs prenant 10 secondes ou plus.
Conseils : Fournissez des estimations de temps générales pour les tâches longues. Si une opération prend des minutes (ou des heures), il vaut la peine de donner à l’utilisateur une estimation de la durée afin qu’il puisse planifier son temps.
3. Chargement « Progress ring »
Un anneau de progression est un type d’indicateur de progression avec un temps défini (en pourcentage) ou indéfini. Les indicateurs indéterminés sont pour un temps d’attente non défini (c’est-à-dire le spinner de chargement), tandis que les indicateurs déterminés affichent la durée d’une opération (c’est-à-dire la barre de progression).
Quand l’utiliser : L’anneau de progression peut être utilisé pour des temps d’attente courts et longs. Dans le premier cas, l’anneau de progression sera indéfini, tandis que dans le second cas, il sera défini.
4. Chargement « Skeleton »
Parmi les 4 types d’indicateurs de progression, il y a la progression par des écrans squelette. C’est une progression qui ne comporte que des conteneurs de contenu dans lesquels les informations sont chargées progressivement. Contrairement aux autres types d’indicateurs de progression qui attirent l’attention de l’utilisateur sur le fait d’attendre, les écrans squelette créent une anticipation de contenu à venir.
Quand l’utiliser : L’écran squelette fonctionne mieux pour les temps d’attente courts. Il est recommandé comme solution pour les sites web car la page web devrait se charger en moins de 3 secondes.
Conseils : Ne chargez pas tout le contenu d’un coup. Une fois que vous avez affiché des espaces réservés pour le contenu, vous n’avez pas besoin de les remplir avec le contenu réel en une fois. Vous pouvez les remplir progressivement une fois que vous avez chargé plus de contenu.