web-dev-qa-db-fra.com

Comment puis-je améliorer cette interface utilisateur détaillée / de regroupement?

Dans ma demande, je dois représenter une entité d'ordre de travail qui a N sections d'ordre de travail et chaque section a M sous-articles. Actuellement, je représente ceci comme ceci:

enter image description here

Chaque bon de travail a un tas de champs (non illustré). Ensuite, j'ai une bande d'onglets montrant les sections, et chaque section a des champs (non affichés) et les éléments M.

J'utilise des onglets pour indiquer N enfants et un onglet factice supplémentaire pour ajouter une nouvelle entité à la liste. Et j'utilise un lien pour activer la suppression de l'entité current dans la liste.

J'essaie de trouver un moyen plus élégant et unifié de représenter le Ajouter un nouveau et Supprimer le courant actions, en les gardant physiquement ensemble. Quelle serait une bonne façon de procéder?

Ou, existe-t-il une manière entièrement différente et meilleure de capturer ces relations de détail maître?

2
Joshua Frank

Ma préférence personnelle serait:

  • gardez les onglets à gauche,
  • utiliser la couleur d'arrière-plan pour l'onglet sélectionné de la même manière que la couleur de la bordure de la boîte intérieure,
  • des groupes de chiffres séparés, par ex. 1000-054,
  • utilisez un x gris sur chaque onglet, qui serait surligné en survol par un x rouge,
  • et un + signe sur l'onglet inférieur

il y a beaucoup d'inspirations pour onglets verticaux , fermer l'onglet , ajouter un nouvel onglet

ou vous pouvez envisager colonnes miller ou une visualisation spéciale pour un arbre hiérarchique

1
Aprillion

Acceptez tous les commentaires d'Aprillion, sauf celui sur le bouton X dans chaque onglet à supprimer.

L'action x sur chacun serait plus adaptée si vous fermez simplement l'onglet. Cela convient mieux aux scénarios où les données sont plus éphémères et faciles à récupérer (comme un navigateur Web).

Dans le cas des éléments de travail, une action de suppression est plus permanente et il serait bon qu'elle obtienne un emplacement et un mécanisme adaptés à la métaphore. Je placerais un bouton de suppression (avec peut-être une icône de poubelle) dans le coin droit du contenu de l'onglet.

Une action de confirmation ou une boîte de notification annulée serait bien. Vous pouvez également y déplacer l'option "MODIFIER" et avoir un "panneau d'options" en haut à droite.

0
Dave Senden