Comment résoudriez-vous le problème de la colonne des cases à cocher?
Ma question est donc un peu ouverte. Fondamentalement, je recherche des solutions possibles au problème de beaucoup de données tabulaires avec des cases à cocher. Par exemple, si nous regardons la page Notifications de compte de Facebook, nous voyons ceci:
Maintenant, je me rends compte que Facebook rend délibérément cela difficile parce qu'ils ne veulent pas que vous arrêtiez les notifications, et une grande partie du problème serait résolu s'ils faisaient en sorte que les en-têtes de colonne se comportent comme tout cocher/décocher, mais cela semble toujours assez laid.
Leur faire des sections extensibles/pliantes pourrait également aider (vous ne voyez qu'un bout de la page - ces lignes continuent et continuent comme le lapin énergisant), mais je pense qu'il devrait y avoir quelque chose de plus viable que vous pourriez faire en plus de cette option .
J'ai balancé l'idée de ne montrer que les cases cochées et de faire apparaître les cases non cochées au survol de la ligne, mais je ne suis pas sûr que ce soit déroutant pour l'utilisateur.
Quoi qu'il en soit, je suis impatient de toute idée que vous pourriez avoir sur le sujet.
Je choisirais un itinéraire similaire à celui de 37Signals avec leurs listes de tâches dans BaseCampHQ : afficher les informations essentielles plus près de l'élément (elles sont trop loin dans la capture d'écran de l'OP ci-dessus) , donc vous obtenez une apparence épurée, et peut-être que j'irais même plus loin et que je me passerais de la case autour des tiques. Et puis en survolant, affichez les cases à cocher interactives à gauche afin que vous puissiez modifier les paramètres, quelque chose comme la maquette ci-dessous.
J'aime votre idée d'avoir une case à cocher principale (tristate) pour chaque section. Pensez peut-être à utiliser une arborescence et à déplacer les cases à cocher vers la gauche.
Une solution que j'ai utilisée dans le passé réplique la fonctionnalité de bureau dans les applications Web et fonctionne comme ceci:
- Cliquez pour sélectionner une ligne
- Maj-clic pour sélectionner plusieurs lignes
- Utilisez des boutons d'action ou un menu d'action en haut du tableau pour sélectionner ensuite une action pour les lignes sélectionnées (par exemple, activer les notifications par e-mail)
Cette solution est plus évolutive en ce que vous pouvez facilement ajouter plus d'actions, et elle affiche certainement moins d'encombrement des cases à cocher. L'inconvénient est que les utilisateurs peuvent ne pas se rendre compte que le fait de cliquer sur plusieurs lignes en appuyant sur la touche Maj est une option, bien que des astuces ou du texte d'instructions puissent être utilisés pour informer les utilisateurs de cette fonctionnalité.
Pour les données tabulaires plus complexes - disons, l'exemple Facebook, mais avec six types de notifications plutôt que deux - une option serait de combiner le masquage des cases à cocher par défaut avec la possibilité de modifier une "ligne" ou une "colonne".
Au survol d'une case à cocher, comme dans réponse de Roger , vous afficheriez la case à cocher (cochée ou non, selon le cas), et autoriser l'utilisateur à modifier ce paramètre. Vous pouvez mettre en surbrillance la ligne et la colonne "actives" pour aider l'utilisateur à comprendre quel paramètre est modifié.
Au survol d'une ligne, cochez les cases de la ligne entière avec le texte qui dit "cliquez pour modifier". Cliquer sur la ligne affiche toutes les cases à cocher de la ligne, avec une case principale à l'extrême gauche pour cocher/décocher toutes les cases de la ligne, un bouton Enregistrer à la fin de la ligne pour ramener l'utilisateur à l'affichage normal et un bouton Annuler pour revenir. sans enregistrer. Pour une section avec plusieurs lignes, vous souhaiterez peut-être même masquer les autres lignes afin que les en-têtes de colonne apparaissent directement au-dessus des cases à cocher, mais cela pourrait être un peu déconcertant pour l'utilisateur si la ligne monte et descend dans le tableau. (La mise en surbrillance de la colonne active peut suffire.)
En survolant pour un en-tête de colonne, affichez les cases à cocher de la colonne avec le texte qui dit "cliquez pour modifier". Comme pour les lignes, toutes les cases à cocher de la colonne seront affichées, avec des boutons d'enregistrement et d'annulation au bas de la colonne et une case à cocher principale en haut pour cocher/décocher toutes les cases de la ligne.