web-dev-qa-db-fra.com

GUI pour créer une vue de grille des en-têtes définis par l'utilisateur qui sont basés sur un ensemble fermé de champs

Le besoin commercial est de pouvoir voir une grille de valeurs pour les champs personnalisés qui sont créés par l'utilisateur.

Exemple de besoin commercial. Prenons Microsoft Visual Studio par exemple. MVS a un ensemble fermé de champs pour afficher une grille d'articles. Des domaines tels que:

  • Identifiant
  • Titre
  • Etat
  • Assigné à
  • Type
  • Type d'élément de travail

La grille aimerait ceci:

enter image description here

... Via l'interface graphique que j'ai l'intention de concevoir, l'utilisateur peut créer sa propre grille personnalisée. Disons donc qu'il veut une grille qui n'a que 3 champs:

  • Subject = "Title" + "" + "(" + "State" + ")"
  • Developer = "Attribué à"
  • Type de travail = "Type" + "" + "Type d'élément de travail"

... et puis sa grille personnalisée ressemblerait à ceci:

enter image description here

Comme vous pouvez le voir, le 100% des champs de produit à choisir lors de la création de ces champs personnalisés est une liste fermée qui a déjà une logique de mappage pour les valeurs et cette logique n'est pas personnalisable.

Pour résumer:

  • L'utilisateur décide du nom du champ personnalisé
  • L'utilisateur décide du ou des champs à mapper au champ personnalisé (prise en charge de la concaténation des champs de produit)
  • L'utilisateur décide de l'ordre des champs personnalisés

J'imagine une sorte de générateur de champs où l'utilisateur peut faire glisser et déposer + saisir du texte pour les noms de champs personnalisés et du texte pour les séparateurs de champs de concaténation, mais ne peut pas fermer la voie pour faire cette interface utilisateur.

Le sélecteur de champ habituel ressemble à 2 cases (champs disponibles et sélectionnés), a des flèches gauche/droite pour déplacer les champs entre les cases et des flèches haut/bas pour décider de l'ordre des champs sélectionnés.

enter image description here

Il ne couvre évidemment pas l'exigence ci-dessus, mais je crois que je veux en tirer parti car les utilisateurs sont déjà familiers avec ce type d'interface de personnalisation.

Y a-t-il une idée appropriée qui couvrira l'exigence mentionnée ci-dessus?

Notez que l'utilisateur final est sophistiqué, mais n'a pas d'expérience technique (l'utilisateur final est un commerçant dans la salle des marchés d'une banque).

5
Peled

Tout d'abord, je suggère de faire très attention aux hypothèses. D'après mon expérience, il n'est pas si difficile de développer une bonne et pratique approche de personnalisation des tables/arborescences, mais les utilisateurs ont tendance à l'ignorer de toute façon.

J'ai résolu ce problème en fournissant un ensemble prédéfini (une bibliothèque) de colonnes avec la possibilité de basculer entre les bibliothèques en temps réel. 9 utilisateurs sur 10 étaient satisfaits. Les 10% restants ont simplement demandé à aider à la personnalisation, car ils "n'avaient pas assez de temps" pour parcourir les champs disponibles.

Exemple 1

Je ne peux pas vous montrer l'interface utilisateur réelle à cause du NDA, mais j'essaierai de le restaurer en utilisant Balsamiq.

Idées clés:

  • Bibliothèques de colonnes
  • Valeurs saisies
  • Le format est utilisé pour obtenir une représentation sous forme de chaîne pour une valeur donnée
  • Registre d'attributs
  • L'utilisateur définit le contenu des colonnes à l'aide de DnD

enter image description here

Une table avec plusieurs rendus spécialisés a été utilisée comme vue. Il était assez facile de reconfigurer la bibliothèque de colonnes, mais il a été décidé de fournir deux bibliothèques commutables: standard (juste un aperçu) et bas niveau (plus de détails et d'idées techniques).

Je peux montrer une capture d'écran alpha précoce, mais s'il vous plaît ne soyez pas confus par la complexité globale. Les renifleurs de réseau avec de bonnes capacités d'analyse ont tendance à avoir l'air un peu complexes :)

enter image description here

Comme vous pouvez le voir, les vues de table personnalisées ont été largement utilisées.

Exemple 2

Wireshark (oui, encore un autre renifleur) permet également de faire une certaine personnalisation.

enter image description here

S'il vous plaît vérifier cette vidéo - Comment - Wireshark Tricks Tutorial: Custom Columns

Franchement, je développe une nouvelle approche (et j'espère mieux) pour personnaliser une table (en fait une table arborescente). Je publierai mes résultats en tant que réponse séparée si je parviens à terminer cette tâche rapidement.

1
Renat Gilmanov

Je recommanderais de changer radicalement l'interface:

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

0
bendataclear

Nous avons eu ce défi lorsque je travaillais dans les soins de santé. Générateur de rapports personnalisés. Personne ne l'a utilisé. Parce que c'était trop difficile à utiliser.

Ma suggestion est d'amorcer le système avec des rapports de base et de les rendre modifiables (ou de fournir la possibilité de dupliquer ces rapports de base et de laisser les utilisateurs éditer le double).

En e-learning, la pratique consistant à fournir des exemples concrets est appelée échafaudage. Soutenez-les avec une aide utile jusqu'à ce qu'ils puissent se débrouiller seuls. Dans ce cas, vous apprenez à l'utilisateur à créer des rapports en personnalisant les rapports existants.

Exposez la fonctionnalité de changement de nom et de sélection de champ directement sur l'interface utilisateur des exemples de rapports. Précisez que les étiquettes sont modifiables. Facilitez l'ajout de colonnes, la sélection de sources de données, la suppression de colonnes.

Ce que vous fournissez est un exemple concret, que les gens trouveront beaucoup plus facile à utiliser qu'une feuille de papier vierge. (Tout le monde est un éditeur, mais très peu sont des écrivains.)

0
LindaCamillo