using modals for inputting data into a table

Question

I have an interface and the central part is a data table of objects with various attributes.

Above the table are various functions that allow the user to perform functions such as editing something in the table or adding new values to the table. Fairly standard stuff.

For lots of these interactions and because the data input is minimal we use modals eg 'create new entry' will be a small form with the fields needed to create a new entry in the table.

Someone suggested loading a new page with just the function form but this makes little sense as it totally tears the user away from their context; a modal may well block out parts of the interface but it doesn't remove them completely.

Another option would be a panel rollout but we're not sure where we can fit these in the layout without moving parts of the table around and may disorientate users.

A colleague hates modals with a passion and will hardly ever use them.

My question For interactions on data tables how do you design for functions that manipulate the data table?

Answer 1

Allow the direct creation of table rows

This is a complicated suggestion, but it's based in our (my team's) hierarchical approach to designing interactions like this i.e.

1. Inline editing - If it's possible to edit/add live or in place, do this.
2. Modal dialogs - If the interaction is more complex than can be comfortably contained in place (e.g. in a table cell), then move into a modal.
3. New screen - If a modal doesn't work, e.g. because the interaction has multiple levels/steps, create a new screen.

In your case, I would consider allowing users to "Add Row" or "Add Item" and present them with a new editable table row, as demonstrated in the first table on this page http://marvin.ndevrstudios.com/#/tables-editable