3
May

Contrast is King

by Trine Falbe in Creativity, IxD, Webdesign

This post is inspired by two tweets made by a former students at The Nordic Multimedia Academy, Maarja Jullinen.

Maarja tweeted:

“of seeing all the “10 tips to better design” articles. Why, fellow designer, can’t you write something else? I’ll read it, I promise!”

“Don’t promise me no tips unless it’s an actual tutorial. While I realize ‘breaking it down’ is a marvelous idea, it does make my eyes bleed.”

I think Maarja hits the nail right on the head. The “10 tips” lists are often full of generic tips like “know your graphic design history”, but they’re not directly usable.

Which is why, in this post, I will set out to do just that: Give one piece of practical advice to help you make more beautiful interfaces, graphic designs, presentation slides or whatever kind of design you work with.

So what is the single most important element of a good visual design? In my humble opinion:

And if you think contrast only relates to color use, you really should continue reading. Contrast is so much more.

So why is it so important, you might ask. Well, because contrast creates interesting, intense visual experiences full of surprises, and ideally, delighters.

Contrast is more than contrast in size, color or decoration. You can also work with contrast in shape, positioning and density. And if you’re working with animations of any sort, think contrast in pace and timing.

The most recent thing I’ve designed is an entirely new slideshow for my presentation of the Academy where I teach. I thought about the contrast in every single slide, and it makes a world of difference for the visual experience.

But enough words – let me show you what I mean.

Contrast in pace and timing
Notice how the word “color” has a different color, but more importantly, fades in with a slight delay. That subtle contrast in pace interrupts the monotone rhythm of the animation and makes the viewer re-focus.

Contrast in positioning
Notice how the headlines have been positioned differently in every slide to create movement (there are several visual slides in between the headline slides, but it’s still a great way to create a dynamic feel).

Contrast in density
Here I’ve left a little bit of white space on the left to create an interesting contrast between the blank space and the saturated part with the image.


(Image on the slide courtesy of Leonardo Reyes LeRe Pics, http://www.flickr.com/photos/lere/3585919370/)

Learn from a master
As you have probably guessed by now, I absolutely adore huge typography, especially becuse of the contrast it provides to the design.
Just look at Trent Walton’s fantastic article design:

Trent Walton is a master of contrast. From density to placement to color to size, Trent does it all. Just try browsing through his articles and you’ll see my point. Every article has a different design, many of them unrecognisable to each other.

So go ahead, be bold and add a spoon full of contrast to your next design. It’ll be worth it.

No Comments

 

Switch to our mobile site