There exists a narrow table listing about 250 customers in alphabetical order. Each row contains the customer's name, account code, city and state.

I need to indicate in each row if the customer account has been edited and whether 2 pieces of data have been filled out (say for example the 2 pieces of data are annual sales and the industry the customer serves).

Space is at a premium and I don't want to add a lot of noise to the page. A salesperson needs to be able to quickly scan the list and determine which accounts need to be updated.

Currently the words 'updated', 'sales', and 'industry' appear on each row in red or green depending on the situation. I feel this is bad for page noise, space and colorblindness.

link|improve this question
2  
Could you show us a screenshot or mockup? It'll be easier to comment on page noise and space that way. – Rahul Sep 1 '10 at 6:47
feedback

3 Answers

up vote 5 down vote accepted

First of all, you should never use red and green to differentiate between things, since that is the most common type of colour blindness.

To indicate if a row has been edited, the text could be displayed in a different colour than rows that have been edited, with the unedited rows emphasized (ex. medium-grey for edited and black for unedited). Doing this will already reduce the width of the row text.

To indicate if the two properties have been edited, you could have a small icon representing each instead of the full text "sales" and "industry."

link|improve this answer
+1 for using the unread email convention. – Ryan Shripat Sep 1 '10 at 18:04
feedback

What's the goal of the page? Listing customers in alphabetical order, or scanning customers for updated/sales/industry? If the latter, throw out the alphabetical ordering. Or add sort options to the page. Then create a grouped variation of the table that groups by each of the needed attributes. It could look something like this:

- Customers ------------------------------------------
------------------------------------------------------
Code | Name              | City            | State   |
++++++++++++++++++++++++++++++++++++++++++++++++++++++
Updated
++++++++++++++++++++++++++++++++++++++++++++++++++++++
011  | Vidbot            | Dallas          | TX      |
212  | Rahul             | San Jose        | CA      |
++++++++++++++++++++++++++++++++++++++++++++++++++++++
Sales
++++++++++++++++++++++++++++++++++++++++++++++++++++++
187  | lori.lee          | Boston          | MA      |
etc...

The table will be more scannable for the purpose you're describing, and you won't have to use icons, colours, or typography weight to accomplish it. All you need is a sort option control somewhere. Since page state would be pretty binary in this case (either grouped or alphabetically sorted), you could try various controls, like a check box or a hyperlink. I would advise against a dropdown menu, though - for just one option it's a bit superfluous.

link|improve this answer
Thanks - this will likely be rev 3 of this page. – Vidbot Sep 1 '10 at 7:18
feedback

It is a common practice to use a pencil icon to mark things that have been edited. You can add a small icon at the beginning of the row of the lines that have been edited.

link|improve this answer
1  
It's also common practice to use a pencil icon for buttons that allow you to edit things, though. I think there would be potential confusion in this case. – Rahul Sep 1 '10 at 12:34
@Rahul Good point. – Sruly Sep 1 '10 at 13:44
feedback

Your Answer

 
or
required, but never shown