J'ai un design complexe sur ma main qui est essentiellement un assistant. La maquette suivante devrait vous donner une idée juste:
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
step1, step2 .... step 5 sont des étapes supplémentaires qui doivent être séparées. J'ai un problème avec "Step2" car il contient un modal à onglets (je ne sais même pas si je dois l'appeler ainsi ou si une telle chose existe) avec les onglets "Ajouter un produit", ajouter un lien, etc.
La raison pour laquelle Ajouter un produit a été conservé dans un onglet séparé est que l'utilisateur peut passer à plusieurs produits. Ainsi, après avoir cliqué sur soumettre, l'utilisateur sera informé que le produit a été ajouté avec succès et le formulaire sera effacé pour un nouveau produit à ajouter si nécessaire. Idem avec Ajouter un lien.
Ma question est la suivante: existe-t-il un moyen de réduire la complexité et de simplifier au maximum le processus de l'utilisateur pour cette "étape 2"?
Le premier problème est que vous n'avez qu'un seul lien "ajouter" pour différents types de contenu. Si vous le pouvez, il est préférable de contextualiser chaque lien:
Ensuite, lorsque vous lui demandez de choisir une sorte de produit, il répond déjà à une question, il ne navigue pas. Cette question doit donc faire partie de votre formulaire et non un onglet
Deux autres choses:
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Vous pouvez le simplifier en transformant les onglets en arbre de décision.
Quelque chose comme ce contrôle accordéon:
Ensuite, vous pouvez simplement faire apparaître la fenêtre (unique) de droite, au lieu de faire apparaître une fenêtre avec des onglets.
Un accordéon comme l'a suggéré Boranas est votre meilleur pari. Une autre suggestion serait d'ajouter des boutons + et - très visibles aux en-têtes de l'accordéon pour qu'ils soient tactiles