0

So I have a list of groups, but these groups are dependent on the model you selected. In this image, Group 1 is disabled because I have selected model b (not shown) and Group 1 is only for model A. enter image description here

I want to use the icon to show the user that the item is disabled, but I am afraid just the icon won't be clear enough to the user. I thought about adding an icon description, but I don't like the idea of having two icons on one line: enter image description here

Any alternative designs I am not thinking of? I would like it to be on one line because there can be a large number of options that are both enabled and disabled and I don't want to add more vertical space. Additionally, I would like to have the icon and show which model goes to the group "(Model A only)" in the image.

2 Answers 2

2

In a progressive disclosure dropdown selector pattern like this, the Organization menu would only show available options for Model A. Unavailable options simply wouldn't be shown.

The rule behind this is that we show things in a disabled state if they could become enabled in some cases; we hide things when they are never enabled. Because DanielOrg2 will never allow Group 1, you'd hide it.

3
1

Greying out the item is good enough communication.

Adding an icon might be a bit too much, you want to communicate that you can't use this item, not "you've done something wrong to make this item disabled". Which is what I'm getting from that icon.

Also don't worry about users not understanding why they can't use a certain item. They are all enabled at the beginning I'm guessing, and seeing items disappear after selecting a dropdown item will send the message loud and clear why the groups are the way they are.

2
  • 1
    The icon part is really important. The warning icon is used for cases where the user can actually do something about it, which doesn't seem to be teh case
    – Devin
    Jun 28, 2023 at 13:54
  • 1
    @Devin exactly, I was quite confused why a disabled state had a warning icon. If it had it before before disabled, that's fine, but after is a bit confusing Jun 28, 2023 at 14:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.