Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

All tables on my app look like sh*t, it's making me lose hair, I've been trying to make them look better but I end up making them look worse, do you have any examples of nice looking tables? preferably with lots of rows and a fair amount of columns.

share|improve this question
    
    
And another collection from Noupe 2009 –  Roger Attrill Sep 20 '11 at 9:53
add comment

closed as not constructive by JonW Mar 9 '12 at 18:28

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.If this question can be reworded to fit the rules in the help center, please edit the question.

3 Answers

I highly recommend this article: Designing with white-space: why 1+1=3

Abstracting away his own blog's layout, he has a very good point.

share|improve this answer
add comment

I've added a couple of collections as comments at the top.

Connie Malamed who Wrote understanding graphics wrote a popular article about designing effective data tables which I helped explain through visualization and examples in my own somewhat lengthy resource on Effective design of data tables. Connie's original article is here.

The points made in both our articles may help you understand how to make your own tables look better rather than worse, by considering what is important to show and not to show. In particular, the Gestalt principles of design and whitespace are key elements of a good looking table.

Here's a summary of the design tips:

  1. Meet the audience’s expectations
  2. Order data to match the purpose of the table
  3. Remove clutter
  4. Create a visual hierarchy
  5. Round numbers and avoid questioning
  6. Perform calculations for the user
  7. Provide consistent appearance
  8. Align
  9. Separate figure and ground
  10. Reduce number of columns
  11. Make comparison easy
  12. Group similar data
  13. Make effective use of the grid
  14. Highlight the important values
  15. Provide a brief verbal commentary
  16. Use the white space
  17. Use meaningful labels, and manage headings
share|improve this answer
    
+1 Thanks for great reference –  Jitendra Vyas Sep 20 '11 at 11:28
add comment

Not the answer you're looking for? Browse other questions tagged or ask your own question.