Menu
  • UX Trending
  • UX PODCASTS
    • DESIGN UNTANGLED
    • UX CAKE
  • UX Reading Room
  • UX Portfolio Building
  • UX JOBS
    • Atlanta
    • Dallas
    • Los Angeles
UXShareLab… everything you need to know about UX and more…
for the user experience design community

Search

Browse: Home   /   What UX pattern suits nested category selection in the context of a web UI filtering system?

What UX pattern suits nested category selection in the context of a web UI filtering system?

by UXStackExchange on August 2, 2017 in uxstackexchange

I have a sidebar filtering system and I have data that I want to filter on that looks like this:

FilterSection (not selectable)

  • Category1 (select all action link, or checkbox that selects all subcategories)
    • Subcategory1
    • Subcategory2
    • Subcategory3
  • Category2 (select all action link, or checkbox that selects all subcategories)
    • Subcategory1
    • Subcategory2
    • Subcategory3

I also have a section that displays the currently selected filters and allows you to clear an entire section of selected filters (FilterSelection) , or clear individual filters (Category/Subcategory in this case)

Is there a UX pattern that best suits this kind of filtering?

I don't want to use nested checkboxes, because having multiple levels of checkboxes seems wrong and not a great user experience (if you're a Microsoft power-user, you may disagree). I've also toyed with the idea of having a "Select All" action link that selects an entire set of Subcategories, but there has to be a better way to represent this.

Tags: UX Stack Exchange

Sign Up for the latest in UX News...

Enter your email address to subscribe to UXShareLab and receive notifications of new posts by email.

Join 834 other subscribers

Related Posts

Filters on mobile e-commerce
Filters on mobile e-commerce
How should I design this, not sure if it's a container or card
How should I design this, not sure if it’s a container or card
How AI Will Affect UX (And Vice Versa)
How AI Will Affect UX (And Vice Versa)
Washington, DC Agenda Published
Washington, DC Agenda Published

What UX pattern suits nested category selection in the context of a web UI filtering system?

by UXStackExchange on August 2, 2017 in uxstackexchange

I have a sidebar filtering system and I have data that I want to filter on that looks like this:

FilterSection (not selectable)

  • Category1 (select all action link, or checkbox that selects all subcategories)
    • Subcategory1
    • Subcategory2
    • Subcategory3
  • Category2 (select all action link, or checkbox that selects all subcategories)
    • Subcategory1
    • Subcategory2
    • Subcategory3

I also have a section that displays the currently selected filters and allows you to clear an entire section of selected filters (FilterSelection) , or clear individual filters (Category/Subcategory in this case)

Is there a UX pattern that best suits this kind of filtering?

I don't want to use nested checkboxes, because having multiple levels of checkboxes seems wrong and not a great user experience (if you're a Microsoft power-user, you may disagree). I've also toyed with the idea of having a "Select All" action link that selects an entire set of Subcategories, but there has to be a better way to represent this.

Tags: UX Stack Exchange

Related Posts

On the difference beween UX and Product design - does it matter?
On the difference beween UX and Product design – does it matter?
20+ Free Intro & Opener Templates for After Effects
20+ Free Intro & Opener Templates for After Effects
Why do mobile phones require to "send" a dialed number?
Why do mobile phones require to "send" a dialed number?
Mobile Tables - Accessibility (iOS vs Android)
Mobile Tables – Accessibility (iOS vs Android)
← Should I tell interviewees remaining time for tests?
Edit functionality position →

Topics

UX Jobs Dallas Universal Design & Accessibility UX Toolbox User testing UX User Research WordPress Plugins User Experience uxbooth Usability user-behavior web-app UX Jobs in Atlanta UX Rockstars User Interaction Visual Design UX Jobs Atlanta wordpress UX Design UI UI design uxstackexchange WordPress Gutenberg UX Jobs Los Angeles Web Design

Feeds

UI UI design Universal Design & Accessibility Usability user-behavior User Experience User Interaction User Research User testing UX uxbooth UX Design UX Jobs Atlanta UX Jobs Dallas UX Jobs in Atlanta UX Jobs Los Angeles UX Rockstars uxstackexchange UX Toolbox Visual Design web-app Web Design wordpress WordPress Gutenberg WordPress Plugins

<span>recent posts</span>

  • UX in 2018: The human element

    • Anywhere
  • Three Takeaways from the Hawai’i Missile False Alarm

    • Anywhere
  • UX in 2018: Content

    • Anywhere
  • UX in 2018: Design, Development, and Accessibility

    • Anywhere
  • The Power and Danger of Persuasive Design

    • Anywhere

connect to uxsharelab

Enter your email address to subscribe to receive notifications of new posts by email.

UXShareLab. Copyright © 2018. All rights reserved.

  • Contact UXShareLab
  • UXShareLab Community
  • UX PROCESS
  • Recommended Reading
  • UX StackExchange