This image was making the rounds a few months ago on Twitter and I thought it was worth sharing. It’s an animated GIF, so I’ll just put up the link so you can watch it from the beginning (and read this post first without something flashing all over your screen).
It shows a cluttered graph being visually simplified to great effect. I personally think the simplifications go too far ((I’d stop around the moment they completely remove the horizontal lines)) —as do many of the commenters—but the point is a good one.
By removing some graphical information and lightening much of the rest, the graph improves its “visual hierarchy” or
the order in which the human eye perceives what it sees. This order is created by the visual contrast between forms in a field of perception. Objects with highest contrast to their surroundings are recognized first by the human mind.
Visual hierarchy is a powerful concept and one I apply to every design I do. The “visual” contrast” referenced above ranges a wide variety of attributes, including size, color, font, font-size, positioning (top > bottom, left > right), and motion. The more information your want to communicate, the more important it is to have a good visual hierarchy.