0

I'm trying to find what this particular list/picker unit is called as I'm researching the best way to allow a user to select from hundreds of options in various categories.

The user will be able to apply the filters either by clicking or using apply.

One of the problems with this UX is that you have to go into each category to find out what filter you added.

Has anyone seen something better than this at handling hundreds of items?

Any help would be great! Hoping this has been solved in an existing react component somewhere :D

https://jmp.sh/fkvKps4

1
  • I don't know if the whole thing has a name. Technically it's using tabs, but then inside each tabs there are different drilldown and navigation items. The notification itself is an added thing so it doesn't really matter, tabs can have those notifications too, but all the different navigation systems, selection, etc I really have no idea
    – Devin
    Aug 9 at 13:20

1 Answer 1

0

This is a heavy filter that is being implemented like a fly-out menu. You're correct to note that there's a problem because you can't easily see what criteria have already been selected.

It would appear that the use case for this might be "I want to select many different diverse criteria to see the exact results I'm looking for." You might see this on vacation rental sites, car-buying sites, and dating sites. Often these sites use faceting after a search to narrow down criteria after a basic filter has been applied.

Fly-out menus can create struggles for some users with disabilities. So, if your users need to select multiple diverse criteria with as few clicks as possible, I'd recommend looking at other sites that model your user need. Good filters will show what's being selected while the user still works on putting the criteria together.

Carvana's convertible search Carvana search with filters

Airbnb Airbnb search and filters

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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