1

Context:

In a form, there are 2 main sections - Boosters and Filter.

If any Booster is checked, the Filter section cannot be checked and if filter is checked, no boosters can be checked. The current interaction is as below:

enter image description here

Question:
Is there a better way to represent and communicate this? There will only be one filter option. I feel like there's something wrong with the representation and layout. Should the filter option be a toggle above the boosters?

How can I make this more understandable?

Improve this question
1
  • I would make boosters disabled if i were to press filter, its simple and a very clear to the user what is supposed to happen.
    – Tomm
    May 17, 2019 at 9:08

2 Answers 2

Reset to default
8

enter image description here

I suggest to add a top level selection between filter X or boosters using radio buttons. Then a secondary level underneath Boosters where they can be selected using checkboxes. If the Filter X radio button is selected, disable the Booster checkboxes.

Depending on whether you want a clear option to have neither Filter X nor Boosters you could add another radio button at the top saying 'No filters or boosters' and make that the default selection.

Improve this answer
3
  • This is a decent solution but I think this isnt much different of the op's problem. I think going for something like option B from @renaud's answer would be best practise
    – Tomm
    May 17, 2019 at 10:23
  • 2
    I disagree with you @Tomm, Renaud is using checkboxes with non-standard behaviour which might confuse users. But that's my opinion, it's up to the Ashwin to choose and test a suitable solution.
    – Martyn
    May 17, 2019 at 10:42
  • Not to compare both designs, but I think Martyn's design is simple and clean (less is more). Only challenge is the default value. If context is clear, it would make this easier to figure out.
    – Mo'ath
    May 17, 2019 at 20:12
2

enter image description hereI suggest to clearly seperate Boosters and Filters if there are not compatible.

Here are 2 ideas :

A with a tab system that force user to choose one group

B Separate vertically both categories and mentioning it is an OR choice

Improve this answer
2
  • Option B is really clean and definitely tells you to choose either a booster or a filter. I think option A might be tempting or unclear to people resulting to try and select a booster and then a filter (even though they are seperate tabs).
    – Tomm
    May 17, 2019 at 10:05
  • 1
    I don't think tabs are typically used as a method of selection, but rather simply used for grouping or breaking up large amounts of data/settings. For example, if you right click and view properties of a file in Windows, it will open a window that shows categories of settings grouped in tabs. The user is allowed to modify settings in each tab, and click Save to preserve all of their modifications. In this case, the user might think "I've selected my Filter, now I'll continue on to select my Boosters." If they select the Filter tab, they'd have no visibility that their Boosters were deselected.
    – maxathousand
    May 17, 2019 at 21:27

Your Answer

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

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