web-dev-qa-db-fra.com

Quelle est la différence entre une alerte, une bannière de notification et un message toast?

Y a-t-il une différence entre l'alerte, la bannière de notification et le message toast? Quand doit-il être utilisé, dans quelles conditions et dans quel scénario? Dans quel composant l'image ci-dessous conviendra-t-elle?

enter image description here

14
Pradeep

Le choix des notifications dépend souvent du système pour lequel vous construisez.

Si vous construisez pour une plate-forme existante, par exemple une application iOS ou Android, alors la plupart des plates-formes ont des directives qui sont en place pour que leur utilisation reste cohérente dans toutes ces applications de plates-formes.

Voici une sélection de ces ressources:

Si vous construisez pour le Web, il s'agit d'un jeu de balle différent car c'est à vous de définir les règles de votre application Web et cela est probablement plus conforme à l'exemple que vous avez fourni la capture d'écran de - Je suppose que vous construisez une application web?

Voici la conclusion d'un article que j'ai lu à ce sujet.

Les utilisateurs veulent rester informés tout en utilisant vos applications Web ou mobiles. Profitez toujours de l'occasion pour montrer à vos utilisateurs des notifications claires et bien formées. Si nécessaire (par exemple, notifications de message d'erreur), ajoutez des informations supplémentaires sur la nature spécifique d'un problème et sur la manière de le résoudre. Essayez de garder vos notifications simples et directes. Vos utilisateurs adoreront savoir exactement ce qui se passe et pouvoir se sortir d'une situation difficile.

Tiré de https://infinum.co/the-capsized-eight/articles/ux-quick-tip-the-proper-way-of-handling-notifications

Y a-t-il une différence entre les notifications d'alerte, de bannière de notification et de toast?

Alertes

Cela empêche l'utilisateur de continuer jusqu'à ce que la notification ait été acquittée. Ils ont parcouru un long chemin depuis la fenêtre contextuelle JavaScript et souvent les concepteurs de sites Web les ont personnalisés de différentes manières.

enter image description here

enter image description here

Barre de notification

Ce type est souvent un espace réservé dans une zone cohérente qui alerte l'utilisateur d'un message. Le plus souvent, il existe les 3 types, Erreur, Avertissement, Succès et portent souvent une icône ainsi qu'une certaine couleur qui ne serait pas en contradiction avec la conception du site Web. Faire en sorte que cela soit perceptible. La différence entre l'alerte et la barre de notification est que l'utilisateur n'a pas à accuser réception de la notification.

enter image description here

enter image description here

Notifications de toast

Semblable à la barre de notification, mais apparaît par-dessus le contenu, a généralement une belle animation pour attirer l'attention des utilisateurs.

enter image description here

Dans quel composant l'image de l'OP convient-elle?

Votre exemple ressemble au type de notification Toast

Lecture supplémentaire:

Astuce UX: la bonne façon de gérer les notifications - https://infinum.co/the-capsized-eight/articles/ux-quick-tip-the-proper-way-of-handling-notifications =

Google - Comprendre les alertes et les notifications https://support.google.com/adwords/answer/1704338?hl=en-GB

16
stradled

Beaucoup de questions là-bas.

Tout ce qui est mentionné est la manière dont le système donne à l'utilisateur des informations. Les facteurs décisifs comprennent l'attente de l'utilisateur, l'importance du message et la fréquence du message. Examinons-le un par un.

Message d'alerte

Les messages de l'ancien style alert() ont presque disparu maintenant. Au moins dans les applications d'entreprise d'aspect professionnel, vous les voyez rarement. Raisons principales parce que celles-ci sont à peu près hors de contrôle pour le développeur et sont très envahissantes pour l'utilisateur.

bannière de notification

J'utilise une bannière de notification, comme Gmail le fait, en haut de l'écran, une seule ligne est lorsque l'utilisateur attend un retour du système. La plupart du temps, c'est lorsque l'utilisateur a effectué une action. Suppression d'un utilisateur, envoi d'un e-mail, etc. Le système prend cette action pour l'utilisateur et informe immédiatement l'utilisateur du succès ou de l'échec de cette action. Ceci est essentiel pour être franc et peut être facilement repéré, mais pas aussi envahissant que cette alerte. La plupart du temps, il utilise une nuance de couleurs vives qui créent un contraste avec le reste du contenu de l'écran. Je choisis de les garder en haut au centre, avec un minimum de données cachées.

