Chat Windows dans l'application Web - PopUp ou flottant Div?
Je travaille sur une application web. L'application est déjà construite et déployée sur les clients. Il fonctionne sur une large gamme de navigateurs Internet. Je suis chargé d'ajouter une fonctionnalité de chat à l'application. Cette fonctionnalité prend en charge les utilisateurs connectés au site discutant entre eux. Il y aura 2 nouvelles interfaces utilisateur principales. Le premier est la liste des utilisateurs avec lesquels vous pouvez discuter (similaire à Trillian ou Skype). Et la seconde est une interface/fenêtre à onglets qui sera toutes vos conversations de chat (chaque conversation entre vous et un autre utilisateur sera dans son propre onglet dans cette fenêtre).
Je suis plus un développeur qu'un expert UI/UX, j'ai donc tous les aspects techniques compris. J'essaie de déterminer la meilleure façon d'intégrer ces fenêtres dans l'application existante en termes de convivialité. Voici les premières approches auxquelles j'ai pensé.
(A) Faire en sorte que mes deux fenêtres ("Liste d'utilisateurs" et "Conversations de chat") soient chacune une fenêtre contextuelle. Il y aura un bouton/lien sur l'application qui permettra à l'utilisateur d'ouvrir sa "Liste d'utilisateurs" sous forme de pop-up. De là, ils peuvent ouvrir des conversations en double-cliquant sur les noms d'utilisateurs dans la liste, ce qui ouvrira une autre fenêtre contextuelle contenant des conversations, la fenêtre "Conversations de conversation". Si vous cliquez ensuite sur un deuxième utilisateur, une nouvelle conversation s'ouvrira dans la fenêtre "Conversations de conversation" existante. Au plus, vous aurez 2 fenêtres pop-up ouvertes.
(B) Combinez mes deux fenêtres ("Liste d'utilisateurs" et "Conversations de chat") en une seule fenêtre contextuelle. Faites en sorte que la liste des utilisateurs soit une partie de la fenêtre contextuelle et que les conversations soient l'autre partie. De cette façon, vous n'avez qu'un seul pop-up ouvert.
(C) Au lieu d'utiliser des fenêtres contextuelles, utilisez un div flottant qui restera dans la fenêtre principale du navigateur/application. L'utilisateur peut déplacer le div ou le cacher/l'afficher. Il prendra cependant de la place sur l'application existante lorsque vous l'utiliserez. Si vous avez plusieurs conversations en cours, cela prendrait beaucoup d'espace sinon tous.
J'aimerais avoir l'avis des gens sur ces approches ou sur d'autres approches auxquelles je ne pense pas. Laquelle serait la plus utilisable et la plus familière aux utilisateurs?
Une autre alternative si vous avez une application d'une seule page est d'avoir une zone dédiée à la messagerie. Cela pourrait être dans un état minimisé en l'absence de messagerie.
L'avantage d'avoir cela et votre div flottant est que l'utilisateur n'a pas à changer de fenêtre ou à garder une trace des fenêtres ouvertes. Il est également léger comme dans le même contexte d'application.
L'avantage de plusieurs fenêtres réside dans le fait que la messagerie est une fonction principale de l'application. Dans ce cas, je préférerais votre option b. Aussi, si j'ai plusieurs moniteurs, je déplacerais cette fenêtre sur mon moniteur secondaire
J'aime (B), donc les conversations actives sont répertoriées sur le dessus de la pile, puis les contacts disponibles en dessous. Similaire à la façon dont Skype gère.
En ce qui concerne le placement, avez-vous envisagé un panneau qui peut se développer et se réduire, corrigé dans la navigation. Alternativement, un panneau fixe qui peut être `` sorti '' via un bouton qui le transformera ensuite en une fenêtre distincte qui peut être déplacée vers un deuxième moniteur, etc.