3

How can I represent the changes between two rows of a database similar to the split diff of GitHub?

Context

I would like to visualize the changes made to a table which are happening over time. For instance, LHS would be the table from one week ago and RHS would be the current value of the table.

Since there can be a lot of changes and showing all the changes at once can be overwhelming/confusing. Hence, I want to show a condensed version of the changes as shown in the first image. If the user clicks on View All Changes button, I want to show all the differences between the rows.

Problems

The main issue is the identification of each row. How do I convey to the user which row's difference they're viewing? For now (image 1), I am showing all the columns of the row with a limit on the max string length after which it shows '...' and on hover, it shows the entire string (just like Chrome's network tab does). Not every row has an ID (or row number) or primary key so I can't just use that.

condensed row diff

Secondly, the difference is calculated for each column in a row. Once the user clicks on view all changes, how do I represent column wise difference? Currently, I am doing it as I have shown in the second image using a modal/popup.

complete diff once the user clicks on view all changes

  • Not sure I understand the question or what's happening in the table. Can you give some background info and walk us through a use-case (describe the situation, what the user is trying to accomplish) and how that relates to the table? Thanks! – Nicolas Hung Dec 19 '18 at 15:20
  • I have edited the question adding more context. – Anirudh Sridhar Dec 20 '18 at 7:41
  • What's the who and why for this feature? Before looking at the how. – DarrylGodden Dec 20 '18 at 9:17
  • I would like to visualize the changes made to a table which are happening over time. For instance, LHS would be the table from one week ago and RHS would be the current value of the table. – Anirudh Sridhar Dec 20 '18 at 9:24
  • As Nicolas said, I'm struggling with the use case here, so, assuming the data is a reflection of what you're trying to do, you want to see a history of user's username changes? – DarrylGodden Dec 20 '18 at 13:44

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Browse other questions tagged or ask your own question.