Des exemples de bonnes UI pour sélectionner plusieurs enregistrements
Je suis en train de revoir une partie de mon logiciel basé sur Windows et en regardant la transformation de la relation à partir de 1->M pour M->M. en conséquence, j'ai besoin d'ajuster l'INTERFACE utilisateur afin de faciliter la sélection de plusieurs dossiers liés à l'.
Il y a beaucoup de façons de gérer ce que sont communs, mais généralement assez maladroit. Les exemples incluent les deux-volet liste de tous les éléments, et la liste des éléments sélectionnés, ou une liste de tous les dossiers et une case à cocher à côté de chacun, qui s'applique.
Dans mon cas, il peut y avoir énormément (en dizaines de milliers) d'enregistrements qui pourrait être associée, donc je vais probablement besoin d'inclure une sorte de mécanisme de recherche.
Je ne suis pas à la recherche d'un dur et rapide réponse -- je peux mettre en œuvre quelque chose d'assez facilement que c'est fonctionnel, je suis à la recherche pour voir si quelqu'un ici a (ou vu) un grand Isu pour faire ce genre de chose, si c'est basé sur le web, Windows, Mac, Unix, que ce soit.
Des Images ou des liens vers eux serait appréciée!
Edit: voici un exemple de ce que je suis en train d'étudier:
- Voulez-vous fournir la facilité à modifier ce qui est retourné? (Juste vérifier; semble peu probable, mais aurait une incidence sur la conception).
- Non, c'est simplement une méthode de sélection. Dans mon exemple ci-dessus, le lien pourrait vous prendre pour le dossier de cette personne pour l'éditer si besoin est, ou afficher une liste d'options, y compris "supprimer", "modifier" et ainsi de suite.
- Quelle est la moyenne/nombre maximum d'associés personnes pour un? Il est important pour le processus de conception de l'INTERFACE utilisateur.
- Pas une moyenne, mais la plus commune nombre d'enregistrements associés à 1 ou 2, mais il ne serait pas rare d'avoir 30 ou 40.
- Si possible, voir ma réponse. ce qui concerne
- COMIC SANS!!! NOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO!!!!!!
- C'est juste la police de caractères utilisée par Balsamiq Maquette. 🙂
Vous devez vous connecter pour publier un commentaire.
J'aime la façon dont StackOverflow concerne le nombre de balises à de nombreuses questions:
les Éléments sont affichés en tant qu'utilisateur types
De commencer, évidemment, avec le dossier que vous souhaitez associer plusieurs éléments avec.
Comme vous le type de la recherche affiche les matchs ( pas besoin d'appuyer sur le bouton "Recherche" )
À l'utilisateur de sélectionner le dossier désiré ( Tri, ce serait bien. Utilise DONC "tag pertinence". Par exemple en tapant 'a' apporte Java plutôt que l'asp parce que Java a plus de questions que de l'asp, dans votre cas, la pertinence peut être le nom de l'utilisateur )
Le système crée la relation ( en mémoire )
Si un certain nombre de dossiers ( 5+ ) remplir le champ de saisie, ils sont déplacés dans un semi-id de la zone ( pas un problème car il ne dispose que de 5 balise à l'intérieur d'une seule question, mais dans votre cas, quelque chose comme la "intéressant tags" fonction serait nécessaire )
éléments Associés sont déplacés vers un "rigide" de la zone
De cours en ordonnée ( à l'aide d'un tableau )
Cette approche a plus d'efficacité en n'ayant pas besoin d'avoir de l'utilisateur appuyez sur la touche "recherche" ou "ajouter d'autres", ce qui le distrait de ce qu'ils font, il est dit qu'il interrompt son train de pensée.
Aussi, si vous faites l'utilisateur attrape la souris pour cliquer sur quelque chose alors qu'ils sont en tapant l'INTERFACE est moins efficace ( je pense qu'il y a quelque chose qui s'appelle la La loi de Hick à ce sujet, mais franchement j'ai peut-être mal )
Comme vous le voyez, cette approche est assez bien déjà ce que vous avez à l'esprit, mais l'ajout de certaines installations de rendre l'utilisateur plus heureux ( Le danger serait le cas si l'utilisateur aime cette approche et veut dans d'autres parties du système )
C'est intéressant, et assez commune de l'INTERFACE utilisateur de problème, de la façon la plus efficace de sélectionner des éléments. Je suis en supposant que vous avez l'intention d'avoir d'abord à l'utilisateur de sélectionner un seul élément et que le mécanisme qui vous intéresse est de savoir comment choisir les autres éléments qui s'liées à ce premier élément unique.
Il ares divers sélectionner des méthodes. À partir d'un point de vue de l'utilisabilité, il serait préférable d'avoir UNE méthode utilisée pour chaque scénario. Ensuite, lorsque l'utilisateur voit, ils sauront quoi faire.
différentes techniques de sélection:
Vous avez dit que vous aurez des milliers de choix possibles, de sorte que élimine 1 et 5. Vraiment, des milliers d'éliminer tous d'entre eux, comme la facilité d'utilisation n'est pas à l'échelle, avec plus d'une centaine dans la liste.
Si vous pouvez compter sur l'utilisateur pour filtrer la liste, comme dans votre exemple, puis 6 peut être adapté. Si vous pensez à la façon dont Facebook photo de marquage des œuvres, je pense qu'il assez efficace pour de longues listes: arrière-plan: Facebook photo de marquage est un mécanisme qui permet d'attribuer une ou plusieurs personnes à des parties d'une image - ie 'tag' eux.
Lorsque vous sélectionnez une image à la balise (c'est à dire le "single point") et qui souhaitent se rapportent à d'autres éléments(personnes), Une boîte de dialogue pop-up. Il contient le top 6 des noms que vous avez utilisés dans le passé, et une zone de texte où vous pouvez commencer à taper le nom de la personne que vous souhaitez utiliser. À mesure que vous tapez, la liste dynamique des changements afin de réduire le nombre de personnes à seulement ceux qui contiennent la séquence de lettres que vous avez tapées. Cela fonctionne très bien pour les grandes listes, mais il ne se fier à l'utilisateur de taper pour le filtre. Elle permettra aussi de s'appuyer sur l'utilisation de scripts pour réduire intelligemment la liste en fonction de l'entrée de l'utilisateur.
Pour votre application, il serait fier à l'utilisateur de procéder à cette étape une fois pour chaque association, en tant que je suis en supposant que les autres éléments ne seront pas tous ont des noms similaires!
Voici une image de l'Facebook le marquage de l'application: http://screencast.com/t/9MPlpJQJzBQ
Une fonctionnalité de recherche qui filtre les enregistrements en temps réel pendant que vous tapez serait probablement une bonne idée de les inclure. Une autre serait la possibilité de trier les enregistrements.
Puisqu'il peut y avoir un grand nombre d'enregistrements, le meilleur choix dans ce cas est probablement d'avoir une zone séparée qui affiche ce que vous avez déjà choisi, de sorte que l'utilisateur n'aurez pas à vous déplacer dans la sélection des zones à trouver ce qu'ils ont déjà.
auto-explicatif GUI http://img25.imageshack.us/img25/8568/28666917.png
Lien vers le image d'origine
Une autre chose est que, à mon avis, votre problème n'est pas sur la sélection de plusieurs dossiers, mais le filtrage de ces dizaines de milliers d'enregistrements. M->M association peut être mis en œuvre dans une variété de moyen, mais la partie la plus délicate est de fournir un moyen pratique et logique pour parcourir/rechercher l'énorme quantité de données.
Je vous suggère de ne pas avoir à cliquer sur ajouter plus de pour être en mesure de rechercher. L'avertissement au droit, c'est sympa, mais à mon humble avis, il ne devrait dire que la recherche n'affiche que les résultats que l'utilisateur tape.
Tri d'une colonne (peut-être avec la recherche) serait également une belle fonctionnalité. J'avais suggérant qu'il se fait en cliquant sur l'en-tête de la table, avec une certaine icône indiquant si le tri est croissant ou décroissant.
Je vous suggère également de la recherche à faire une l'appariement approximatif de chaînes dans le cas où il n'y a pas ou peu de résultats. C'est tellement ennuyeux de ne pas être en mesure de trouver quelque chose que vous ne me souviens pas exactement.
Enfin, pour l'examen de la première impression (mais pas la fonctionnalité en elle-même), je vous suggère de télécharger vers l' 5 deuxième test et voir ce que vous obtenez.
Je pense que ce que vous avez fait la maquette est une très bonne façon de le faire. Lorsque vous pensez aux balises-à-postes de la relation sur un blog (ou sur soi même), c'est-à plusieurs-à-plusieurs et il est généralement mis en œuvre de façon très similaire: pour un poste, vous rechercher (ou, depuis qu'ils sont de simples chaînes, entrer directement dans) autant de tags que vous souhaitez associer avec elle. Je ne peux pas vraiment penser à plusieurs-à-plusieurs liens que je rencontre souvent, même si je sais qu'il y a probablement beaucoup...
Il y a un certain nombre de questions importantes à considérer - le nombre d'enregistrements sera généralement utilisé (par opposition à la disposition de l'association)? Il y aura un grand nombre de documents sur un côté de l'association (compte tenu de l'interrupteur de 1->M, ce qui semble probable)?
Si l'un des quantités de dossiers est généralement très faible (<10, je dirais), appelons cela le LHS (parce que c'est souvent le cas), alors le meilleur moyen d'associer peut-être pour permettre des recherches pour LHS et RHS éléments, puis faites-le glisser et déposez-le sur une liste - LHS éléments sur la liste appropriée; RHS éléments dans le LHS éléments. De cette façon, c'est de l'intuition pour spécifier une relation entre des éléments. Vous pouvez également ajouter d'autres options comme les "associés avec tous", ou un groupement stylo de sorte que vous pouvez affecter plusieurs enregistrements dans plusieurs autres dossiers rien n'est fastidieux comme d'avoir à faire 15 traîne-et-gouttes de la même enregistrement.
En fait, je pense que c'est le plus crucial peu de tout M->M conception de l'INTERFACE utilisateur - éviter les répétitions. Faire la même chose pour 100s d'enregistrements (rappelez-vous que si "personne ne va jamais...", ils le feront) est n'était pas marrante, surtout si c'est complexe. Je sais que cela semble contredire mon avis précédent, mais je ne le pense pas - de conception pour le cas d'utilisation typique, mais assurez-vous que l'atypiques n'ont pas besoin de rendre le programme inutilisable.