web-dev-qa-db-fra.com

Position de la barre d'outils par rapport à l'élément de menu actif

Je travaille sur un système où un utilisateur peut gérer le contenu d'un groupe dont il fait partie. L'image ci-dessous montre la structure du menu. Le menu supérieur est le menu utilisateur. Le deuxième menu est le menu de groupe. C'est ici que l'utilisateur peut sélectionner son groupe actif. Le menu final est un menu de contenu. Ici, l'utilisateur peut sélectionner une catégorie de contenu à gérer pour son groupe (médias, pages, publications, etc.).

![enter image description here

Imaginez un utilisateur sélectionnant un élément de menu dans le menu de contenu. Il y aura très probablement un bouton "ajouter" en haut à droite. Par exemple; lorsqu'un utilisateur clique sur "média", il peut sélectionner "ajouter un média" en haut à droite.

Où ce bouton doit-il être comparé au menu de contenu?

J'ai essayé des options:

  • À droite du menu du groupe, car vous ajoutez quelque chose à votre groupe
  • À droite de la zone de contenu, car vous ajoutez du contenu

Voir les images ci-dessous. Les deux options ont des avantages et des inconvénients pour moi. La deuxième option est peut-être celle à privilégier, mais elle créera un quatrième menu pour avoir vos boutons pour le contenu. La première option éloigne le bouton du contenu. Il n'est peut-être pas logique d'avoir un bouton dans le menu de groupe qui change en fonction de la sélection d'un élément dans un autre menu.

Je me demandais ce que tu ferais. Merci!

enter image description here

enter image description here

7
Nick Groeneveld

J'ai une autre suggestion, qui peut ou non avoir un sens en fonction de la façon dont vous ajoutez de nouveaux éléments (et de la façon dont vous les affichez dans le menu Contenu).

Si ces éléments de navigation du menu de contenu affichent ces types de contenu lorsque vous cliquez dessus, vous souhaiterez peut-être placer le bouton "Ajouter un nouveau" à côté de chaque élément de menu dans le menu de contenu. Il s'agit d'un modèle courant et a tendance à être clair, car vous cliquez sur "Ajouter" à côté du type d'élément que vous recherchez dans le menu de contenu. Voici une maquette rapide au cas où cela ne serait pas clair (les boutons rouges "Ajouter +" indiquant où ceux-ci pourraient apparaître):

"Add+" items in red show potential button location

1
Luke

TL; DR : Le regroupement d'éléments liés est généralement une bonne chose.

Si nous regardons Whatsapp (une application de chat populaire actuellement détenue par Facebook) comme exemple et examinons comment il gère le placement `` action '', vous remarquerez que tout est à droite. Cela a certainement à voir avec le fait qu'il s'agit d'une application principalement mobile (bien que la variante web fasse de même). Mais cela est également bon pour les nouveaux utilisateurs, car ils n'ont pas à chercher bien loin pour savoir où se trouvent les actions (par exemple, ajouter une pièce jointe et enregistrer l'audio sont côte à côte).

Whatsapp actions

Maintenant, comment cela se rapporte-t-il à votre application? Vous pouvez faire de même et placer à la fois l'action et le menu de contenu les uns à côté des autres (alignés verticalement). Il peut être placé à gauche ou, comme illustré ci-dessous, à droite. mais je pense que ce sera une bien meilleure expérience pour vos utilisateurs.

Group Items

1
Kitanga Nday

Je pense que la solution devrait dépendre de la sélection de l'option de menu comme filtre (ou onglets) ou non .

Si le menu agit comme un filtre ou un onglet , par ex. l'utilisateur voit la liste sur les médias, lorsque l'option "médias" est sélectionnée et rien d'autre, alors j'irais avec la deuxième option mais avec des actions alignées à gauche. Déplacer des actions importantes du côté opposé de l'écran n'est pas utile pour les utilisateurs.

Si la sélection des options ne change pas la zone de contenu, envisagez d'utiliser le contrôle accordéon pour héberger des actions spécifiques aux types de contenu si vous pensez qu'il y aura plus d'une action ou de contrôles pour chaque type de contenu. La proximité des options du menu de contenu et des actions associées est bonne pour vos utilisateurs.

enter image description here

Sinon, si l'utilisateur peut faire avec le contenu est d'ajouter un nouvel objet dans le contenu, alors les options du menu de contenu lui-même devraient ajouter un nouvel objet, ou se débarrasser du menu contextuel ajouter la liste déroulante "Nouveau" au menu de groupe.

0
Jurijs Kovzels

Étant donné que l'utilisateur ajouterait un contenu, il serait préférable de ajouter le bouton plus près de l'endroit où l'action a lie.

Pour cette raison, votre deuxième option est préférable "À droite de la zone de contenu, car vous ajoutez du contenu".

Quand vous y pensez, vous appliquez déjà la même logique en regardant comment vous avez imbriqué les différents sous-couches de menus. Cela fonctionne très bien malgré la quantité de contenu que vous pourriez potentiellement montrer.

Bonne continuation sur votre projet.

0
Tidjane Tall

Je pense qu'une mise en page qui serait plus conviviale est une section d'options avec une image du contenu qu'ils ajoutent avec le bouton d'ajout à côté de cette image. J'ai ajouté un concept ci-dessous. Content Image

0
ColerDesign