Design Like You Care
Case in point: The Drudge Report is an example of good design that is not pretty. It's a site that is easy to use. It's visually distinctive, and it quickly communicates various messages through an organized clutter. Do I subjectively like the site? No, but I can't deny the design work behind it. Jason at 37signals has a great post about his belief that the Drudge Report is one of the best designed websites around.
Design is about communication. It's about uniqueness. It's about combining form with content. It's about changing how others think, and it's about connecting with others. Most of all, I believe, design is about caring. You care about the content for which you are designing, it shows.
A Couple Website Comparisons
Compare Apple's website to Dell's. On first glance, the layouts of their main pages are nearly identical. For me, it's hard to quantify exactly what makes Apple's page better. Is it the typeface? Is it the use of simple product categories rather than usage categories? Is it the absence of stock imagery? From my novice background in design, it's hard for me to say, but the Dell site feels more clinical.
It may be the snowman.
The difference is more visible when you visit a product page. For Dell, the product page is where they sell you stuff. For Apple, it's where they inform you. In fact, Apple's storefront is a separate part of the site.
Dell's product pages are cluttered with text, ads, and tiny product images. An Apple product page, in contrast, is full of large pictures of the product with small blurbs of text that will take you to more information. Dell's site says, "We care about you buying stuff." Apple's site says, "We care about our products." Of course, Apple wants you to buy their products, but their site allows you to get to know the piece of hardware or software you are buying first. This approach demonstrates a care that makes Apple's site stand out.
As if baiting the Mac/PC feud with the last comparison isn't bad enough, now let's look at the campaign pages for Barack Obama and John McCain. (I know I've been blogging about Obama a lot here lately, and I promise I'm almost done.) The Obama campaign site exudes attention to detail, and that same level of attention has been applied to Change.gov.
The team designing the Obama site pays careful attention to color use and font use. The layout is uncluttered, and the design team pulls off the difficult task of utilizing red, white, and blue without seeming patronizingly patriotic. The McCain site follows many of the same principles as the Obama site, but his site never seems to feel a unified whole. Cartoonish icons combined with a dark color scheme with obvious instance of stock photos. To misuse the Arizona senator's own words, it looks like someone phoned this one in.
Elections are about issues in my book, and the Obama team did a great job making it easy to quickly grasp and investigate the candidate's stances. Each issue page starts with a quick overview of Obama's plan in that area, followed by a table-of-contents and a comparison chat between candidates, followed by an extensive overview of Obama's plan, followed by a synopsis of his career record in that area. On the other hand, McCain's issues are presented as plain blocks of text. There's nothing wrong with this, but the care and work that obviously went into Obama's site makes it stand out.
The Lesson
I've been rambling about site design for the past several paragraphs, and you might be wondering what this has to do with presentations. Simply put, if you create your presentations around tired templates and merely plug in the requisite facts, you fail to differentiate yourself from the crowd. Adding care is a vital ingredient to standing out from the crowd. If you are speaking in public, talk about your topic like it matters. Design your slides like they matter. Good design is about caring. Caring is about something that matters, and if your talks mean something to you, they'll mean something to your audience.Related Links
What Is Aesthetics?
“…Done for some ulterior motive…”
About a minute into the video, Mr. Rand discusses a designer’s motivation. Why does he or she do the work? Is it for the money, or is it for the love of the art? Like Philippe Starck discussed, Paul Rand asserts motivation makes a difference. The same is true for our presentations. If we’re preparing slides merely because we think slides should be a given, they won’t be as good as if those slides come from a vision of how to best illustrate our points. The same is true of topics. We will present better when we present that which we are passionate about. Watch some of the videos at TED, for example. You’ll see some truly awkward public speakers deliver some fantastic presentations. The reason comes down to motive.“A work of art is realized when form and content are indistinguishable.”
Mr. Rand speaks of all visual mediums as being forms of art. “It’s all art,” as he puts it. When we are designing slides for a presentations, we have the opportunity to be artists of form and content. A presentation is truly effective when the slides and talk compliment one another naturally, neither overshadowing the other. Without content, good slides are nothing but pretty pictures. (However, you do not necessarily need words to have content.) Without form, slides become bland and repetitive. The marriage of form and content make for the best presentations.
A marriage of form and content. Both slides by Chris Wilson at slideshare from 1. Rapid Change in Design, and 2. The Brand Gap.
“Everybody has a definition which doesn’t correspond to yours.”
Paul Rand acknowledges that we all see different things when it comes to art and design. What speaks to me may not speak to you and vice versa. This point is abundantly clear when my wife and I go to our local art museum. There are exhibits there that I could look at all day while she wants to move onto other things, and the same is true in reverse. This principle applies to presentation format and design. What works for me as a presenter may not work for you. I’ve encountered numerous presentation methods, and not all work for me. Find what works for you, and run with it.“Don’t try to be original. Just try to be good.”
Paul Rands encourages us to borrow from others in our pursuit of quality, and this is how he defines aesthetics – doing things with quality. I noted that I’ve encountered many different approaches to presenting: the Godin Method, the 10-20-30 Rule, Presentation Zen, the Lessig Method, the Jobs Method, etc. Also, I’ve borrowed from all of these techniques at different times, often combining philosophies. What you read on my blog here is not completely original to me. I merely gather information that I judge is good, useful, and/or inspirational, and I pass it on to you. T.S. Eliot says:Immature poets imitate; mature poets steal; bad poets deface what they take, and good poets make it into something better, or at least something different.
Stand on others’ shoulders in your development as a public speaker, and then add something unique and different to the mix. We learn to talk through imitation. Our individual cultures are forms of collective imitation. Don’t be ashamed to imitate as you try to improve or grow as a speaker.
Similar yet unique. Slide 1 by Clint Edmonson from Organizational Politics - A Survival Guide. Slide 2 by Andy Budd from Architecting Human Behaviour 2.0.
Wrapping Up
These are only a few of the takeaway points from this short video, and I recommend you watch it at least a couple of times to pick up on the things you may have missed the first time around. In future posts, I plan on revisiting the elements of design Paul Rand discusses and how we can apply these to our slides. Until then, allow some of your childhood creativity to find an outlet, and really try to design your next set of slides.The Culture To Our Clutter
The Clutter Culture
We are bombarded with visual information wherever we look. Billboards, television programs (especially news programs), product packaging, websites, newspapers – all of these cram every available inch with information and distractions. The shot of New York City above shows numerous advertisements screaming for attention, but these do not so much gain that attention as they strengthen our mental filters. We tune this kind of clutter out.
Instead of approaching things from a different angle, however, marketing designers have instead upped the ante. The signs get brighter, more colorful, more animated, flashier. Likewise, product packaging gets more bullet points, more bright colors, and more stickers to help it stand out. On his Presentation Zen blog, Garr Reynolds has a few examples of how this practice has gotten out of control where he lives in Japan. (This post on Cabel's blog has some great pictures from Japan as well, and other posts of his show off some truly loud packaging for the States.)
When it comes to packaging, which of these two boxes do you find most striking? Which one would grab your attention as you walked past it in CompUSA of BestBuy?
photos by goodrob13 and hyku respectively
Based on my experience, the MacBook Air's box is an attention-grabber. It's incredibly small, and it stands in contrast to more visually cluttered boxes sitting nearby. Its packaging is visibly different from the brightly colored boxes in other parts of the store. System specifications fill one spine, and the rest of the package draws attention solely to the product inside. The box is minimal, simple, and elegant. That simplicity more easily breaks past the noise filters in your mind.
Who can forget this classic parody video about Microsoft repackaging the Apple iPod? As it turns out, the video was commissioned by Microsoft's packaging team, demonstrating their own awareness of the clutter culture that had invaded their package design.
Try Some Cable News
On the subject of YouTube, you should also check out this interview with Lewis Black where he criticizes the ever-present news ticker that crawls along the bottom of the screen while people are talking.Here's your challenge: Watch a segment on MSNBC, Fox News, or CNN and read the news ticker for the entire duration of the segment. Read every word. Then, at the end of the segment, explain in detail what the anchor was talking about to someone else.
The Ticker and Slides
What has happened is that we have begun to equate clutter with the concept of professionalism. We see sources like CNN, CNET, USA Today, Sony, and others using visual clutter to communicate, and we try to emulate the professionals. Unfortunately, the results end up looking something like this.
alas, I did not make these up
We leave our audience squinting, trying to read our slides while we are talking, diverting their attention from our material so they can comprehend the clutter on our slides. On the other hand, the audience's noise filters might kick in, instructing them to ignore the slides. Instead, we might want to try a simpler approach.
simplifying, while staying true to the originals
A less cluttered approach allows your slides to act as a reinforcement rather than a distraction. It gives them purpose. Instead of the slides focusing on every little detail, they highlight the most important snippets to impress these points on the audience. If your audience has to divert concentration to understand your slides, you are losing out as the speaker.
Quoting Leonardo da Vinci (once again), "Simplicity is the ultimate sophistication." Avoid the pitfalls of our clutter culture when preparing your slides. Leave the fine details for your handout. Keep the slides simple and clear, and they will help you stand out as a speaker.
Negative (Space) Is Good
There's a trend in the media, it seems, to pack as much information into every square inch of visible medium as possible. Whether you are talking about print, packaging, or television, the result is the same – a deluge of information and graphics for the viewer to receive and process.
This philosophy also seems to influence slide design, hence results like these:
slides from the Hillary Clinton campaign and Intel respectively
In all honesty, the Clinton campaign's slide is tame compared to its neighbor, but both of these slides suffer from cramming too much information to digest all at once. I don't even understand the Intel slide enough to make a crack at it, but here's my attempt at cleaning up the Clinton slide.
This slide is talking about districts that Bush won in the last general election and who have traditionally supported Republican seats in congress. It's a big deal, but it's also easy to lose sight of on a cluttered slide – especially since someone felt the need to list each specified district. This alternative slide pulls out much of the visual distraction and focuses on the single most important fact: the victories.
Give your information room to breath, and make sure the most important element is the focus of your slide. Don't let the urge to fill every inch of available space crowd out the real message. Oh, and there's one more small reason to avoid this kind of clutter: the more time your audience is deciphering your slides, the less they are paying attention to what you are saying!
Respecting Space
These little icons fascinate me. The images in this post are from XBox360achievements.org, and they are all 64x64 pixels – an incredibly small amount of space in which to work. Still some game developers succeed in creating excellent icons to represent their achievements. However, many more fail to do so. Here are some examples of achievement icons.
The Good!
In order, these icons are from Bioshock, GUN, Call of Duty 3, Elder Scrolls: Oblivion, Need for Spped: Carbon, FlatOut, Quake II, Ghost Recon: AR 2, and Skate.
The Bad...
In order, these icons are from Ninety-Nine Nights, Kameo, Blacksite: Area 51, Looney Tunes: Acme Arsenal, Championship Manager 2007, NBA Live '06, Final Fantasy XI, Overloard, Jericho, and Tomb Raider Anniversary
A good set of achievement icons will do several things. They fit well together. Images are crisp. They provide some kind of visual clue as to what the achievement criteria is. Most of all, though, they make good use of space. Contrast the top set of icons with the bottom. Can you see how much more cluttered the bottom set is – the designers trying to fit too much information into too small a space. (The Ninety-Nine Nights icon not actually crowded at all. It's a poor resolution image, which it shouldn't be at that small of a size.)
If you are working in PowerPoint, you are working on a canvas that is 720x540 pixels. This is a few more pixels than a standard-definition TV (640x480), and Mac OS X Leopard has icons nearly as large (512x512). Regardless of your computer's monitor size and resolution, these are the constrictions of a PowerPoint slide. More important, though, is that your audience will be viewing these slides on a screen at some distance from where they are sitting.
image by Vicky S on stock.xchng
Even a moderately large screen appears smaller than one's hand from ten to twenty feet away. Your slides, while they appear large on your computer screen – are actually a small canvas, and they should be treated accordingly. Like the XBox 360 achievement icons, cramming too much into the space will make slides that are incomprehensible – resulting in the slides attracting more concentration than the speaker.
Sometimes less in indeed more. And a clear image with minimal text serves better to illustrate your point than a slide crammed with distractions. If your audience can't instantly recognize what's on your slide, I'd wager it's too cluttered.
clutter versus clarity
Respect the space you have, and consider what your slides will look like from twenty feet away – more in many situations. Don't make your audience have to think harder about what's on your slides than what you are saying. Work with the space you have, and avoid over-packing. Your audience's eyes will thank you.
All achievement icons are © their respective holders.
Creating a Metaphor
The video details numerous pledges by U.S. politicians and military leaders that the "next several months" and specifically "the next six months" should see significant improvement and progress in Iraq – from Donald Rumsfeld's famous quote that he didn't expect the operation to even last six months in February 2003 to John McCain saying we will either win or lose this was in "the next several months" in November of 2006.
The metaphor is that of a desk calendar flipping through months as promised by the individuals quoted but being roadblocked by quotes asking for more months. The whole time, a pair of folder tabs are keeping track of cost in money and U.S. lives at each milestone.
Whether you agree with the point of the video or not, the visual consistency throughout makes the presentation all the more powerful. Quotes are short and the videos help reinforce those quotes. Nothing distracts from the composition of this production. Nothing looks out of place. Every element – from the background to transitions – works together as a whole.
I don't theme my presentations around a visual metaphor often. They often become visually repetitive, and it's too easy to insert elements that will seem out-of-place. However, I'll definitely use this video as a template of how such a presentation can be done right.
Thinking About the Toothbrush
While not one of my favorite talks on TED, some of the quotes resonated as applicable even beyond his direct context (as many good talks do). In his presentation, done without the use of slides at all, Mr. Starck talks about three basic philosophies of design. Cynical design, narcissistic design, and humble design.
On cynical design:
The one, we can call it the cynical design, that means the design invented by Raymond Loewy in the '50s, who said, what is ugly is a bad sale, La Laideur se vend mal, which is terrible. It means the design must be just a weapon for marketing...
I think many of us have seen slide presentations that are visually stunning but do little to add to the presentation itself. It's as if the presenter is trying to win the audience over with his mad PowerPoint skills rather than any specific content. I know this is an easy trap to fall into with Keynote, and I can only imagine the temptations in PowerPoint 2007.
Oddly enough, I think some of Microsoft's own slides illustrate this approach:
images from Microsoft.com
In these examples, the slides are visually impressive, but the impressiveness is at the cost of readability and clarity. We can do the same with too many graphics, unnecessary clip art, and a plethora of animations and transitions. We treat the slides as a weapon to attract (or distract?) our audience rather than to augment the important points and concepts.
Then comes the narcissistic approach. In Mr. Starck's talk, he defines these designers as those who design for the appreciation of other designers. In slide design, I see this as designing the slides for my own benefit. These are the slides you look at while talking, reading bullet points to the audience.
I'm not too proud to admit these are mine
These slides are designed for one person alone: me. I may say they are for the audience's benefit, but they really exist so I can read my presentation off the slides. I may even spend significant time with my back turned to the audience in the process. While common practice, such slides are basically selfish. They are used as a crutch rather than a supplement.
Finally, Mr. Starck touches upon a more humble approach:
I try to not make the object for the object but for the result, for the profit for the human being, the person who will use it. If we take the toothbrush -- I don't think about the toothbrush. I think, "What will be [finger in mouth] the effect of the brush in the mouth?"
A toothbrush is about the most basic thing you have laying around the house, but think of how many horrible toothbrushes you have used that look really great (as far as a toothbrush can go). Aren't some of the best toothbrushes the epitome of simplicity? They do the job, and they remain unobtrusive in doing it.
The same principle can be applied to slides. Ask, "How does this slide affect my attention, my eyes, my comprehension, my concentration?" Does my audience have to concentrate too hard to comprehend what the slide is communicating? Does the slide supplant me? Is it basically distracting? In my own slides above, an audience member might have to really concentrate on the slide to read it, concentration that comes at the expense of me. In fact, I could throw those slides up on a screen and walk offstage. They really render me quite useless. In the case of the Microsoft slides, they are simply distracting – cluttered and complex, requiring too much effort to decode and digest.
same presentations as above, revised (and reflection-obsessed)
Our slides are meant to benefit our audience, to help them digest the most important facts and ideas. If we're going to create effective slides, the focus has to externalize and consider how the slides impact an audience's impression of the overall presentation. In this, I think a certain balance must be present between aesthetics and functionality. Looking nice is important – but not to the detriment of meaning.
Next time you're working on a deck of slides, take a moment and remember our friend Philippe Starck. If your presentation was a toothbrush, how would it feel?
Simplicity As a Standard
Unfortunately, many slides trip down this same path. The audience gets it. They understand the meaning of the slides, but the slides are overcomplicated. Visually, they are as annoying as the cell phone's menus.
These Microsoft slides are favorites of mine. I honestly don't think I could design more visually complicated slides if I tried.
x
© Microsoft. How complicated can you get?
What ends up being the result? The speaker has to keep referencing the slide, pointing out various areas, and defining what the slide is explaining. It becomes tedious and exhausting. The slides do not support the talk. Rather, the talk is supporting the slides. This is the danger in overcomplicating your slides. You may accidentally let yourself become servant to the visuals.
In contrast, if you set simplicity as a standard in your design, clearer results happen. Many claim the iPod's runaway success is due, largely in part, to its simplicity of design. The same is true of the Nintendo DS. David Pogue spoke at length for TED 2006 about the "Cult of Simplicity." Simplicity sells – not just products but ideas as well. Keep your slides simple and clean, and your audience will be more likely to buy into your message because they are no longer distracted by trying to decipher complex visuals.
Here is one way to simplify the slides above:
x
Same message, different approach. (Windows screenshots from GUIdebook.)
It would be unfair to say that there is never a place for complex slides, but, more often than not, simplicity trumps the alternative. When preparing your presentation, have others look at your slides. Ask them if they easily understand the big ideas conveyed. How much reading is involved with your slides? Are they visually cluttered? Make simplicity a standard, and understanding will follow.
It's All About the Visuals
In this case, I'm not talking about inserting Office Clip Art or "Screen Beans" (who deserve the same public flogging as Clippy). I'm talking about meaningful high-quality visuals your audience can connect with and be impacted by. Photographs and art can bring so much more to our talk than can simple sketches, bitmaps, and vector images. The right image can connect with people in ways words cannot, and that connection is an important part of your audience connecting with you.
x
What if Al Gore had used Clip Art? (Image from Apple Computer.)
Take Al Gore's An Inconvenient Truth presentation as an example. What if Mr. Gore had taken a more "traditional" PowerPoint approach? What if he had used Clip Art and bullet points in place of photographs and satellite images? Would his presentation been as powerful? Would his message have gained as much momentum as it has? Even if the content were identical, I would say no. Part of the allure in Al Gore's material is the great use of images.
When we stick with bullet points and Clip Art on our slides, we are short-changing our own presentation. Slides are visual by nature. Your audience is visual. Use the slides to say things you can't, to make connections words alone are unable to. Go beyond what you are used to seeing, and use images in your slides that are meaningful to your content and create an impact on your audience.
Some Image Resources
- iStockPhoto - this is a great, inexpensive source for stock photography.
- stock.xchng - all images here are free, but pay attention to attribution if requested.
- morgueFile - loads of free images. Quality varies.
- yotophoto - free image search engine.
Al Gore Links (for the curious)
- An Inconvenient Truth - official movie website.
- Changing the Climate - an Entertainment Weekly story about Gore's documentary.
- Presentation Zen: Al Gore: Another Presenter Extraordinaire? - Garr on Gore.
- Duarte Design: New Model Science Teacher - the people behind Al Gore's visuals talk about the process.