In-App Notification Center
Centre de notifications dans l'application
Un centre de notifications dans l'application conserve les mises à jour utiles en un seul endroit. Chaque élément montre ce qui a changé, quand, et s'il est non lu.
Un autre exemple
Un coéquipier mentionne Maya dans un commentaire. Maya peut le lire maintenant ou revenir depuis la liste des non lus plus tard.
Parties principales
- 01nombre de messages non lus
- 02élément de notification
- 03Source et temps
- 04lien de destination
- 05Contrôles de préférence
Utilisez-le lorsque
Utilisez-le lorsque les mises à jour importantes du produit doivent rester trouvables après la disparition d'une bannière.
Ne l'utilisez pas lorsque
Ne répétez pas le même événement plusieurs fois ni n'exposez de détails privés. Donnez aux gens des contrôles de notification.
Nom utilisé dans le code
event + recipient + unread state + dedupe + deep link + preferences Avant d'expédier
Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states.
Outcome: Complete the task with Centre de notifications dans l'application (In-App Notification Center). User context: Un coéquipier mentionne Maya dans un commentaire. Maya peut le lire maintenant ou revenir depuis la liste des non lus plus tard. Recommended pattern: Centre de notifications dans l'application (In-App Notification Center). Why it fits: Utilisez-le lorsque les mises à jour importantes du produit doivent rester trouvables après la disparition d'une bannière. Do not use it when: Ne répétez pas le même événement plusieurs fois ni n'exposez de détails privés. Donnez aux gens des contrôles de notification. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): Aucun standard officiel unique ne régit l’ensemble du terme. Sa signification peut varier selon les équipes, plateformes ou frameworks. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.
Vérifiez cette demande
Review how Centre de notifications dans l'application (In-App Notification Center) is used now. Definition: Un centre de notifications dans l'application conserve les mises à jour utiles en un seul endroit. Chaque élément montre ce qui a changé, quand, et s'il est non lu. Release checks: Before release, check the page structure, keyboard access, visible focus, contrast, and zoom. Also check loading, empty, error, success, cancel, and reduced-motion states. Before changing code, list the evidence, gaps, severity, and the smallest safe fix.