What UI design provides the best user experience when searching using many filters?

As for the maximum number of filters, I can have 150 filters (all optional) that users can filter their results. What would be the best way to display all these filters without being too overwhelming for the user and reduce a very cluttered interface?

Their are sites in which I have seen that has managed to do with around 20 or lesser number of keywords, are online shopping sites. Likewise, fontawesome includes a UI for such. But, what I am after is for having a maximum of a hundred and fifty number of filters.

  • Why do you need 150 filters in the first place? Let's assume you somehow develop the UI for that, I am pretty sure it will be a very bad experience for the user irrespective of how good your interface is. It would be better if you filter out the keywords based on the priority and necessity.
    – K K
    Commented Apr 5, 2018 at 5:35
  • @KK I am currently redoing an old system, in which has 150 filters in it. As the old system has supported this (150 filters) in a bad way, I need to redo it in a new system, implemented in a better or cleaner way without changing the specifications of the old system.
    – Rin Minase
    Commented Apr 5, 2018 at 6:17
  • Okay. In that case, my suggestions would be to identify the important and required options. Classify the options into sections: basic and advanced. Keep the necessary options in basic section and rest of them in advanced. By default, the advanced section will be in a collapsed state.
    – K K
    Commented Apr 5, 2018 at 7:10
  • It will be great if you can add a screenshot of the application or a quick wireframe of what you are trying to do. 150 filters/categories are not recommended, may be you need to group what is most important for users and rest of the categories. Contextual inquiry will be helpful here to understand what all are most imp for users and what are most used to help decided on how to arrange them on screen and design flow.
    – Yobuddy
    Commented Apr 5, 2018 at 9:16

1 Answer 1


Those that Font Awesome use are tags or categories, I do not think it's correct to define them as filters. If your cataloging system is similar to that and the filters are really 150, you could use a classic collapsible tree menu to organize "filters", possibly divided into macro categories.

In alternative another solution is to use a unique search field where put more keyworks. In this case users must know what are searching. Selectize.js is a good tool for this solution.

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.