Comment l'application parle à l'utilisateur : confirmations, erreurs, chargements, listes vides.
Alerte (alert)
Bandeau coloré qui transmet un message important, la couleur selon le type : bleu (info), jaune (avertissement), rouge (erreur), vert (succès).
Quand l'utiliser : information persistante à garder visible (compte non vérifié), éventuellement fermable.
Quand l'éviter : confirmation brève → un toast suffit (voir Surfaces flottantes).
Squelette de chargement (skeleton)
Forme grise qui mime la structure du contenu à venir, animation douce qui donne une impression de rapidité.
Quand l'utiliser : chargement d'un contenu structuré (liste, tableau), plus élégant qu'un simple spinner.
Quand l'éviter : attente très courte (moins d'une demi-seconde) : l'animation n'a pas le temps d'être perçue.
Indicateur de chargement (spinner / loader)
Petit cercle qui tourne pour signaler qu'une opération en cours, plus simple qu'un squelette.
Quand l'utiliser : action ponctuelle (bouton qui envoie ou supprime), petite taille, dans ou à côté du bouton.
Quand l'éviter : chargement initial d'une page entière → le squelette est plus moderne.
Barre de progression (progress bar)
Barre horizontale qui se remplit à mesure qu'une tâche avance, avec parfois un pourcentage.
Quand l'utiliser : durée ou étapes connues (téléversement, processus multi-étapes) : donne une vraie information.
Quand l'éviter : durée inconnue → spinner ou squelette.
État vide (empty state)
Écran affiché quand une liste n'a pas encore de contenu : icône, message court, souvent un bouton d'appel à l'action.
Quand l'utiliser : systématiquement si une liste peut être vide pour un nouvel utilisateur ; transforme un vide frustrant en première action.
Quand l'éviter : vide temporaire (recherche sans résultat) : un simple message suffit.