2

I have tabs where I separate data and where it is possible to create a new entity.

For example, I have three tabs: Items, Users and Attachments. User can create new item, user and add a new attachment. Currently I have a new section heading with action button. After section heading, there is usually a table.

Is position of action button good and is the total count is redundant (it is shown in tab and section heading)?

Are there better options than the current solution?

First Tab

Second Tab

2 Answers 2

1

There different options, but it is not possible to determine which option is going to be the best for the user without more information and context.

Based on the interface design shown, you can also have a "Create New" call-to-action or button and allow the user to select what they want to create, and then present the approach view or page.

You can also have a "+" icon next to each of the entities that allow the user to trigger the specific create function without selection on a tab first.

These are just some potential options but there's no real way to decide which of the options are better. It is best to look at your design system and create patterns that provide a more consistent user experience.

The display of the total count is redundant, but often redundancies are introduced to cater for different needs or requirements. If you don't find that the users need this redundancy, then you can certainly remove it because the position and presentation of the two sets of information doesn't appear to add a lot of extra benefit.

2
  • I understand. I my design system, "Create new" button is always placed at the right side of the screen. The problem I'm having is that there will be empty space on the left between the tabs and the table if I remove the heading and total count.
    – Marko Kos
    Commented Nov 16, 2023 at 7:53
  • @MarkoKos that would suggest to me that in your design system, the hierarchy of layout and components is missing something, like a heading or title for pages or tables that you are duplicating an item count for.
    – Michael Lai
    Commented Nov 16, 2023 at 22:09
1

The totals on the tabs are important and useful, I think, because they indicate to the user whether there is something to be seen on the tab at all.

Whether you repeat the totals on the table header depends on the design system (e.g., Google Material Design) you work in: If it calls for separate table titles in cases like this, and it recommends the totals in the table header, the redundany does not hurt. But if the table is the only information on the tab, you can think about removing the redundant table title completely - it's not only the count which is redundant.

Placement of the buttons also depends on the design system: It might define a "table toolbar" where actions on the table (and its rows) are placed. Whether the far right position is a problem (in terms of discoverability as well as in terms of mouse mileage), depends a lot on the data in the table (we have no indication on the number and width of columns) and whether tables can shrink when their data is not as wide as the page. The other obvious place to put the create function is at the end of the table - either as a single left-aligned "Create" button or as an empty editable table row. Whether the top-right or the bottom-left (relative to the table) placement is good also depends on the users tasks: Do they need to enter many new items, or is the create function infrequently used?

As Michael already wrote, there are many alternatives, and you can refer to guidance from your users (actually ask them by testing a prototype!) and their goals as well as the design system you work with.

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.