3

We have large hierarchical data which we would like the users to allow search on. The problem we are facing is in displaying the results. The search results can occur at any level and we would like to display the hierarchy until when the hit happened.

For ex.: Person -> Address -> Phone

This is a three level hierarchy and each can have multiple fields. The problem with nested tables is that there will be several misaligned columns for each level and it looks clumsy.

Also each level can have siblings.

Any ideas for better visual representation and navigation will help.

enter image description here

Improve this question
4
  • Welcome to the site, Sairam! Can you tell use a little more about what you have so far? Perhaps a link to an image with some ideas you've thought of could help to structure the responses.
    – Graham Herrli
    Commented Jan 29, 2014 at 23:54
  • For starters, you might see if you can simplify the hierarchy to two layers. In the example you give, Phone could be an attribute of Person directly.
    – Graham Herrli
    Commented Jan 29, 2014 at 23:54
  • Right now we display only the root level as a single table. But we want to display more data where the actual match is. Also, the number of levels or the type of data (eg. phone) is not fixed. And we want to show each level separately.
    – Sairam Sankaran
    Commented Jan 30, 2014 at 0:30
  • 1
    Added the data we want to visualize
    – Sairam Sankaran
    Commented Jan 30, 2014 at 0:41

1 Answer 1

Reset to default
2

Short answer
Don't try to replicate database schema in the user interface. Provide information in amount and form which allows to reach user's goal in an easy and efficient way.

Avoid information overload, but be sure it is structured and complete enough to make some decision. The card view with highlighted elements, which match search terms could be a good option.
enter image description here

Long answer
Search behavior includes several stages:

  1. Goal setting
  2. Query formulation and execution
  3. Assessing search results (relevant on non-relevant)
  4. Switching to some resource (or return to step 2)
  5. Task execution to reach the goal

You have a problem at step 3, how to represent information. Thinking more broad, you goal is to represent information in a way, which allows quickly find relevant records.

So you should decide, what are the criteria of the relevance. In other words, what data have sense for user, what set of attributes defines the entities of your subject field.

It seems, the entities in your system are persons. So you could build search results in person-centered way. The good approach for it is card view. You need no reflect internal database structure into user interface, instead build it around user tasks.

Improve this answer
1
  • Hello Alexey, You brought out some good points about not replicating the schema. I agree on that. We have a problem though. Unlike a consumer website, we are building a web application in which users can create their own schema and view the results. So we do not know in advance neither the schema nor the type of it. Hence we want to come up with a generic UI for any kind of hierarchical data.
    – Sairam Sankaran
    Commented Jan 30, 2014 at 18:12

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.