Utilisation du Web: alerte/notification - comment attirer l'attention?

Question

Je construis une application web où l'une des fonctionnalités permet aux utilisateurs d'être notifiés en temps réel lorsqu'une alerte leur est associée, similaire à la grosse barre orange de Stack Overflow.

J'ai quelques options, et je me demandais s'il y avait une directive d'utilisabilité sur la meilleure façon de procéder. Une option consiste à avoir une petite boîte de notifications sur l'écran qui clignote des couleurs lorsqu'une alerte apparaît, mais je crains qu'un simple changement répété de couleur ne soit pas suffisant pour attirer l'attention de l'utilisateur.

Une autre option consiste à faire flotter une fenêtre sur l'écran, ce qui nécessite l'attention de l'utilisateur, mais j'ai toujours trouvé que c'était gênant. Peut-être qu'une autre forme d'animation pourrait être moins ennuyante mais tout aussi susceptible d'attirer l'attention de l'utilisateur? Je ne suis pas vraiment à la recherche d'une opinion autant que je suis à la recherche d'une discussion/ressource d'utilisabilité qui pourrait couvrir ce genre de décision.

Answer 1

La réponse dépend un peu de combien il est important que l'attention de l'utilisateur payeur et comment est-ce important qu'ils prennent des mesures? Par exemple. Est-ce que l'alerte du type "votre serveur vient de tomber en panne" ou "vous avez de nouveaux e-mails de tante Zelda" est-elle gentille?

Pour le premier type, quelque chose d'intrusif est le meilleur - soit votre option de flotter une fenêtre, ou peut être changer l'arrière-plan de la page à la couleur flashy (et clignoter ??? Ne me frappe pas s'il vous plaît!). Une autre bonne façon d'attirer l'attention que j'ai vu était de changer le titre de la page (et donc d'une fenêtre du navigateur) en un ensemble clignotant de "* * * * * *" - ce qui est inhabituel pour attirer l'attention parfois. Pour quelque chose de moins envahissant pour moins critique-trop-avis-rapidement, la barre de notification supérieure de SO est l'une des meilleures solutions du point de vue de l'ergonomie (sinon le meilleur), en passant par les métriques principales (combien de travail le l'utilisateur doit faire pour traiter cela et de le regarder, et comment intuitive son comportement est):

• en haut de l'écran le plus souvent les yeux de l'utilisateur voyage et plus susceptibles que d'autres

• Il est très facile de se débarrasser d'une fois que vous l'avez remarqué - la barre est large (facile à frapper avec la souris, pas d'ajustements horizontaux nécessaires) et tout en haut (pas trop beau travail de la souris pour obtenir le pointeur là-bas).

Answer 2

À mon humble avis, le niveau d'ennui devrait refléter le niveau d'erreur ... Pour une erreur, une couche avec le message d'erreur, empêchant l'utilisateur de faire quoi que ce soit d'autre devrait être mieux. Pour une notification, une boîte qui apparaît en haut de la page (comme un navigateur vous demandant de sauvegarder un mot de passe) est sympa.

Je ne pense donc pas qu'il y ait une meilleure solution ... Cela dépend du type de l'alerte ...:)

Answer 3

Découvrez JGrowl, c'est un cadre agréable pour les notifications discrètes, vous pouvez trouver quelques captures d'écran exemples here.

Answer 4

Si vous recherchez des ressources, je suggère Ne me fais pas penser par Steve Krug. Son site, Advanced Common Sense, est également une excellente source.

Un autre site pour obtenir des conseils et des directives utilisabilité est Jakob Nielsen useit.com

J'étais sur un site l'autre jour qui avait un bouton de téléchargement du produit. J'ai cliqué dessus, il semblait que rien ne s'était passé. J'ai cliqué dessus encore, et le lien de téléchargement que le premier bouton a créé m'a un peu secoué. Très efficace et il a un rire:

http://haanstra.eu/putty/

Answer 5

Je trouve la fonction d'effet fort jQuery UI() est bon pour les utilisateurs alerter que quelque chose a discrètement changé; Cependant, comme d'autres l'ont dit, cela dépend de l'importance du message - parfois, il suffit d'être intrusif!

Answer 6

Mon système a trois types de notifications. Chaque type de notification est de style avec une couleur de bordure et le fond:

• Succès: Vert
• Attention: jaune
• Erreur: Red

Alertes, comme « Vous n'avez pas rempli que champ correctement! " sont gérés en ligne, donc pas de popups pour irriter l'utilisateur.

J'ai conçu mon système pour faire disparaître les notifications quelques secondes - cela signifie que les utilisateurs ont l'habitude de voir la boîte verte disparaître après quelques secondes. Cependant, lorsqu'une erreur ou un avertissement se produit, la boîte reste sur l'écran juste devant l'utilisateur, ce qui nécessite de l'attention. Je crois que les avertissements et les erreurs ne doivent être utilisés qu'en cas d'absolue nécessité. Ainsi, lorsqu'ils sont utilisés, ils maintiennent un niveau d'impact significatif. Dans mon système, les avertissements et les erreurs ne disparaissent pas - ils restent là pour vous rappeler QUELQUE CHOSE N'EST PAS BIEN DROITE. Dans mon expérience, si vous allez interagir avec un utilisateur, faites-le grand et dans leur visage, mais ne le faites pas tellement qu'il obstrue le reste de la page. Donc, pas d'invites, ou des superpositions de style lightbox (à mon avis).