web-dev-qa-db-fra.com

quelle est la meilleure façon d'afficher les champs obligatoires pour différentes actions sur la même page?

J'ai une page pour créer des commandes sur lesquelles les utilisateurs peuvent effectuer l'une des deux actions - envoyer pour concevoir et envoyer pour facturation. Différents groupes d'utilisateurs effectuent ces actions dans un ordre différent. Les champs de la page sont regroupés dans des sections qui sont répertoriées verticalement sur la page afin que l'utilisateur puisse voir tous les champs. En supposant que l'utilisateur a déjà créé un brouillon de la commande - quelle est la meilleure façon d'afficher les champs requis pour chaque action? (modifier le processus métier ou ordonner les actions n'est pas une option)

Actuellement, nous utilisons un astérisque simple pour la conception et des astérisques doubles pour la facturation dans les champs et nous avons une légende en haut de la page pour expliquer l'astérisque simple et les astérisques doubles. Une suggestion a été d'afficher une liste d'actions sur la page et de demander à l'utilisateur quelle action il souhaite entreprendre et d'afficher les champs requis en fonction de l'option qu'il sélectionne, mais je ne pense pas que ce soit une bonne idée de demander aux utilisateurs quelle action ils veulent prendre - ils devraient être en mesure de prendre toutes les mesures qu'ils veulent.

Merci d'avance.

enter image description here

2
maddog

Il s'agit d'un modèle de conception bien connu. Vous avez un formulaire qui contient des sous-workflows, qui peuvent être déclenchés à différents moments dans différents ordres.

Problèmes:

  • Les légendes (astérisques dans votre cas) doivent être évitées si possible, car elles obligent l'utilisateur à fléchir autour de l'écran pour déterminer quels contrôles sont marqués d'un astérisque.

  • Avoir les boutons d'action dans une liste déroulante en haut n'est pas génial car (a) l'utilisateur doit cliquer deux fois juste pour sélectionner une action; et (b) le bouton d'action est visuellement déconnecté du flux de travail (qui se trouve quelque part sur le formulaire) de sorte que la possibilité/la cause et l'effet ne sont pas clairs pour l'utilisateur.

Solution:

  • Utilisez des îles pour regrouper des sous-workflows distincts. Placez les boutons d'action appropriés à côté de chaque flux de travail, afin qu'il y ait une bonne narration visuelle pour chaque sous-flux de travail.
  • Cela vous permet également d'organiser les sous-workflows eux-mêmes dans un ordre logique. J'ai illustré une disposition ci-dessous (où les détails de la commande viennent en premier et où l'utilisateur choisit la conception ou la facturation après cela), mais vous pouvez choisir ce qui convient à votre flux de travail global.

enter image description here

2
tohster

Le codage couleur des boîtes de saisie de données offrira des possibilités supplémentaires.

Existe-t-il d'autres représentations visuelles des deux actions (A et B) qui pourraient être représentées par une icône ou un symbole? Pouvez-vous regrouper logiquement les champs obligatoires pour chaque action?

1
Voxwoman