I have various collections of entities that can be associated at various levels, varying in depth as well.

Would the best approach be to use a treeview? If I cannot use a treeview could I create the UI in such a way that the nesting is evident.

Where can I find good samples of a hierarchical UI?


I thought I would give some more detail, and what my specific problem was/is. I have the following sets of entities (from highest in hierarchy to lowest):

  • Career Role
  • Career Path
  • Career Learning Programs
  • Certification Collection
  • Vendor
  • Certification Program
  • Certification Exam
  • Learning Assets
  • Courses

A Career Role in this instance will have several Career Paths associated to it, which is the only association it can have. But a Career Path can be associated to any of the entities below it, at any level. So you could for example have the following structure

Data Hierarchy Sample

Say you have a Career Path called "Career Path 1", then you could have the following scenario:

Career Path 1 -> Career Learning Program -> Certification Program -> Certification Exam

Career Path 1 -> Certification Program -> Certification Exam -> Learning Asset -> Course

Career Path 1 -> Course

My problem was that I did not know how to create a consistent display style, because if you apply a particular styling to data lower in the relationship, say course, then that styling will apply at any point, where I would have preferred a style that displays at the current index, not its relationship in the data.

  • 1
    Can you give more practical information about what kind of data you are working with? And what you want to achieve with showing this data?
    – Lode
    Apr 11, 2011 at 11:28
  • I would have said a tree view is probably the obvious choice, but without more context I can't say for sure.
    – ChrisF
    Apr 11, 2011 at 11:31
  • 2
    There are several questions already on the site about hierarchical data display. Did you review these to see if any of them answer your question before posting? See ux.stackexchange.com/questions/tagged/hierarchy Apr 11, 2011 at 12:52
  • Depending on your data, Definition Lists can be used to display hierarchy by nesting them, retain their value as DL's, and are easy to put open/close actions on. Depends on your data structure though.
    – Susan R
    Apr 13, 2011 at 22:53
  • Wouldn't a screenshot be appropriate here?
    – user29005
    Mar 26, 2013 at 16:35

2 Answers 2


Other than Tree View, you can try:

Bread crumbs: http://ui-patterns.com/patterns/Breadcrumbs

Or use a Mac like Column navigation (the correct name escapes me at the moment)


You might try something based on the iPad/iPhone paradigm: a navigation stack moving to the right with optionally, a source list on the left side. Would that work?

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.