Quel est le meilleur pour concevoir un filtre?
Quel est le meilleur pour le filtre, sélectionnez une seule valeur:
- Case à cocher (utilisez js pour conserver une seule sélection)
- La liste déroulante
- Boutons radio
- Étiquettes en surbrillance
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Cela dépend de ce que vous voulez faire. :)
- Utilisez les cases à cocher (ou d'autres boutons à bascule) si vous souhaitez prévoir l'application de plusieurs filtres à la fois. Si vous souhaitez les utiliser pour une valeur unique, écoutez @AndroidHustle concernant leur manipulation et ne les utilisez que pour des valeurs booléennes indépendantes uniques .
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
- Utilisez la liste déroulante, la zone de liste déroulante ou la zone de saisie semi-automatique pour masquer les filtres alternatifs derrière une liste déroulante, généralement une excellente idée si vous avez une liste interminable de filtres.
- Utilisez les boutons radio ou Contrôle segmenté pour imprimer clairement les options disponibles, en triant généralement sur un attribut distinct .
- Enfin, le contrôle segmenté (terme iOS) diffère du groupe de boutons radio par les avantages de l'ajustement sur une ligne, et il ressemble à l'utilisation d'un onglet Barre plus qu'un filtre, si c'est ce que vous recherchez.
Éditer:
À bien y penser, en fonction de ce que vous voulez filtrer, la liste continue pour chaque contrôle. DatePicker, texte libre, contrôles à valeurs multiples, curseurs de position.
Sans contexte, plate-forme, contenu, etc., il n'y a pas une seule bonne réponse à cette question. :)
Vous devez jamais manipuler un groupe d'options de case à cocher pour agir comme un groupe d'options radio, cela viole le comportement conventionnel et attendu de l'élément interactif utilisateur. Donc pas de case à cocher unique.
liste déroulante vs boutons radio: Cela dépend vraiment de la disposition du formulaire de recherche (si c'est ce que c'est) et du nombre d'options. Les boutons radio sont bons pour 2-3 options, plus et ils commencent à occuper un peu trop d'espace et une liste déroulante serait préférable.
Le panneau des étiquettes en surbrillance suit un modèle interactif similaire à celui d'un groupe d'options radio. La différence est qu'il peut être intégré de manière plus transparente à l'esthétique des applications. Encore une fois, comme avec le groupe d'options radio, ils pourraient facilement se presser s'ils deviennent trop nombreux. Cependant, selon mon expérience, contrairement aux boutons radio, ils indiquent souvent le filtrage en temps réel, par exemple comme la recherche d'une zone et le filtrage en temps réel des voitures, motos et vélos qui sont en vente dans cette zone. Cela peut être dû au fait qu’elles ressemblent à des onglets qui, à leur tour, sont des éléments interactifs immédiats. L'utiliser pour configurer au préalable une recherche dans un formulaire de recherche ne m'est pas familier.
Cela dépend vraiment, je pense:
- bouton radio: s'il y a au maximum 4-5 options au choix
- liste déroulante: s'il y a max 20-30 options (ils l'utilisent pour environ 100 options, mais dans ce cas, c'est vraiment difficile à utiliser)
- onglets: s'il n'y a que quelques options et que les onglets correspondent à votre interface utilisateur
- champ de filtre: s'il y a plus de 100 options à choisir
En général, je préfère filtrer le champ avec des suggestions et/ou la saisie semi-automatique.