Je dois attirer l'attention de mes utilisateurs sur un message d'avertissement, les alerter d'un problème et leur indiquer ce qu'ils doivent faire ensuite. Le message n'apparaît pas dans une boîte popup, car cela signifierait un clic supplémentaire (et en plus, tout le monde déteste les popups). Il se trouve juste en haut de la page en police rouge.
Le problème est que les utilisateurs ne le remarquent pas, car leurs yeux regardent plus bas sur la page.
Ma solution a été d'afficher le message dans une police beaucoup plus grande au milieu de l'écran, puis de le réduire à sa taille et à sa position normales.
Pensez-vous que c'est une solution appropriée?
Je suggère en utilisant une notification standardisée en haut de chaque page. De cette façon, vous pouvez afficher n'importe quelle notification que vous aimez, ou rien (la plupart du temps). Il est devenu largement utilisé et vous pouvez le concevoir pour qu'il soit très visible si vous le souhaitez.
Quelques exemples:
Souvent, si vous avez besoin d'un gros message d'erreur parce que l'utilisateur ne peut pas voir quoi faire, il y a un problème avec l'interface elle-même.
Si l'utilisateur doit sélectionner une application, les applications doivent ressembler à ce qu'elles peuvent être sélectionnées. Évitez une représentation visuelle qui ressemble à un tableau standard et qui a une certaine forme de sélection - si c'est plusieurs éléments, les cases à cocher sont une solution ennuyeuse mais bonne.
Grisez les boutons de l'étape suivante jusqu'à ce que l'utilisateur ait sélectionné quelque chose.
Sinon, explorez d'autres présentations - demandez ici à nouveau de bonnes suggestions.
Non, vous devez déplacer une alerte d'animation vers le bord d'un écran.
Les yeux des humains peuvent détecter un objet en mouvement sur le bord de la vue, car la résolution du bord des yeux est faible. Par conséquent, votre solution sera bonne si vous déplacez une alerte vers le bord d'un écran.
J'aime Noty qui ressemble à une notification sous Mac OS.
Je suggérerais: * Un popup de grille-pain avec des icônes standardisées et apprenables si vous ne voulez pas faire une boîte de dialogue non modale. * Avoir le message près du point de problème aide aussi. Par exemple, s'il est lié à un champ modifiable, faites-le apparaître près de celui-ci. Si c'est sur une ligne du tableau, alors une icône sur la ligne du tableau, etc. * Faites apparaître le message sur le résultat d'une action effectuée par les utilisateurs. * Je voudrais également supprimer le mot s'il vous plaît. Dites-leur simplement quoi faire (bien que cela n'aide pas à la visibilité).
À part cela, il pourrait être l'occasion d'examiner pourquoi les utilisateurs ont également besoin d'un message (par exemple, la sélection d'un véhicule peut-elle être un choix obligatoire quelque part dans le couler*.
(Voir 1 et 2: http://www.slideshare.net/uobroin/Oracle-adf-uxeffectivemessages )
Au lieu d'utiliser un énorme texte d'avertissement de fantaisie, vous pouvez utiliser un effet de vibration à ce sujet. Il est beaucoup plus efficace en termes de convivialité et de nature humaine. L'utilisation de polices aussi volumineuses peut également distraire les gens.
jQuery UI a cet effet dans sa bibliothèque, vous pouvez donc envisager de l'utiliser. http://docs.jquery.com/UI/Effects/Shake
Je recommanderais un fondu progressif qui se produit quelques millisecondes après le chargement complet de la page (ex: 200 ms).
Un gros problème est que l'animation perturbe le processus qu'elle demande aux utilisateurs et qu'il n'y a aucun moyen intuitif de l'arrêter.
C'est étrangement similaire à une scène d'un film que je n'ai pas encore entièrement écrit, nous le prenons donc à mi-chemin de la scène 3, où nous voyons un utilisateur effectuant diverses tâches importantes ...
..
user: Hey, there's an application just waiting to be selected! I think I'll select it!
(user goes to select the application, but supermessage flies in front of him and
blocks his path)
supermessage: PLEASE SELECT AN APPLICATION!
man 1: It's a bird!
man 2: It's a plane!
litte girl: No, it's SUPERMESSAGE! (takes a lick of her ice-cream cone)
(a few seconds of awkward silence pass while user stares at supermessage)
user: Um...supermessage, can you please move, I'm trying to select an application here?
kthxbye
supermessage: (fading into the distance...)
...please select an application!
...please select an application!
...please select an application!
(user selects an application. Meanwhile, audience applauds, laughs, and cries)
..
La morale de cette scène est que je préfère avoir un notification standardisée que cela, soit comme modal pour "AHA!" messages, ou dans la barre de messages pour les messages "meh".
P.S. J'aimerais vraiment votre idée si vous pouviez trouver un bon moyen de l'empêcher de bloquer les interactions des utilisateurs! Si vous faites cela, je vous suggère également de supprimer le message statique et de simplement avoir le bâton de super-message une fois l'animation terminée.
La manière d'attirer l'attention d'un utilisateur sur un message peut être obtenue par le type de message avec son icône respective. Quel que soit le message, le message doit s'afficher avec l'icône appropriée, ce qui rend l'utilisateur plus attentif. La couleur de police du message donne certainement le même impact, mais moins que l'icône correspondante. Ici, l'icône signifie le type d'image d'action du message.
Le deuxième point que je veux partager est que la position du message que l'utilisateur veut voir est le haut de la page avec une position absolue. Par conséquent, pour tout message attentif dans une grande page de contenu, la position absolue supérieure doit être fixée afin que l'utilisateur ne fasse pas défiler la page vers le haut/bas pour voir le message attentif.