How fine is your design?
Written byEthan Marcotte. 4 comments
About Ethan Marcotte
Skip to the article
Ethan Marcotte is a respected standards authority who hails from Cambridge, Massachusetts. He is a senior designer at Airbag Industries, a design consultancy that has enjoyed working with such clients as the Sundance Film Festival, New York Magazine, and the World Wide Web Consortium.
The line between a successful design and a clever one is fine. Are you willing to make the ultimate sacrifice and hit the delete button on that work of pure genius to give the client what they want?
You sit on a grassy hillside, a few friends on either side. A sweeping valley spreads itself out before you, a bowl of deep greens and browns set against the cloud-flecked summer sky, a warm breeze rustling the treetops and your hair, the grass wrapped through your fingers. The view, the day, the experience is nothing short of perfect, and you close your eyes in the warm summer sun – you can’t be sure, but you’re pretty sure your friends close their eyes, too.
And then you pull out the chips.
The bag doesn’t open easily, and the crinkling breaks the calm like a skater through thin ice. After a few seconds of noisily tearing through the foil, success at last: you pop a few chips into your mouth, crunching loudly as the onion flavouring does ungodly things to your breath. Still, you couldn’t care less what they do to your breath, much less your overall health – they taste amazing, and you’re not above licking your fingers a bit to get at the last bits of savoury flavour.
The third or fourth time you shove your now-greasy fist into the bag, you realise your friends’ eyes aren’t closed anymore: after your impromptu snacking fit, they’re staring at you with equal measures of annoyance, shock and disgust. The view, the moment, the experience you shared – gone. And all for a few handfuls of salted starch.
Still. They did taste amazing.
To whom does design address itself: to the greatest number, to the specialist of an enlightened matter, to a privileged social class? Design addresses itself to the need.
— Charles Eames
Dispensing some wry advice to a young pupil, the writer Samuel Johnson once quipped, “Read over your compositions, and where ever you meet with a passage which you think is particularly fine, strike it out”. Now, most readings of the quote focus on the wonderfully sarcastic contradiction in the sentence: that your favourite passages should be the first on the editor’s chopping block. But the larger, more serious question is one of intent, that you should avoid keeping anything “which you think is particularly fine” in your final draft.
Granted, Johnson was speaking of the written word and the importance of editing – and in all likelihood, he was just trying to rid himself of a pesky admirer – but his advice resonates with designers. Whether designing a site, an application, even a single web page, the success of our work is measured solely by how well it meets the goals of its users; as Eames said, “design addresses itself to the need”.
Sounds easy when he says it, of course, but the rest of us mortals know what a balancing act it can be to create something at once aesthetically pleasing and intuitive.
The costumes had to serve the choreography.
— Colleen Atwood
My first “real” encounter with the internet was in the mid-1990s, when I moved off the dial-up binges of local BBSes in northern Vermont and on to the wider web afforded me by my college’s T1 line. Faced with actual bandwidth for the first time, I was like a hyperactive kid in a candy store, devouring URLs and tutorials as fast as my copy of Netscape 3.0 Gold could download them.
Dreamless Stuidos
An inspiring “design collective”
One of my earliest design heroes was Dreamless Studios, a design collective formed by Eric Dinyer and David DeCheser. Spanning multiple media, from illustration to interactive design, broadcasts and books, their portfolio was a perennial favourite of mine. An amateur designer such as myself found a lot to love about their work. In those early days, most of my online efforts were pretty feeble attempts to ape the elements of their work that inspired me most – the tension between sweeping, textured ornaments and tightly set bitmap fonts, the richly saturated palettes.
Dreamless Studios
An entry in Dreamless’ web portfolio
A few weeks ago, while beginning work on this article, I rediscovered links to a few favourite sites from that era, including Dreamless. Reacquainting myself with old, forgotten sources of inspiration was tremendous fun, though it’s interesting to see the difference a decade can make in your tastes. Much of what I admired during that era skewed to a focus on aesthetics, rather than their users’ needs.
Dreamless Studios
The Dreamless store
For example, in the Dreamless store, where one can purchase products that feature their design work (and presumably earn them a slight referral fee from Amazon), much of the navigation is custom-designed, JavaScript-driven scrollbars—which, while snapping attractively into the rest of the Dreamless site’s aesthetic, don’t actually work if JavaScript is disabled, and won’t respond to the mouse wheel or keyboard.
This isn’t a criticism of Dreamless’ portfolio; years later, I’m still in awe of what they produce. Rather, it’s a reminder that our work is a partnership between designer and user, producer and consumer. Ideas conceived during the design phase need validation not from our own assessments, but from our users, otherwise, we’re just being “clever”.
Hypothetical questions get hypothetical answers.
— Joan Baez
Cuil
The Cuil.com homepage
At the end of July 2008, a new search engine named Cuil launched, claiming to index more web pages than Yahoo, Microsoft and Google combined. Founded by some former Google employees, Cuil was heralded by the tech media as a possible “Google-killer”, a site that could possibly unseat Google from its dominant position in the search market.
Of course three months’ later Google is still alive and well. In fact, Cuil has received no small amount of criticism since its launch, as it often returns incomplete or broken search results – which is, of course, less than optimal for a search engine, much less a so-called “Google-killer”. A search for this author’s own name, or the name of his weblog, returns nothing relevant for pages; searching for “Web Directions” fares a bit better, though random images are occasionally associated with different entries.
Cuil
Cuil places the Web Directions North logo next to the entry for Web Directions South, and the Microsoft logo next to Web Directions North
But putting the current state of the site’s functionality aside for a moment, Cuil’s design is worth discussing. Given its ex-Google pedigree and aspiring competitor status, it’s interesting to note how each of its design decisions seem diametrically opposed to Google’s. The black homepage, the multi-column layout, the faux-frameset layout, incorporating images into search results: taken in total, this is about as close to an Oedipal complex as a site’s design can get. That is, it would seem that Cuil’s design isn’t looking to distinguish itself as a unique entity, as much as it is trying to distinguish itself as not-Google.
Cuil
A client-side “toggle” to change the layout of Cuil search results
There isn’t much consideration shown for the user; the interface isn’t poor, by any stretch, but it’s loaded down with unhelpful elements. One example of this is the column toggle on the bottom-right of the screen, which allows the user to change the layout of the search results from two to three columns via JavaScript. Presumably, this is to accommodate lower screen resolutions, so that users browsing at 800x600 aren’t forced to use a layout designed for 1024x764, and vice versa.
However other, better solutions than JavaScript exist: if Cuil had ditched a table-based layout for a CSS-/float-driven one, they could have come up with a resolution-independent layout that reflowed as the window size changed; or, at the very least, it’s easy enough to detect the size of the browser with JavaScript, and change the layout when it reaches a certain size. Asking the user to do the work doesn’t seem like the most empathetic approach, rather we’re left with an idea that seems borne out of novelty, rather than an attempt to address a need.
Whoever said that pleasure wasn’t functional?
— Charles Eames
A few weeks ago I stumbled across www.bartleboglehegarty.com, which had been recently redesigned. Normally, I rank the all-Flash sites of global advertising firms right next to Darth Vader and tax forms, but BBH had my jaw on the floor. The design is gorgeous, of course, but once I got past the initial visual impact, I found myself returning to the site frequently over the next few days.
BBH
Bartle Bogle Hegerty home page
The BBH homepage is aesthetically striking, to say the least. The sheer amount of white space is almost a design element in and of itself, forcing the eye toward the few items on the page: the sheep trotting casually across the bottom of the screen, the sleek logotype, and of course, the three-dimensional globe spinning slowly in the centre of the page. The most prominent element on the page, the globe is essentially a more stylised version of the text navigation beneath the logo: as the user moves their mouse across the globe, it spins in that direction, with skylines of the different countries gradually coming into view, famous landmarks in prominent relief.
BBH
The navigation text colour changes when the user hovers over a city on the globe, and vice versa
But what saves this element from being just another superfluous, over-designed Flash widget is the way that it interacts with the text navigation above it. When the user places their mouse above a particular region of the globe, two things happen simultaneously: the city is ringed with a particular colour, and its name is similarly highlighted in the navigation above; if the user opts instead to use the horizontal navigation above the globe, mousing over a country’s name will cause it to glow on the globe. To me, this perfectly resolves the balance between art and interface: the user decides which navigation element to use, the three-dimensional globe, or the text links across the top, but the design leaves both models as an option, while subtly reinforcing the connection between them whenever the mouse hovers over a link.
Design is directed toward human beings.
— Ivan Chermayeff
In the end, the line between a successful design and a clever one is pretty fine. Much of our work is based on assumptions, some better researched than others – we create personas, interview our clients, and so on. But in the end, those assumptions need to be acknowledged as such, and ultimately vetted by real-world users. No matter the design element we’re working on, we need to consider if we’re serving our users, or simply being clever.
If it’s the latter, maybe it’s time to strike it out.
Written byKeith Bell on the 18th of January
Quick note: the link to BBH is misformed and the name is misspelled. Should be http://www.bartleboglehegarty.com/
Written byGuy Leech on the 18th of January
Thanks Keith, I’ve fixed that up.
Written byTigdh Glesain on the 20th of January
Great article but you may wish to revisit the spelling of Dreamless Stuidos on the right hand column (O:
Written byGuy Leech on the 20th of January
Ahh, good catch. I’ll fix that right up.