Les messages informatifs
Parfois, il est essentiel de donner plus d’informations à l’utilisateur·trice, pour qu’il ou elle puisse mieux comprendre les actions à réaliser. L’espace d’une page ou d’un écran étant limité, et encore plus sur mobile, plusieurs composants graphiques nous aident à apporter cette information de façon claire. Ces composants s’inscrivent bien sûr dans une architecture logique, placés au bon moment et au bon endroit.
Les plus répandus sont :
- Les disclaimers (ou avertissement — même si la traduction française est moins significative) mettent en avant une information importante. Ces disclaimers peuvent avoir différents niveaux d’importance : de la simple information à l’alerte orange ou rouge (ou warning).
- L’aide contextuelle (ou parfois appelée hint) va mettre en avant une courte information qui peut aider l’utilisateur ou l’utilisatrice à réaliser une action, si besoin.
- Le tooltip (ou info-bulle) permet d’ajouter de l’information complémentaire ou explicative, mais cette fois de manière cachée. Généralement représentée par un « i » ou un « ? » encerclé, le tooltip révèle son information en cliquant dessus ou en le survolant.
Exemple d’un disclaimer informatif - Malt
Exemple d’aide contextuelle - Pennylane
Cette aide anticipe un cas d’échec et donne une autre solution avec des détails utiles comme le format du numéro SIREN.
Exemple de tooltip cliquable - BlaBlaCar
« Pourquoi renseigner une adresse précise ? » est un tooltip utile notamment pour les nouveaux utilisateurs et utilisatrices. Renseigner une adresse précise est une chance supplémentaire pour avoir des passagers.