0

I'm here to hask you what is the best UX for filters in a page with a table.

In this video you can see a page with a table and some data, a full-text searchbar and a button with text "Filtri" (the italian word to say Filters). Clicking on it a modal with some fields opened. I like consistency, every page with a table has the same design.

My question is: is this design good concerning the UX? Or there is a better way to put filters on a page? Using a modal like I did or using a collapsible panel it's only personal taste or there is more than that?

Improve this question
1

2 Answers 2

Reset to default
2

Quoting Alan Cooper in his book About Face:

Don't force users to go to another window to perform a function that affects the current window.

Your interactions opens an overlay that affects the table, if possible you could avoid that.

Improve this answer
3
  • Good advice, and now I surely should buy that book XD. So, you're telling me that filters should be always visibile in the page? And what if there a lot of possible filters, and not only three like in my in my example?
    – Dennis
    Commented Nov 6, 2022 at 15:10
  • Yes, filter should be as much as possible visible in the page. But it is not possible everywhere and my answer doesn't tell the full story. But it would be good to start from the concept that especially when there's a limited number of filters to show them upfront instead of nesting them somewhere or having them in a modal. Learn more here: pencilandpaper.io/articles/… smashingmagazine.com/2021/07/…
    – Chris
    Commented Nov 7, 2022 at 8:16
  • Thank you Chris
    – Dennis
    Commented Nov 7, 2022 at 20:20
1

No, it's not good UX.

Ideally, you want to make the filters modifiable pretty much direct. By opening the column menu or clicking the Filter menu item, each column type could have its own filter operators. Look at the https://mui.com/x/react-data-grid/filtering/ for basic filters like you need.

filters

Longer version:

Here is a summary of a live design session we had last week (https://youtu.be/TgPspRjRcvk) where Manon & Benoît attempted to answer your question https://youtu.be/Zd6cSF0MrD0

An excellent user experience for filtering means that users don’t have to ‘learn how to filter’. In fact, the smoother the filtering interaction, the more cognitive energy they’ll get to spend on identifying their ideal result(s). Let’s not waste their energy on an onerous interaction, let’s help them achieve their goals in the least taxing way possible. - https://pencilandpaper.io/articles/ux-pattern-analysis-enterprise-filtering/

Improve this answer

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.