Gérer plusieurs popups "d'alerte"?
Une application iPad que nous construisons ouvre une fenêtre d'alerte pour diverses conditions d'erreur. Nous envisageons de créer une interface utilisateur personnalisée pour les alertes, car la fenêtre d'alerte par défaut est assez ennuyeuse. Ma question est, comment empilez-vous les alertes? Par exemple, si 2 parties de l'application lancent 2 alertes différentes, quelle est la meilleure façon de montrer que 2 choses ont mal tourné. Une pensée consiste à ne montrer que la première erreur qui s'est produite. Une autre consiste à afficher les alertes l'une après l'autre, de sorte que l'utilisateur doit cliquer deux fois sur "ok". Un autre est quelque chose comme "2 choses ont mal tourné: voici 1 et voici un autre" mais le problème est que l'erreur 2 peut se produire après l'erreur 1 mais avant que l'utilisateur ait eu la possibilité de rejeter l'alerte 1.
Quelqu'un a-t-il vu un bon modèle d'interface utilisateur pour regrouper plusieurs messages d'alerte?
Voici comment Apple le fait dans le Finder Mac OS:
personne n'aime les alertes (que je sache), mais pour plusieurs messages asynchrones, une interface de "grognement" semble jusqu'à présent assez attrayante. Après avoir examiné plusieurs plugins spécifiques à jQuery pour la `` notification '', j'ai trouvé les éléments suivants assez utiles:
http://pines.sourceforge.net/pnotify/
Essayez de cliquer sur les démos simples et surveillez les notifications javascript le long du côté droit de votre page.
Considération fondamentale ici: avez-vous besoin d'interrompre l'utilisateur?
L'erreur doit-elle être affichée dans une fenêtre contextuelle ou peut-elle être affichée dans le flux de l'application? Par exemple. est-ce une exception ou une notification? "La page n'a pas pu être chargée" a une signification et un poids différents de quelque chose comme "Retweet a échoué. Twitter n'a pas répondu."
Penser à ces différences conduit à quelques réflexions:
- S'il s'agit d'une erreur critique, vous devez interrompre le flux de l'application et alerter l'utilisateur. "La page n'a pas pu être chargée" doit apparaître, car rien d'autre ne peut se produire en parallèle.
- Les erreurs non critiques, telles que "Retweet a échoué" dans une application Twitter, ne devraient pas interrompre le flux, car vous interromprez l'utilisation de l'application par l'utilisateur, qui sera généralement quelque chose comme la lecture ou l'écriture.
- Que fait l'utilisateur? Si l'utilisateur effectue une tâche séquentielle, par exemple. remplir un formulaire, puis montrer à l'utilisateur les différentes erreurs regroupées.
- Pensez à concevoir votre moyen de sortir du problème. Par exemple, ne traitez pas l'erreur comme une erreur. Dans l'exemple "retweet", l'API Twitter est une dépendance externe et par conséquent, tous les appels à celle-ci doivent être tolérants aux pannes, y compris les commentaires à l'utilisateur dans l'interface utilisateur. Cela affecte la façon dont l'utilisateur perçoit votre application: si vous affichez toujours une erreur chaque fois qu'une exception se produit, l'utilisateur percevra une application instable et ennuyeuse qui l'interrompt. Si vous insérez les erreurs et les affichez comme des notifications inévitables qui se produisent simplement parce que Twitter peut parfois être en panne, cela apparaîtra très différemment.
- Regardez les conventions de plate-forme pour iPad. Reportez-vous aux Apple Human Interface Guidelines et regardez les principales applications. D'après mon expérience avec l'iPad, il y a très peu d'états d'erreur dans les applications; cela peut être dû à de bons tests ou à le fait que les concepteurs ont conçu des états d'erreur possibles à partir de l'application. Prenons cet exemple: dans un formulaire Web, si vous demandez des numéros de téléphone dans un certain format spécifique, vous venez d'introduire un état d'erreur possible où l'utilisateur remplit incorrectement le numéro de téléphone. Cependant, si vous acceptez n'importe quel format, c'est un problème de moins pour l'utilisateur de s'inquiéter. Je me demande parfois si les concepteurs d'applications iPad se tournent vers ce type de conception.
Sruly a posté une réponse pendant que j'écrivais ceci et elle a l'air très spécifique et technique. J'espère que ma réponse pourra apporter un peu de matière à réflexion.
Hurlement
Howl est pour iPad ce que Growl est pour Mac
Est capable d'empiler automatiquement plusieurs alertes. Les alertes peuvent disparaître après une seconde s'il ne s'agit pas d'une alerte grave. Vous pouvez également créer des alertes que l'utilisateur doit ignorer. Growl est utilisé dans un grand nombre de programmes Mac, je ne sais pas à quel point Howl est populaire.
Bien que vous ne souhaitiez pas utiliser les modèles Windows pour un produit Apple.
Quelques modèles à considérer. (Depuis Windows)
Les icônes de notification de la barre des tâches affichent un message à la fois et lorsque vous le fermez ou qu'il expire, un autre s'affiche.
Certains messages s'empilent, chaque message suivant étant déplacé de quelques pixels vers le bas et vers la droite.
Certains messages (comme une alerte dans JS) se bloquent jusqu'à ce que vous y répondiez, il est donc évident qu'il ne peut y en avoir qu'un à la fois.
Certains messages (comme les alertes du système Windows pour les risques de sécurité) s'affichent dans une boîte, mais avec tous les messages.
Les sites StackExchange placent les notifications importantes en haut et les moins importantes peuvent apparaître une fois que vous avez effectué une action.
Comme je ne sais pas exactement ce que vous construisez, il est difficile de faire une suggestion, mais grâce à un processus d'élimination, je peux la réduire.
Comme vous avez un nombre limité de pixels d'écran, le regroupement des messages dans une seule boîte pourrait voler une grande partie de votre espace d'écran.
Vous ne voulez probablement pas que votre application se bloque sauf en cas d'erreur critique, les alertes de style JS sont probablement sorties.
Empiler les fenêtres contextuelles non bloquantes ne fonctionnerait pas à nouveau en raison du manque d'espace à l'écran.
Je pense que cela ne vous laisse que quelques options. Une fenêtre contextuelle qui ne se bloque pas et s'estompe ou disparaît lorsque vous cliquez dessus (comme les bulles d'icône de notification dans la barre de tâches de Windows ou les petites notifications dans StackExchange) ou une zone de notification (comme la barre supérieure dans StackExchange)
Je ferais probablement apparaître une alerte transparente de style panneau de signalisation et la laisserais dans le coin supérieur droit ou inférieur droit.
Chaque fois qu'une erreur se produit, vous pouvez afficher le symbole, puis si une autre erreur se produit, vous pouvez faire clignoter l'alerte d'une couleur plus lumineuse et ajouter un compteur à côté avec le nombre d'erreurs qu'ils ont reçues. En plus du symbole et du compteur, vous souhaiterez peut-être une ou deux étiquettes Word. Quelque chose de court et au point serait probablement préférable d'économiser sur l'immobilier.
Lorsque l'utilisateur pousse (clique) sur l'alerte, il peut faire apparaître une boîte avec sa liste d'erreurs.