Comment communiquer visuellement la possibilité de changer de colonne dans une table
Souvent, les sites Web peuvent inclure des fonctionnalités qui permettent à un utilisateur de sélectionner les colonnes qui apparaissent dans un tableau. Lorsque cela se produit, quelle est la meilleure façon de communiquer visuellement cette action, afin que l'utilisateur comprenne à la fois que c'est possible et sait comment l'exécuter?
Nous essayons d'implémenter cette fonctionnalité sur notre site, mais nous sommes à court de moyens pour l'indiquer. Deux icônes ont été suggérées (un crayon et un hamburger) mais elles sont toutes les deux très générales et peuvent ne pas être claires. Il n'est pas évident que cette fonctionnalité puisse être indiquée par une icône.
Existe-t-il des alternatives à cette approche?
Je ferais quelque chose comme ceci:
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Cela permet à l'utilisateur de voir toutes les options disponibles et d'avoir un accès rapide à l'activation/désactivation de leur affichage. Le menu déroulant du bouton indique qu'il contient des options (par opposition au déclenchement d'une action immédiate).
Facultatif: j'ai vu l'icône "œil" utilisée pour les contrôles qui affectent la visibilité des éléments. Je ne pense pas que vous trouverez une seule icône qui le communiquera efficacement tout seul, mais tilisé avec du texte utile , je pense qu'il sera très clair ce qu'il fait et comment l'utiliser .
Je pense que l'icône ou le crayon "modifier" peut être trompeur car l'utilisateur peut penser qu'il peut réellement modifier le contenu du tableau. Qu'en est-il d'une solution qui affiche une option Afficher toutes les colonnes, ainsi que l'option pour afficher une sélection de colonnes? Voici une démonstration de ce que je veux dire: http://gergeo.se/RWD-Table-Patterns/#demo Si toutes les colonnes sont affichées, vous pouvez faire en sorte que le bouton Afficher tout soit sélectionné. Si seulement certains sont affichés, vous pouvez faire en sorte que le bouton "Affichage" soit sélectionné.
Il est difficile de répondre sans en savoir plus sur la plate-forme sur laquelle vous travaillez, mais je vais transmettre ce que j'ai conçu pour la plate-forme sur laquelle je travaille dans l'espoir que cela puisse aider. J'ai lu quelques suggestions sur l'utilisation d'un crayon `` Modifier '', mais mettre autant de fonctionnalités derrière une icône est délicat car c'est un concept difficile à transmettre avec l'iconographie.
Quoi qu'il en soit, l'image ci-dessous montre les options d'icône que j'ai conçues pour la fonctionnalité que vous demandez sur la plate-forme SaaS sur laquelle je travaille. Dans ma situation, après la connexion, les utilisateurs sont présentés avec une interface qui contient une grille de leurs commandes, un panneau de recherche et un panneau de filtres prédéfinis. J'ai ajouté un nouveau bouton à la barre d'outils dans cette zone pour la gestion de la disposition des colonnes spécifique à l'utilisateur. Cliquer sur ce bouton ouvre une boîte de dialogue dans laquelle le l'utilisateur peut configurer ses colonnes en faisant glisser/déposer pour ajouter, supprimer ou réorganiser leur disposition.
Le fait est que j'ai ajouté un bouton visuel clairement compréhensible à notre barre d'outils qui ouvre une boîte de dialogue dans laquelle la disposition des colonnes est configurée.
Le crayon est associé à l'édition depuis un certain temps maintenant, la plupart des utilisateurs le comprendront. Une autre alternative est une liste déroulante. Le panneau d'administration Wordpress utilise une liste déroulante pour permettre à l'utilisateur de sélectionner les widgets à afficher, ajouter une flèche de liste déroulante à la tête de votre tableau et laisser un bloc de cases à cocher pour vos colonnes de tableau glisser, ou bien coller avec le crayon et fournir la même vue déroulante lorsque vous cliquez dessus, la liste déroulante garantira que vos utilisateurs ne seront pas arrachés du contexte de la table.
Je comprends que vous souhaitez communiquer l'action "modifier", mais il peut s'avérer avantageux de communiquer une autre action ("ajouter") et de rendre la fonctionnalité claire après l'interaction de l'utilisateur. par exemple.:
TOUTEFOIS, selon le type de contenu que vous souhaitez afficher dans le tableau, le bouton "ajouter" peut être interprété comme "l'ajout d'un élément au tableau". Cela dépend vraiment du type de contenu que vous affichez (et de la façon dont il est modifiable), et de l'existence d'un "bouton plus important" pour ajouter des éléments au tableau lui-même.