I have a large tree data structure that might be up to 10 levels deep.
I need to design a control for a Windows 8 store app that will allow the user to select an element from each level from this tree.
For example, the user needs to first pick from {mammal, reptile}, then if mammal is selected, pick from {Aardvark, Bear, ..., Zebra} then if Bear is selected, pick from {Polar, Brown, Black}.
It seems that on the web, you see this type of data represented often as a set of dynamically generated dropdowns. My client believes that there might be a more intuitive or user friendly way to browse and select levels of the tree. Is there another UI pattern that might be useful here?
Answer
Having too many levels in a treeview could bring bad UX. The possible issues are:
- Loosing hierarchy in deeper levels, it just dissapears within limited view.
- High visual noise caused by nodes from previous levels.
- Much space is occupied by non-relevant elements from previous levels.
- Horizontal space growth.
An example of ten-deep treeview is shown on the image.
The best solution requires much task details, but general direction for solution is to limit information overload for data-heavy task. Examples of deep hierarchies pattern could be seen in many e-commerce sites which present sets of goods. They "rotate" the tree and display only relevant subset on each step. Using breadcrumbs could be difficult for deep hierarchy, so you could cut them in some way. 
No comments:
Post a Comment