🎯 Intention

Afficher une liste de notification de manière intuitive

<aside> ✅ Pré-requis

</aside>

✅ Points clés

<aside> ⌛ Temps indicatif :

</aside>

• Les notifications sont souvent accessible au travers d’un clic sur un icône cloche

• L’icône ou le lien ont une pastille quand il y a des notifications non lues

  Afficher le nombre est un plus. Si impossible, on affiche juste une pastille rouge ronde sans chiffre

  

• Une notification a un statut “Lue” / “Non-Lue”

• Une notification a toujours un lien La notification amène toujours quelque part, que ce soit pour une action à entreprendre ou pour montrer quelque chose

• Les notifications sont affichés de la plus récente à la plus ancienne

• Les anciennes notifications sont chargés à l’aide d’un “Infinite scroll”

  

• Les notifications peuvent être filtré par “Non lues”

  • Le bouton Non Lu doit être un bouton “Tertiary”

  Par défaut, on affiche toutes les notifications

  

• Au survol d’une notification, un bouton avec un dropdown permet d’afficher des actions pour la notification survolé (notamment le “Marquer comme lu” / “Marquer comme non-lu”)

  

• Changer la couleur de fond d’une notification au survol

  

  Ici la notification survolé a un fond de couleur gris

❌ Erreurs type à éviter