2

I am designig a SaaS product and it has a table that is mixing different types of data.

It's a sort of register that lists all customers' assets. It provides a ton of value to the users, giving them a bird's eye view of everything that their org is operating.

The table has a lot of very common columns – name of the item, type of item, when was it discovered – total of 5 columns that are quite simple and common.

The thing is, the table is actually mixing data from 20 different sources. Each source has its own type of data – for example, some assets are physical, and some are digital. Users want to narrow down these results to see each type on their own. When they do this, in addition to the 5 original columns, there are 2-4 new columns that are unique to each item type that we can display.

What I am struggling with is how to properly design the UI for this workflow. The product predates me, and when I joined the pattern was already established, through a UI component that looks like a second navigation panel.

Essentially there was one standard navigation panel on the left, with a list of dozen or so pages, and inside the work area, they were showing yet another smaller navigation that was listing all asset types. The first choice was All Types, and then it listed all 20 types of assets below. It had its own scrolling, filters for each type, etc.

Right after I joined, this pattern was being changed, and this time it was presented as a large dropdown at the top of the table. I had some influence on how it was designed, but that decision was very rushed.

Now I have some time to properly design this page, but I am not sure what is the right way to do this. Here are my options:

Option 1) Keep it the way it is. Big dropdown on top, user changes type of items they view, it adds a few columns to the table and introduces unique filters for this item type. When user changes the selection the filters are reset, columns change. It kinda works but honestly feels really weird and is not a pattern I have seen before.

Option 2) Bring back the second navigation. Logic for resetting filtering stays same as above, but it sets better expectation since it's almost like you do navigate to a different page.

I do not know of any other option that might work here, and this is where I would really appreciate your advice!

1 Answer 1

1

I think your gut feeling about adding new columns to a table upon changing a filter are correct, that's not a common pattern and it breaks some heuristics around consistency and acting like a regular table pattern.

Something you might look into is tabs for the most common views. You could have an All Operations tab that shows the table as you describe above, with info from all 20 sources. Then, you could show something like a Physical Items tab that pulls up a table that's optimized for the physical items view, with their special columns. Same with the Digital Items, etc.

In SAAS, it's common for users to want to access the same view every day, and not want to click the same filters each time they look at their table. So, you might also want to allow each user to create a custom view and save that as a default tab as well.

1
  • 1
    Thank you for the reply (and for editing the typos in the post, I appreciate that). Around 6 years ago I've built a SaaS product that was an aggregator that had a tabbed view for most of the tables. In my current case, each of the 20 sources however has unique columns. Some of them have two or four, most have 3, but all are unique and never repeat. If I do introduce less granular groups, I will still not be able to add new columns into the table. I will try to explore this idea however, thank you. Commented Dec 5, 2023 at 16:27

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.