Which design pattern is the best option for drilling down into data?

Question

I have quite a large dataset which I need to display to end users. These data are grouped by super group, medium group and junior group. Medium groups are children of super groups, and junior groups are children of medium groups.

Each group has it own actions, such as add and remove - in different groups, these actions have different meanings. For example, add in super group means "add another super group" but in a junior group, it means "add another junior group". The scope of these actions gets smaller depending on the group.

I've thought about using the accordion pattern, allowing the user to drill down through the groups of data and at same time keep all information on the screen. Then I worried about performance (heavy loading, response times) and specially the positioning of these actions. I'm trying to avoid having to open a new page every time users drill down a level.

Does anyone know any good UX patterns for drilling down into datasets?

What I'm looking for is a solution that is:

• Easy to use
• Quick to navigate
• Gives end users enough data on the screen

Answer 1

Drilling down datasets - this is the tree pattern.

The extended version of it is the Tree-Table

Depending on the length, you could also use Cascading Lists

On mobile, usually one-window drilldown is used.

If the add action means the same for all three (Add <object in question>) then it's fine. If you have truly different actions, differentiate the verbs as well, eg. Add vs Create.

You don't have to reinvent the wheel.