web-dev-qa-db-fra.com

Comment structurer une vue gourmande en données avec des champs de formulaire et des détails principaux?

Je travaille sur un produit dans lequel les utilisateurs travaillent sur une ou plusieurs tâches structurées dans un flux de travail. Si un utilisateur ouvre une telle tâche pour y travailler, il peut voir une vue qui se décompose en deux zones:

  1. Entrée zone: cette zone affiche toutes les informations pertinentes dont l'utilisateur a besoin pour terminer la tâche. L'utilisateur ne peut pas modifier ces données d'entrée, elles proviennent d'autres tâches
  2. Sortie zone: celle-ci affiche toutes les informations que l'utilisateur doit fournir pour terminer la tâche. L'utilisateur peut (et doit ..) éditer ces informations pour faire avancer la tâche

De plus, cette vue de tâche peut avoir deux apparences (selon la configuration de la tâche).

Premier aperçu: champs de formulaire

Les zones d'entrée et de sortie sont côte à côte, chaque côté contient un certain nombre de champs de formulaire (notez que ces champs sont désactivés du côté entrée):

enter image description here

Ici, tout va bien, mais le deuxième coup d'oeil où commence le problème.

Deuxième regard: Master-detail

Pour une configuration plus complexe de la tâche, la vue peut ressembler à ceci:

enter image description here

Il affiche une vue maître-détail, permettant aux utilisateurs de fournir rapidement la sortie requise ligne par ligne. La grille côté entrée contient à la fois des données d'entrée (grisées, désactivées) et des données de sortie. En outre, la grille réside du côté entrée alors qu'elle contient également des informations sortie Nous avons reçu des commentaires de nos utilisateurs que cela les déroutait.

Question

Quelle est la meilleure façon de diviser l'écran en différentes zones pour afficher les informations telles que:

  • L'entrée est clairement séparée de la sortie
  • Le principe du détail maître reste intact pour la grille (= une exigence)
1
t.hendr

Vous pourriez fournir une meilleure expérience de mise en œuvre interface orientée tâche, qui contient un ensemble de tâches, chaque tâche n'a que des données pertinentes et des champs de saisie. Les champs de saisie sont placés de la manière la plus appropriée à la tâche. Cela améliore les performances et réduit la charge cognitive de l'utilisateur.
enter image description here

Les contrôles désactivés ne sont pas non plus un moyen approprié pour afficher des données non modifiables.

MIS À JOUR
Désolé pour la description non claire. Sous Task, je voulais dire des groupes dans les écrans de sortie. Donc, fondamentalement, vous avez les mêmes écrans, mais la disposition est différente, conçue pour prendre en charge la tâche pour chaque groupe de sortie. L'idée est donc:

  • nir les données d'entrée et de sortie pour la tâche, ne pas disjoint sur deux panneaux,
  • limiter les données au montant nécessaire pour chaque tâche.

enter image description here

1
Alexey Kolchenko