1

I am working on complex system with lots of tables; some with only few columns, some with many (~15+).

With consistency being one of the usability principles and generally encouraged in UI world, I am struggling to decide what is the best approach to add new records and edit records, considering I have tables with different sizes.

Currently, we do the following:

  • INLINE row for 'New record' / 'Edit' - Table has 6 columns or less
  • MODAL FORM With a background, it covers the table when creating a 'New record'. The table consists of 6-15 columns.
  • NEW PAGE FORM for 'New record' / 'Edit' - Table has 15+ columns or has more complex flows / supporting flows within records

My goal is to keep the user on the table view as much as possible, but with larger tables, it's difficult to be consistent and say "we'll only use 'INLINE' or 'MODALS'"- because the content simply will not fit. On the other hand, I don't want to take users to a new page for 4 fields-forms.

Does anyone has experiences how to handle this with consideration to consistency principle?

Or did you try to have different formats for 'New record' and 'Edits' in tables - do you have any user feedback?

Improve this question
2
  • Are your users generally expert users performing these tasks many times a day, or only occasionally adding new records?
    – JohnGB ♦
    Apr 22 at 11:10
  • They are expert users who add and edit records throughout the day.
    – NovaMoon
    Apr 24 at 13:22

1 Answer 1

Reset to default
1

If I understand correctly, INLINE is not a visualization but an action. Therefore, you're left with two options: MODAL FORM and NEW PAGE FORM. Since both involve large tables, it's best to use the one that suits your needs the most, such as NEW PAGE FORM.

However, it's important to note that modals should only be used in certain situations and not as a wildcard visualization for every scenario. They are intended to interrupt the flow and draw attention to the modal content. It's possible that your use case requires a modal, but it's essential to consider whether it's the most appropriate option.

Additionally, you mentioned the modal "appears on top of a table," which suggests that you may be using it for editing purposes. In this case, it's recommended to have a NEW PAGE FORM and allow editing to be inline. This approach is commonly used by most sites that deal with tables.

Of course, I'm just guessing by your words. If you could provide some examples of your specific use case (screen captures, mockups or wireframes), it would be helpful in providing a more accurate answer.

Improve this answer
2
  • Thanks @Devin ! For INLINE, i mean editing within table row without leaving table view. Something like in this design system: patternfly.org/v4/components/inline-edit/design-guidelines MODALS are forms like in the example on nngroup.com/articles/data-tables Continuing in 2nd comment due to space limitations here.
    – NovaMoon
    Apr 21 at 5:53
  • Users often need to enter new records into tables, but they also need to edit those records. I am trying to create a consistency with doing this, but as mentioned, issue is that some tables are very small, while others are large. I agree modals are disruptive, but I feel that taking them to a whole new page form to enter a new line into a table could be seen as even more disruptive - let me know your thoughts.
    – NovaMoon
    Apr 21 at 5:53

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.