1. Objectif de la page

La page Notifications permet à l’utilisateur de :

• consulter toutes les notifications liées à son compte
• suivre les événements importants (transactions, alertes, informations système)
• distinguer les notifications lues et non lues

2. Accès à la page

Cette page est accessible depuis :

• l’icône 🔔 Notifications située dans l’en‑tête de l’application
• le menu principal de navigation

3. En‑tête de la page

3.1 Icône accueil

• Icône : 🏠
• Fonction : retour rapide vers la page Accueil

3.2 Titre

🔔 Notifications

🎯 Indique clairement le contenu et la finalité de la page.

3.3 Menu d’options

• Icône : ⋮ (menu contextuel)
• Fonction possible :
  • marquer toutes les notifications comme lues
  • supprimer toutes les notifications
  • accéder aux paramètres de notifications

(Les options exactes dépendent de la configuration de l’application.)

4. Onglets de filtrage

La page propose deux onglets pour organiser l’affichage :

4.1 Onglet Toutes (0)

• Affiche l’ensemble des notifications
• Le chiffre (0) indique le nombre total de notifications disponibles

4.2 Onglet Non lues (0)

• Affiche uniquement les notifications non consultées
• Le chiffre (0) indique le nombre de notifications non lues

📌 L’onglet actif est visuellement mis en évidence.

5. Zone de contenu

5.1 État vide (aucune notification)

Lorsque l’utilisateur n’a aucune notification, l’écran affiche :

• Icône centrale : cloche grisée
• Message principal :
  Aucune notification
• Message secondaire :
  Vous recevrez ici vos notifications

🎯 Objectif :

• Informer clairement qu’il n’y a aucun contenu à afficher
• Rassurer l’utilisateur sur le futur usage de cette page

6. Comportements fonctionnels attendus

6.1 Réception des notifications

• Les notifications sont générées suite à :
  • une transaction réussie ou échouée
  • une recharge ou un transfert
  • des messages système ou promotionnels
• Elles apparaissent automatiquement dans la liste

6.2 Gestion des états

• ✅ Notification non lue : mise en avant visuelle
• ✅ Notification lue : apparence atténuée
• ✅ Mise à jour des compteurs (Toutes / Non lues)

6.3 Actions utilisateur possibles

• consulter le détail d’une notification
• marquer une notification comme lue
• utiliser le menu pour des actions globales

7. Règles UX / UI

• Interface simple et lisible
• Distinction claire entre état vide et état avec données
• Navigation fluide entre les onglets
• Feedback visuel immédiat après une action utilisateur

8. Sécurité et confidentialité

• Les notifications sont strictement liées au compte utilisateur
• Aucune notification n’est visible par un tiers
• Les données affichées sont protégées et non modifiables sans autorisation

9. Résumé

✅ Page dédiée au suivi des événements du compte
✅ Système d’onglets clair pour filtrer les notifications
✅ Bon traitement de l’état vide
✅ Élément clé de l’expérience utilisateur et de la transparence