web-dev-qa-db-fra.com

Boîte de dialogue en haut de l'assistant

J'ai un assistant qui a deux onglets et dans le premier onglet j'ai une liste déroulante. Il y a deux options dans le menu déroulant.

Si l'utilisateur sélectionne la première option dans le menu déroulant, il peut alors accéder au deuxième onglet. Si l'utilisateur sélectionne la deuxième option, nous avons besoin de plus d'informations de la part de l'utilisateur avant de passer au deuxième onglet.

Veuillez suggérer ce qui est le plus approprié:

  1. Ouvrez une autre boîte de dialogue pour demander une entrée
  2. Ajoutez un autre onglet après le premier onglet pour demander une entrée supplémentaire.
  3. Ou toute autre option?

Fixation de la maquette

mockup

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

Sélectionnez l'option 1, un autre menu déroulant apparaît enter image description here Sélectionnez l'option 2 enter image description here Lors de la sélection de l'option 2, une étape supplémentaire est ajoutée enter image description here

Veuillez suggérer quelle est la meilleure approche pour afficher cela, en avez besoin de toute urgence. Merci

1
user1796650

Un assistant avec des onglets? Les assistants et les onglets doivent s'exclure mutuellement. Comme il est indiqué à la page 179 des Windows 7 User Experience Interaction Guidelines , vous ne devez pas utiliser les onglets si les contrôles d'un onglet dépendent des paramètres d'un autre. L'utilisateur doit avoir une décision pour chaque page d'un assistant - il ne doit jamais y avoir autant de contrôles que vous avez besoin d'onglets.

Chemins d'accès variables avec un assistant

Dans cet esprit, la solution est:

  1. Éliminez les onglets. Faire de chaque onglet une page distincte dans l'assistant

  2. Si l'utilisateur sélectionne la première option dans la liste déroulante, cliquez sur Suivant pour passer à la page de l'assistant qui était auparavant un onglet.

  3. Si l'utilisateur sélectionne la deuxième option, cliquer sur Suivant passe à une page de l'assistant intermédiaire qui demande l'entrée supplémentaire. Lorsque l'utilisateur fournit l'entrée et clique à nouveau sur Suivant, il passe à la page qui était auparavant un onglet.

En regardant vos maquettes, il semble que votre cas soit une en cours de modification une étape basée sur une sélection précédente, et non une étape supplémentaire. Si l'utilisateur sélectionne l'option 1, la deuxième page de l'assistant présente la liste déroulante Modèle. Si l'utilisateur sélectionne l'option 2, la deuxième page présente la vue logique. Cela évite de faire apparaître le modèle dans le menu déroulant lorsque l'utilisateur sélectionne l'option 1. Faire apparaître un contrôle sur une page de l'assistant est incompatible avec le principe selon lequel chaque page d'un assistant est une décision unique. Heureusement pour vous, le déplacement du modèle vers le bas sur une deuxième page donne également aux deux chemins de l'Assistant le même nombre d'étapes, vous n'avez donc pas à vous écarter des exigences de conception pour afficher les étapes à gauche.

Un assistant est utile précisément pour ces situations où la prochaine entrée dépend de l'entrée précédente - où il existe plusieurs chemins vers l'achèvement.

Affichage de la progression dans un assistant

En ce qui concerne le problème général de l'affichage de la progression dans un assistant avec des chemins variables, la solution consiste à utiliser une barre de progression et/ou un pourcentage achevé, pas le nombre d'étapes. À tout moment dans l'assistant, le pourcentage achevé est (Nombre d'étapes terminées)/[(Nombre d'étapes terminées) + (Nombre maximal possible d'étapes restantes)]. Dans votre cas, c'est 0/(0 + 3) = 0% fait sur présentation de la première page, 1/(1 + 1) = 50% fait sur la dernière page après avoir sélectionné l'option 1, et 1/(1 + 2 ) = 33% effectués sur la deuxième page après avoir sélectionné l'option 2, suivis de 67% lors de l'accès à la troisième page. Dans d'autres cas, la progression ne sera pas linéaire comme la vôtre, mais au moins elle augmente toujours et, en outre, les utilisateurs sont habitués aux pourcentages et aux barres de progression qui ne sont pas linéaires avec les ordinateurs.

