Meilleure interface utilisateur pour la recherche filtrée avec de nombreuses options de filtrage par opposition au champ de texte unique
Quelle interface utilisateur offre la meilleure expérience utilisateur lors de la recherche à l'aide de nombreux filtres par opposition à une seule entrée de texte.
Par exemple: j'ai 15 filtres (tous facultatifs) par lesquels les utilisateurs peuvent filtrer les résultats. L'accent est mis sur ces filtres, pas sur une recherche de texte. Quelle est la meilleure façon d'afficher tous ces filtres sans être accablant et de créer une interface encombrée?
Le seul site que j'ai vu qui a réussi à le faire décemment est OKCupid, qui permet à l'utilisateur de sélectionner, puis de personnaliser, un filtre spécifique dans une liste.
De nombreux sites ont des problèmes avec trop de filtres de recherche. La plupart des sites proposent des options de filtre de base et plus avancées - celles-ci doivent être soigneusement étudiées pour identifier les critères de recherche de base. Ensuite, vous devez soigneusement concevoir le filtre pour répondre à chaque critère. Il y a quelque chose d'un art à cela.
Je pense qu'en général, il est préférable d'opter pour la mise en page de la liste plutôt que pour une boîte de dialogue. D'une part, cela donne à l'utilisateur la possibilité d'ouvrir et de fermer des accordéons pour personnaliser les critères en fonction de ceux qui les intéressent.
Les sites de recherche d'emploi méritent peut-être d'être examinés. Ils ont généralement exactement ce problème et traitent avec de nombreux types d'utilisateurs différents. Une solution consiste à permettre aux utilisateurs de sélectionner les filtres qu'ils souhaitent et de les afficher sous forme de balises en haut ... permettant en fait aux utilisateurs de visualiser leur requête. Par exemple Reed affiche les éléments de requête en orange en haut ... vous pouvez les supprimer à tout moment. Ils font également un bon travail en choisissant les widgets de filtre pour chaque critère et en montrant où se trouvent les données (informations de sensibilité).
Vous pouvez également faire des filtres le centre de la page et le rendre amusant - comme je l'ai fait dans cette idée de conception à un stade précoce:
Ceci est la page de recherche initiale après que l'utilisateur a sélectionné "Recherche avancée" - des filtres et des boutons plus simples ont été affichés sur la page de résultats dans une navigation à gauche pour plus de détails en cas de violon. Croquis réalisé dans les maquettes Balsamiq
J'utilise ce contrôle et il m'a aidé à clarifier tout type de critères de recherche pour mes utilisateurs finaux. Ceci est un plugin javascript par DocumentCloud et son appelé Visual-Search . C'est un plugin magnifique et de loin le meilleur moyen de représenter les recherches. Vous ajoutez autant de filtres que possible, il est toujours très propre et clair pour les utilisateurs finaux de l'utiliser et c'est exactement ce que chacun regarde lors de l'utilisation d'une application.
J'espère que cela t'aides.
La navigation à facettes est devenue un modèle de recherche très populaire pour résoudre des situations comme celle que vous décrivez. Amazon l'utilise très bien.
Extrait du livre Search Patterns sur la navigation à facettes, par Peter Morville et Jeffery Callender:
Conformément aux principes de divulgation progressive et de construction incrémentielle, les utilisateurs peuvent formuler l'équivalent d'une requête booléenne sophistiquée en prenant une série de petites étapes simples.
J'aime aussi comment Gmail intègre la recherche avancée dans le champ de recherche , en utilisant des mots clés pour affiner la recherche.
Je pense que Atlassian Jira le fait très bien. À Jira, il peut y avoir un nombre énorme de filtres. La plupart des utilisateurs en veulent un sous-ensemble. Jira résout le problème en affichant par défaut les filtres les plus couramment utilisés. Tous les autres sont cachés sous un bouton déroulant "Plus". L'utilisateur peut choisir d'ajouter/supprimer des filtres supplémentaires.
Le filtrage et la recherche sont des problèmes similaires mais différents. La plupart des conceptions Web utilisent une combinaison.
Prenez Amazon.com par exemple. SaaS affichant des données relationnelles utilisent souvent des filtres sur les contrôles de la grille. Un bon exemple de modèle très évolutif pour ce type de problème qui est soutenu par la recherche est http://mspace.fm/mspace
Selon les détails de votre problème, vous pourrez peut-être simplement utiliser des contrôles de formulaire traditionnels comme le Finder OS X lors de la recherche avancée. N'oubliez pas que les utilisateurs ne comprennent pas (ou ne se soucient pas) de la distinction entre la recherche, le filtre ou des choses similaires.
Vous devez restreindre la portée de la recherche. Guidez l'utilisateur à travers les étapes principales afin que vous n'ayez pas besoin de beaucoup de filtres. Laissez votre système se souvenir des choix de l'utilisateur. De cette façon, il connaît toujours le chemin du retour.
Les utilisateurs seront stressés/frustrés lorsqu'ils devront choisir entre trop de filtres. Résultat ... les utilisateurs quitteront votre site.