3

Larger View

Here's a screenshot of something I'm currently working on. I decided to use tabs at the top because filling in the "Office Details" is just as important as the list of employees and because in the future it could expand into other tabs, such as "Stats" for example.

The Details tab includes information that will be used to create all kinds of CSV reports, but once it's completed at the beginning of the year, it doesn't get accessed as often.

My problem is that the "Period" and "Filter" inside the sidebar, as well as the "New Employee" button at the top only affect the "Office Employees" tab. The "Other Offices" list is useful for both.

I tried cramming everything inside that tab, the period and filter as selects above the table of employees, but it just didn't work.

Any ideas on how to get this layout to make more sense?

2 Answers 2

5

You could make the tab-container as wide as the entire page, and put the column inside the tab (in the shape it is now). Then you can make the content of that column to only contain the items relevant to the tab it is in:

  • Period, Filter, New Employee, Other Offices are shown in the Office Employees tab.
  • Only show Other Offices in the Office Details tab.

A wireframe of this solution

0
0

First of all the suggestion of Kim Does would be good option, but I would like to suggest another one.

Blockquote I tried cramming everything inside that tab, the period and filter as selects above the table of employees, but it just didn't work.

I've tried in the mockup below and in my opinion it is possible to fit in the add employee button, the period selector and the filter.

The add employee button could expand into the necessary form items or even a modal screen. The trimester can be selected in the top right.

And a simple text based filter just below the table header (I would recommend to add a header to your table)

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Switching tabs would keep the office selection the same and the sidebar would be more of a navigational bar to select an office with the tabs as a details view for the particular office

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.