I am currently working on a piece of software in which a user needs to select a group in order to display a information about that group.

Details as follows:

  1. The user must select only 1 group at a time
  2. The list is very long list (could contain 1 000 000+ entries)
  3. This list contains groups that are arranged in a tree structure. The tree structure can be 'n' levels deep
  4. Sub-Groups in the tree structure could have the same name, so context would need to be known to be able to select a sub-group.
  5. This list also contains groups that are in a flat structure.
  6. The tree structure and flat structure must be managed in the same space.
  7. The user must be easily be able to move from one group selection to another.

It is obvious to me that a dropdown box will not work.

One alternative is an input box which will present a list that will shorten as you start typing as follows:

enter image description here

This is nice for very long lists, however the complexity comes in with the 2 types of groups.

enter image description here

The list will filter but must include parent groups so that the user can see context about where the sub-group belongs.

One last option that I can possibly try is an ipod style navigation with a breadcrumb. This is where you could start at the highest level and navigate through the options until you get to the group that you want.

enter image description here

This will help with context but may not be useful for very long lists?

My question: Are there any examples of this type of search/filter that works well? Or does anyone have an idea of how I can make this better? Is there a way to do a filter in a filter using the same input box perhaps?

1 Answer 1


It sounds like Miller Columns (as used in Mac OSX file navigation) combined with a text filter box under each column might do the job here, as it will allow you to filter at multiple depths as well as show the path from any point back up to the root node, by virtue of the selected nodes in each column.

enter image description here

However, what Miller Columns add in terms of interaction, they take away in terms of screen real estate, so this might not be suitable for smaller screen mobile devices, and although a drill-down sequence of swipe screens could work, it would not be desirable for frequent use on mobile.

  • Thank you for answering @Roger. In my case, this is basically a selection criteria for what is to be displayed on screen. The group selected could be one of many parameters that need to be selected. i.e. View a group with a selected time period with specific events. The idea is to show on screen what has been selected, and by clicking on the selected group name, you can switch it to another group with the remainder of the parameters unaffected. I like what you have. Do you think that this could be handled in a something like a modal as apposed to be navigated away from the screen? Commented Mar 28, 2013 at 10:22
  • Yes that could be handled in a modal dialog - as would be common with a file selection dialog anyway. The Mac OSX file chooser often uses the last column to show attributes of a selected file and you could do the same for a selected group. Commented Mar 28, 2013 at 10:51

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.