Cependant, si vous êtes requis par le guide de style ou quoi que ce soit pour afficher une liste d'étapes numérotées, alors vous n'avez pas d'autre choix que d'insérer l'étape. Cependant, je ne lui donnerais pas un nombre entier, vous obligeant à renuméroter toutes les étapes suivantes. Je le numéroterais "1a" ou "1.1" ou "1½" - ce qui est le plus logique pour vos utilisateurs. Si possible, insérez la nouvelle étape avec une brève animation pour l'empêcher d'être trop choquante, et vos utilisateurs pourraient être d'accord avec elle.

Montrez ensuite la conception à celui qui a besoin des numéros d'étape dans un assistant. Pendant que vous y êtes, demandez-lui ce qui est censé se produire si l'utilisateur clique sur l'onglet Étape 3 après avoir sélectionné l'option 2 à l'étape 1. Peut-être qu'ils obtiendront alors l'indication que les assistants ne devraient pas avoir d'onglets, numérotés ou ne pas.

Alternatives à un assistant

Il est possible que vous ne souhaitiez pas utiliser un assistant. En général, les assistants sont destinés à des tâches complexes qui sont effectuées rarement. Si cette tâche est effectuée régulièrement, envisagez d'autres conceptions. Par exemple, prenez les contrôles de saisie du deuxième onglet et placez-les sous la liste déroulante du premier onglet. Le fait qu'ils soient dépendants signifie qu'ils sont liés et doivent être sur le même onglet. Peut-être tracez une bordure autour de la liste déroulante et des contrôles dépendants pour souligner qu'ils sont liés. Désactivez les contrôles dépendants lorsqu'une option est définie dans la liste déroulante et activez-les lorsque l'autre option est définie.

Dans votre cas, il semble que les utilisateurs utilisent la fenêtre Vue logique pour spécifier un modèle sous l'option 2, ce que les utilisateurs font (avec l'option 1) avec une liste déroulante. Vous pouvez utiliser ce que j'appelle une "boîte de dialogue d'affectation". Un exemple familier de boîte de dialogue d'affectation est le bouton et la boîte de dialogue "Parcourir" pour sélectionner un fichier. Vous affichez le modèle actuel/par défaut dans une zone de texte. À côté de la zone de texte se trouve un bouton de commande. Il pourrait être étiqueté "Parcourir", mais peut-être que quelque chose d'autre a plus de sens pour vos utilisateurs. Lorsque les utilisateurs sélectionnent le bouton, il ouvre une boîte de dialogue présentant votre vue logique pour sélectionner un modèle pour remplir la zone de texte.

Je ne sais pas exactement ce que fait la liste déroulante des options, mais vous pouvez peut-être l'éliminer. Au lieu de cela, vous affichez toujours le menu déroulant Modèle, qui comprend également toujours le bouton de commande "Parcourir" (ou autre). Les utilisateurs décident d'utiliser la liste déroulante ou la vue logique selon qu'ils sélectionnent le bouton déroulant ou le bouton de commande. Avec cette approche, vous pourrez peut-être tout consolider dans une seule fenêtre principale avec une liste déroulante, un bouton de commande et tout ce qui se trouve à la dernière étape (s'il s'agit d'une page "félicitations", supprimez-la complètement - pages "succès") sont largement obsolètes même dans les assistants ).

Boutons radio?

BTW, en supposant que vous gardiez le contrôle Options, voyez si vous pouvez remplacer la liste déroulante par des boutons radio. Avec seulement deux options, les boutons radio ne prennent pas beaucoup plus de place et sont plus faciles à lire et à utiliser. Cela vous permettrait également de signaler à quelle option spécifique est associée une entrée dépendante supplémentaire (par exemple, si les commandes dépendantes sont sous ou à côté de l'option spécifique à laquelle elles se rapportent).

2
Michael Zuschlag

Une liste déroulante avec seulement deux options n'est pas la bonne façon d'envisager d'afficher les deux options avec des boutons radio. L'utilisation d'onglets dans un assistant ne serait pas appropriée. Considérez quelque chose comme ça.

enter image description here

Il sera préférable de convertir l'onglet en une étape supplémentaire.

2
Nash Vail

Étant donné que l'utilisateur ne peut pas accéder au deuxième onglet, laissez-le désactivé. Lorsque les conditions pour l'activer sont remplies, activez-la et fournissez une animation de fondu de telle sorte que l'utilisateur remarque le changement. Rester simple! :)

1
Dishita Shah