Notification Toast

Ceci est utilisé lorsque le système fournit des informations à l'utilisateur sur son propre. Ce n'est pas nécessairement un retour d'une action de l'utilisateur. Par exemple, la nouvelle alerte mail d'Outlook, la notification de changement de chanson de Winamp font toutes partie de ce type de message. Le contenu affiché dans ces messages est utile à l'utilisateur, mais pas aussi important pour interrompre le flux de travail actuel de l'utilisateur et détourner toute son attention sur ce message. Ceux-ci sont non modaux et disparaissent facilement.

Naturellement, ces notifications de toast se trouvent près du plateau de notification (par défaut en haut à droite pour mac et en bas à droite pour Windows) car le plateau de notification contient également des informations/actions importantes mais non intrusives.


L'exemple que vous avez montré est très probablement une notification de toast (compte tenu de la hauteur, de la taille et du bouton de fermeture), mais je serais fatigué de l'utiliser pour un message d'erreur.

J'espère avoir été utile.

2
Sol

Notifications : il en existe deux types

  1. Notifications système qui sont généralement affichées sous la forme d'une bannière large et mince en haut de l'écran et sont utilisées pour informer l'utilisateur d'un changement prolongé de l'état du système (comme le système est en panne, la maintenance planifiée, les nouvelles fonctionnalités, etc.)

enter image description here

  1. Messagerie intégrée qui est utilisée soit lorsqu'il existe un composant social et une sorte d'interaction entre les utilisateurs, soit lorsque le système doit informer l'utilisateur de l'état du contenu.

enter image description here

Les deux types sont statiques, ils restent affichés jusqu'à ce que l'utilisateur clique dessus, ou pendant la durée de la première visite.

Toasts

Les toasts sont dynamiques, ils sont affichés pendant une courte période et contiennent généralement les commentaires du système sur les micro-interactions de l'utilisateur.

enter image description here

Alertes

Les alertes sont une fonctionnalité relativement complexe qui peut être placée dans les zones Paramètres ou Alertes, où les utilisateurs configurent leurs alertes pour des événements spécifiques, en particulier, les utilisateurs définissent ce que sont ces événements et ce que devrait être l'alerte. Par exemple, l'utilisateur peut configurer une alerte pour un certain état du système ou certaines données à notifier via leur e-mail, sms, appel portable, etc. Dans certains cas, une couche de complexité est ajoutée lorsque les utilisateurs configurent une alerte pour un très situation spécifique, comme si les données qui dépassent une certaine limite dans les seuils supérieur ou inférieur, les utilisateurs veulent en être informés immédiatement. Les alertes sont toujours situationnelles, attachées à un certain événement et les informations sortent du système.

enter image description here

2
Zoe K

La principale différence entre les toasts et les dialogues est que les toasts fournissent un retour discret tandis que les dialogues exigent une réponse immédiate.

Toasts

Un toast fournit une rétroaction simple sur une opération dans une petite fenêtre contextuelle. Il ne remplit que l'espace requis pour le message et l'activité en cours reste visible et interactive. Par exemple, si vous quittez un e-mail avant de l'envoyer, vous déclenchez un toast "Brouillon enregistré" pour vous informer que vous pouvez continuer à le modifier ultérieurement. Les toasts disparaissent automatiquement après une temporisation.

Notifications

Un toast ne serait pas approprié si l'utilisateur est censé répondre car il n'apparaît que brièvement et ne peut pas être rappelé. Dans cette situation, les documents Android Android recommandent d'utiliser une notification. Si la réponse de l'utilisateur à un message d'état est requise, envisagez plutôt d'utiliser une notification.

Boîtes de dialogue modales

Les alertes dans les boîtes de dialogue modales doivent être utilisées chaque fois qu'une réponse explicite est requise de la part de l'utilisateur, et cette réponse est nécessaire avant que quoi que ce soit d'autre puisse se produire. Une boîte de dialogue ne remplit pas l'écran et est normalement utilisée pour les événements modaux qui nécessitent que les utilisateurs prennent une action avant de pouvoir continuer.

Quant à l'exemple que vous avez envoyé, il répond aux caractéristiques d'un message toast.

Références:

Conception matérielle

Article de Norman Nilson

1
Eran Bar