3

I have a table with a bunch of data in it that needs to be reviewed by a manager. The requirement is when they review a line of data (ie, a customer order), they can click something to indicate they've reviewed it. This wouldn't be a problem if I weren't already pressed for space, I'd just add a dedicated column for "approval" and be done. But I am pressed for space. This is also something that once it's approved has no bearing on the data, so it's not important for it to be included once a row is approved.

I'm trying to think of a creative solution for solving this in the best way without having to add an extra column. It can include changing colors of cells, rows, hovering effects, whatever. I'm just looking for ideas.

Some ideas I had:

  • Have the row be a slightly different background shade to indicate "unapproved". Hover over the order number (first column) to display a box that has an "Approve?" button in it. Clicking would change the row color back to normal.
  • Put a clickable icon (exclamation point?) in front of the order number. Clicking changes it into a spinner while it talks to the backend and when it's successfully approved, turns into a check and then disappears.

Here's what the table (mostly) currently looks like: enter image description here

Improve this question
6
  • Jason, could you include some screenshots or mockups of your application as it stands? It could help us understand the constraints on your design.
    – Jimmy Breck-McKye
    May 27, 2012 at 13:16
  • @JimmyBreck-McKye I've added a screen shot of the table
    – Jason
    May 27, 2012 at 19:55
  • for now i've decided to double click an unapproved row to approve it. unapproved rows will be a different background color.
    – Jason
    May 27, 2012 at 22:17
  • I'm not sure I'd recommend that solution. It could be difficult to discover the action. Also, you don't want to be playing with row colour when you've already given meaning to cell colour (like red for debts to be paid).
    – Jimmy Breck-McKye
    May 27, 2012 at 22:27
  • Also: does a reviewer need to see all the data upfront? You could just build a separate 'review' workflow with optional drilldowns (eg details on hover / select).
    – Jimmy Breck-McKye
    May 27, 2012 at 22:40

4 Answers 4

Reset to default
2

It seems like you are already using color to indicate a variety of things. I would suggest something different. Can you have the row text all appear as bold when it is unapproved? Can those unapproved rows be sorted to the top by default?

As for the action of approval, I think it depends on your audience and requirements. For simplicity's sake, I would suggest a double click... but that is not very discoverable. Perhaps instruct them to click on the order number for the row (first column) to open a popover dialog?

Improve this answer
1
  • bolding all the text in the row is a fantastic idea as well. i have also implemented double click (there's only one user. i showed him and he liked it, i'm not worried about discoverability). i ended up using RGBA colors with slight transparency and then changing the lower-most layer to a slightly darker shade to indicate "unapproved" state
    – Jason
    May 29, 2012 at 18:52
1

Perhaps it's not obvious enough for first time users, but I think that having the whole row clickable and changes colour to a light green when approved so it's not too offensive when the whole table is approved is the way to go. Then there's a nice large area for the manager to click on to approve the row, and it's obvious the row has been approved.

Improve this answer
3
  • that's not a bad idea. i do have some links in the row, though (sorry, i forgot to mention that in my question) that link to the forms, so it's possible the user could click those to try to verify the info first. also, don't worry about the audience, it's a very very narrow audience that will be trained (this is an admin tool).
    – Jason
    May 27, 2012 at 8:22
  • Each row could have an accept row below it, with a lighter border between it and its corresponding row above than between the next row below
    – icc97
    May 27, 2012 at 16:11
  • ooo that's a really good idea, actually
    – Jason
    May 27, 2012 at 19:56
0

I would add a small column at the far left or right that shows a checkmark when the row is approved, and use a single click to toggle the approved/unapproved status. There are too many colours going on in there to add another to indicate approval, though you could dim an entire row when it's approved to let attention jump to the next row with more clarity.

Improve this answer
0

Another option is to add filter control to the page to show reviewed/not reviewed/etc. User clicks a filter and the table is updated to show appropriate records. You could also consider giving option to the users to customize which columns they want to see; it could free up some space for an extra column. A benefit of extra column is that you can sort.

Improve this answer

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.