Over the years, I’ve seen and been a part of a lot design work—both on the web and in other mediums. Some of it has been great, and some no-so-great. Lately, I’ve been interested in pinning down exact attributes that great design work usually embodies, separating it from less effective designs. One hallmark attribute keeps come up time and again: subtlety.
High-quality, professional work usually bears a distinct ability to be subtle—to show restraint, and avoid garishness. That’s not to say, of course, that this work is boring. Instead, it is impactful and compelling without being overt.
Take a popular visual effect, for example: the gradient. Both professional and hobbyist designers love them some gradients. But look closely, and you’ll probably find that great designers tend to use them in moderation, and with great care. You’ll find blends between two very similar—almost indistinguishable—shades, rather than gradients that go from, say, a dark green to a light green. The result is an effect you can feel moreso than see.
The same thing is seen with the drop shadow. Whereas amateurs often make the mistake of using very heavy shadows, more experienced designers are likely to produce barely-noticeable effects that create a sense of depth and dimension without drawing attention to themselves.
The subtlety seen in great design work doesn’t just apply to fancy effects, either. Subtle differences in text color can be very effective at conveying meaning and hierarchy. Every-other-row stripes in the background of tables and charts are often times barely noticeable when employed by great designers. Rules and other lines make be used in very subtle ways. All of these elements are important and functional—but they don’t need to be overt in order to do their job well.
While Edward Tufte’s work is more in the realm of information design and visual literacy, one of his defining principles can apply equally well to graphic design: smallest effective difference. “Make all visual distinctions as subtle as possible, but still clear and effective.”
I rely on this quote a lot in my work. I often ask myself, “could this be more subtle?” I’ll endlessly tweak opacity sliders, color wheels, and stroke properties in an effort to find that perfect place where a design element achieves both effectiveness and subtlety. I focus on trying to create distinctions that are felt, more than seen.
Give subtlety a try, and you may find your work stars to show a new sense of elegance and reserved impact.
Hmm, I should read more Tufte (and Croft). Good stuff :).
I think a great example of subtlety in web design is in the hover (and sometimes active) states of a link or button. A great rollover is often the most subtle of changes and it really can add a lot to a pages feel.
That’s a great example, Cooper. Wish I’d thought of it for the post. :)
I dunno.
Couldn’t it be said that “subtle” just happens to be in?
I think the difference between amateur designers and professional designers is that amateurs work from today’s design fads and create work that is dated before it’s even finished, and professionals create designs which won’t go out of style as soon as today’s fad is tomorrow’s passé.
And, again — it does really depend on what you’re designing for. Design must service something, and sometimes “subtle” isn’t called for. I think what you’re going for is the age old “keep it simple, stupid” concept, and — sometimes design shouldn’t be simple.
Would you call Apple’s latest iPod commercials subtle? (The old ones were, with the black on white silhouette with the human figures having very subtle aspects pop through the black — a bracelet wouldn’t be in silhouette, for example.)
But, the new ads are mishmashes of clashing color and vibrancy and urgency and as that has changed, the music they choose for the ads have changed (jazz influences) and they seem to be anything but subtle. They’re still really great, though.
I think what you mean to say (or what you should say if you don’t mean this) is that professional designers know WHEN to be subtle.
Brian, I actually think there’s a lot of subtlety in those iPod ads.
In the latest one, the dancers’ silhouettes are slightly transparent — very slightly. A lesser designer might have made them much more transparent, in and effort to say, “check it out, they’re transparent!” Instead, it’s an effect you don’t really notice, but it adds a nice softness you wouldn’t get it it were fully opaque. Throughout, they are exploding shapes in the background — usually floral shapes — that are just barely visible. They are a feeling of motion, even though you can just barely see them.
I guess what I’m saying is: it’s not that the overall end result needs to be subtle. It’s that individual elements and effects are often used in very subtle ways to covey an emotion, rather than say, “look at me, I’m a cool effect!”
Subtly is good, it’s great! :)
I know exactly what you mean about the iPod Jazz-themed TV commercials…it’s why I like them!
My only problem is that when I do it, no one notices…no one says “Oh I liked the way you included that faint shadow there,” or “I think that is great how you colour-faded that list bullet,”….and that can get quite disappointing. Other designers might spot those subtleties and appreciate them - but most people won’t - and sometimes that extra effort merits some recognition too.
There are some other, broader features that separate amateurs from professional as well: most noticeably layout, use of layout, and use of white space. Another thing is typography and the care taken in selecting appropriate typography that works well with the design (amateurs normally stick to fonts they are used to - Verdana, Ariel for example). Also, if images are used - ensuring that they are a high-quality resolution and not pixelated through over compression. Take for example, the ‘Blue Flavour’ logo - if it had just been made with a low-res GIF image (instead of the PNG file) then the veins in the leaf wouldn’t show up too well at all….a subtle detail, sure, but it makes a difference.
Well, I wouldn’t let that bother you Matt, if they don’t notice, it means you’ve done your job. The whole point of subtlety is to design something invisibly.
Good design doesn’t really call attention to itself.
(Unless it needs to.)
But, the Blue Flavor leaf is a good example: There does appear to be a gradient in the upper leaf from light blue to a highlight-y white. What makes it “good” is that it’s used just right to provide that natural highlight you see on the edges of objects. You wouldn’t get that if you used a light blue and then a JUST slightly lighter blue. In this case, it needed the sharp contrast — but the gradient is smooth and it becomes “white” in just the right place and in just the right amount.
I guess the larger point I wanted to get across in my first comment is that I’m wary of ever saying: “Pros do this, amateurs do this.”
Because, as soon as we say that, it turns out that there’s a need to do “that.” And, to me, the mark of a pro is knowing when “that” is necessary, even if its a little unconventional.
So, put another way:
Professionals don’t do anything unnecessary.
Superfluous is the enemy of good design.
“Professionals don’t do anything unnecessary. Superfluous is the enemy of good design.”
Well-said, Brian.
The thing I’ve seen that shows a clear distinction between the professional and the amateur designer is the ability to understand and explain your work. To not only be able to defend your work, but to properly articulate it. There is a difference between making something good and being able to explain why it is good. We just had a great discussion on this topic at BarCampDC last weekend; it is something I call <a href=”http://blog.marylandmedia.com/2007/08/logic-based-design-design-is-50-selling/”>Logic Based Design</a>
I think much of this post can be summed up like this:
http://www.flickr.com/photos/urbandude/243387174/
Subtlety is something I have personally used to help project-manage the purchase of websites. When you look at a new designer’s website, you get a feel for what they are capable of. Each of their portfolio pages/sites and any google results all add to the overall picture of what a particular designer can do by telling you what they have done.
One of the distinguishing features of a brilliant designer is a subtlety in the appearance of their designs and layouts. This is not always just in effects, either. Rather, it is in the entire ‘feel’ of the site. How is RIA or blogging software integrated? How is content presented? Why is this navigation easy? These are all aspects which benefit from sublety.
Thanks for this article, it seems to summarise perfectly!
good article, problem is that people think that because of DreamWeaver and other WYSIWYG editors along with graphic programs anyone can become a graphic or web designer..
A very good article indeed. I too feel that subtlety can turn amateurs into professionals, but I don’t really go out of my way to be subtle on purpose. It just sort of happens and that’s what makes a professional good at what he/she does.
There are too many styles of design.<BR> If you design site for some “game-site” you should make a lot of detailed graphics.<BR> Like example you can look at the <a href=”http://www.worldofwarcraft.com/”>War Craft</a> site. You can say that there are lots of unnecessary things. But this site was made by Professionals. Be sure. And I think that you can’t say that this site is “subtle”. So my think is: style of Design depends on targeted audience.