I've heard more than a few comments that the images projected on the screens behind speakers at the Republican National Convention were less than helpful. Garr Reynolds already wrote up a great piece about the imagery used during John McCain's acceptance speech, but I think one of the worst cases of disjointedness came during Senator Lindsey Graham's speech: We Are Winning.

Graham's Graves

Jon Stewart of The Daily Show was the first person I saw mention this, and I had to rush to the Republican Convention YouTube page to see if it was real. Sure enough, as Senator Graham was proclaiming, "We are on the road to victory," Arlington National Cemetary loomed over him as if taunting Republican critics not to take advantage of this moment.


"We are on the road to victory!"

As usual, I'm trying my best to check all political opinions at the door. That's not within the scope of these posts, but why this image? Doesn't the image of a cemetary – particularly a military cemetary – contradict his theme of impending victory in Iraq? I can't find any logic behind the choice of imagery outside what a Campaign staffer said about McCain's visuals: "The changing image-screen was linked to the American thematics of the speech..."

Purposeful Visuals

Background images do not exist merely for the sake of themselves. They are there to reinforce you. Better to use no images or graphics at all than use those that distract from (or worse yet, contradict) the message you are delivering. In the case of John McCain's speech, the images behind him simply distracted from his talk. They didn't help support his delivery, but they didn't hurt him either. In contrast, this image of Arlington National Cemetary undermines Sen. Graham's words.

Images in presentations need meaning. They need context and purpose. Usie imagery wisely, and your message is the stronger for it. Think about what your audience is seeing while they are hearing your words. Are your images purposeful or distracting?

Tags: graphics, atmosphere

Presentation Zen: Learning slide design from an IKEA billboard

Garr Reynolds posts about the similarity between slides and billboards, inspired by Nancy Duarte's new book. He outlines eight principles found on good billboards and how they translate to slide design. As a sample, here's a video from his post.



As an aside, I think it's awesome that this entire video could be created in Keynote.



Presentation Zen: Kermit learns visual thinking

Mr. Reynolds shares an old clip of Kermit doing some visual thinking on the Ed Sullivan show. Inspiration can come from the strangest places!

Tags: garr reynolds, graphics

While revising my Simply Presentation material for a week-long workshop, I began investigating PowerPoint culture a little deeper to discover the psychology behind typical, cluttered slide design. In doing so, it was hard to avoid the sheer amount of media and marketing that involves clutter, as if white space is wasted space. It's more than just templates and poor examples that lead to cluttered slides. An entire culture of clutter informs our design decisions.

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.

Tags: clutter, graphics, design

Presentation Zen: Ichi-go ichi-e: this is the moment

Scaffolding on Benjamin Zander's fantastic talk at TED, Garr Reynolds pens a piece about living the moment and applying the principle to approaching presentations.

Here's the presentation that inspired this post:




Seth's Blog: The three laws of great graphs

After reading this post, I'm going to have to rethink my love affair with bar graphs. Click away for some good guiding principles when adding graphs to your presentation.

Tags: graphics, garr reynolds, connections

Keeping with the idea of space, not only should we be aware of the amount of space in which we are working, but we should also understand the importance of white space (also referred to as negative space). Simply, negative space is any portion of your slide that is empty of content or graphics. It's blank.

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!

Tags: text, graphics, clutter, design

I'm hesitant to post this video because I know it's inflammatory, but I think it does a great job of creating and maintaining a visual metaphor throughout the presentation.

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.

Tags: impression, graphics, eye candy, design

Back in February, Joystiq offered some great coverage of the 2008 Game Developers Conference, and some of that coverage included overviews of some of the presentations given at the conference – including photos of slides! Here are some slides from the conference that caught my attention and some lessons we can take from them. (All images in this post come from Joystiq.)

Corporate Is Not Better

Naturally, Sony hosted multiple sessions at GDC, and the slides below are from two different presentations, but you might not know that from looking at them.



The slides are infused with the requisite corporate branding – from the PS3 background of the slides to the Playstaion Network logo in the top left corner. Bullet points poulate the slides, and what is up with that image of the PSP? It looks like some pulled it off of Google Image Search and copied it onto the slide with no editing. Have they no one at Sony who can use Photoshop? Could no one remove that white background?

For such a huge corporation, they had cheap-looking slides. By contrast, Microsoft's slides were virtually bullet-free and featured beautful screenshots of the games they were discussing.

Play to Your Audience

A game developers conference is going to be filled with geeks, so what better place to throw some truly geeky references into the material?



In the first slide, Bioshock's lead developer Ken Levine pays tribute to an internet cult icon named Ben "Yahtzee" Croshaw (who is famous for his extremely fast-paced, witty, and usually vulgur game reviews). The second slide is from a Blizzard presentation, and they reference Douglas Adams' The Hitchhikers Guide to the Galaxy through the graphic, the slogan "Don't Panic," and even the font used for the slogan.

Let us not forget that the audience at this conference was probably 95% male, and Valve Software knew how to attract attention to their main point in such a setting!

Simpler Is Often Better

In a talk about independent gaming, the developers of Everyday Shooter put up what is probably my favorite slide from this conference.



If you've ever played Katamari Damacy (or any of its sequels), you've probably had that very same thought: WTF? (If you have not played Katamari Damacy, stop reading this article, and go get it right now. I'll wait right here.) The game exudes bizareness, and this simple slide communicates that fact very directly.

Visuals in a presentation can amuse, offend, engage, inspire, or just bore your audience. Look at how most of the slides in this post stand out from Sony's back at the top. Sony took a tried-and-true approach to PowerPoint, but others break from that mold and create more engaging experiences (just like the games some of these presenters create). Instead of being lost in a sea of sameness, take the time to be different so you too can stand apart from the crowd.

But I don't recommend any of you use topless women in your presentations. Trust me on this...

Tags: eye candy, humor, graphics

Head on over to Presentation Zen where Garr Reynolds has listed ten links that offer high-resolution free photography you can use in your slides or other design work. The direct link is below:

Presentation Zen: 10 links to cool, high-rez images

After about five minutes of browsing the sites, I've already bookmarked nine of these resources. Hopefully, you'll find them just as useful.

Tags: graphics

When it comes to animation in a presentation, I've seen an quite a few examples of two extreme approaches. On the one hand, there are the people who use fancy animations for every slide transition, object build, and bullet point while, in contrast, I see a lot of more professional presenters avoid animation entirely.


a sleek Keynote transition

While overusing animations can distract from the presentation as a whole, it doesn't seem necessary to eliminate their use entirely. Judiciously added builds and transitions can add a level of polish that helps keep the audience engaged in the talk. Good looking slides help maintain a certain perception of professionalism around you the speaker. While we want to avoid overkill (which does not look professional), animation can be beneficial when used in moderation.

I usually use simple transitions between slides. Most of the time, these transitions will consist of dissolves and wipes, but I might use a push transition if the selected background allows for it to be executed transparently enough. However, some of the flashier transitions are reserved for section breaks or shifts in the talk. These type of transitions signal to the audience that we are moving from one section of the talk to another. (Usually, I will use the same transition for every shift in the talk.)

The same is true for text. Big text builds are reserved for big points. The animation says, "This is important!" Again, not every bullet point or every fact will be animated outside of simple wipes and fades. The eye-cathing effects are reserved for big ideas.


an eye-catching text build

Your visuals should be built entirely around reinforcing the message you are delivering, and that principle holds true for animations as well. Do use animations in your slides, but animate responsibly. Eye candy can be a good thing, especially in front of a bunch of ADHD-prone American adults! However, exercise moderation so your animations don't become the show – distracting from anything you might have to say.

Tags: graphics, eye candy

I was looking something up on Dell's website a couple of months ago and came across this graphic below. I don't remember the context, but I saved the image thinking, "This slide needs a makeover."


© Dell

This slide falls into the same trap as many charts. There is too much in too little space, and the slide becomes indecipherable from a distance. What we have here is basically a Gantt chart, which is used to illustrate start and finish dates of projects – support for versions of Windows in this case. The problem is that Gantt charts really need more horizontal space than a typical PowerPoint slide provides.

If you are using Keynote 3, you may be able to account for this space by using a wide-screen theme, but I chose a different route that should be usable to all Keynote and PowerPoint users.


This is actually made from two slides.

What I did was simply make the chart span across two standard 1024x768 slides. The tricky part is getting things to line up across slides. To simplify this process, I made the first slide. Then I copied the slide and pasted it in the slide navigator. Then I just adjusted the onscreen elements to reflect the second half of the chart. I removed any information that did not specifically pertain to Windows as well as text blurbs that I could just verbally explain or include in a handout. For the best effect, use Keynote's push transition to smoothly move from one slide to the next, reinforcing the feel that these two slides are one visual.

You might choose to discard or keep different information than I did, but think about this next time you have a large chart to include in your slides. Ask yourself if the information can span multiple slides to give you more room to work with and allowing you to create less cluttered, more readable slides.

Note: This method is not original to me. As a matter of fact, I got the idea from a sample clip on Keynote Theme Park, advertising their Keynote theme, The Plan. You can view the clip and see this idea in action right here.

Tags: examples, makeover, graphics

One of the things that frustrates me about my new cell phone is that it takes seven button presses to tell it to dial someone in my address book. (No, I have not set up my quick dial yet.) Seven presses – exactly the same numbers of buttons I would use to just dial the number. It's just too complicated. I get it. I'm a technophile, so I understand how it operates. It's just annoying.

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.

Tags: philosophy, examples, makeover, clutter, graphics, design

We are very much influenced by our sense of sight. As a rule, we are very visual beings, and imagery can generate a large impact on people. Think of how often you would rather someone show you how to do something than tell you. Wouldn't you rather see something fantastic than just hear it being described? Why then do we create presentation slides that merely reiterate our words and do not visually reinforce our message?


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.

Tags: graphics, philosophy, al gore, examples, design

One of the tougher questions I get when helping someone assemble a PowerPoint or Keynote presentation is this: "Which background (or theme) should I use?"



Every presentation is different, and, as such, each has a unique style and feel. The backgrounds you choose should be appropriate for that feel and act as a suitable backdrop for your content. Okay, that's a vague answer – here are some guidelines I like to follow.

Avoid Distracting Backgrounds

The background should not be so colorful or busy that it distracts from the material you are presenting. You want your audience to focus on content – not the cool image that serves as the backdrop. Compare these two approaches:

x

Remember, first and foremost, your slides are there to reinforce your material. A distracting background will not help with that goal.

Don't Be a Cookie

Some themes (especially those in PowerPoint) are just plain overused. Try to avoid backgrounds that look stale and stereotypical. I've said it before, and I'll say it again: don't let PowerPoint tell you how your slides should look. You take charge of the appearance of your slides. Sometimes, this means you should build your slides from scratch, and this includes picking your own background.

x

The first slide was created using a standard PowerPoint template. The second started as a blank slide, and I chose elements that seemed to best reinforce my message. (By the way, all of those points on the first slide are included on the second, but they are revealed with built images rather than text.) Does the second slide take more time and effort to create than the first? Yes, but the results are worth it.

It's Okay to Change

You don't have to keep the exact same background behind every single slide. Again, here is an example from some slides I'm working on regarding Christianity and environmental responsibility.

x

As the slides move away from the theme of creation, I abandon the star-field that acts as a backdrop to the previous slide and replace it with a grassy field. Other slides will have other backdrops. Yes, in many of my presentations, the backdrop remains consistent, but it does not have to be that way. In fact, sometimes it is appropriate to change backgrounds as the content in your slides evolves from premise to conclusion or through different sections.

Give Yourself Room

I bend this guideline from time to time, but I've seen space on slides misused often enough to mention it: Don't create a slide that constrains your space. In Keynote, for example, most default themes give you an 800x600 or 1024x768 canvass. Don't use a layout that restricts this space.

x

Sometimes you may want to create a frame for your material, which will cut down a little on space, but you don't want a slide that is completely restrictive in its proportions. I've seen slides like this first example a few times, and they are never effective visual communication. Constricting backgrounds only lead to cluttered slides.

My Picks + Conclusion

In closing, here are some Keynote themes I tend to build my presentations around. I find they make good themes in and of themselves while also lending themselves to flexibility and customization.



It's almost become a mantra here to say that your slides should be uniquely you, and the theme or backdrop you choose for your slides is part of that process. If you can avoid some common pitfalls many stumble into when choosing backgrounds for your slides, your audience will notice at some level. It may be subtle, but it goes a long way toward making your presentation as effective as it can be.

Tags: themes, backgrounds, graphics, readability

File this entry under "handy tips" in your brain. Keynote uses layered backgrounds in all of its themes, and these are very handy for quickly adding images to your presentation without having to create masks or custom frames. This is how it works:

x


Nifty, huh? All I have to do is drag the photo into the designated area, and I have a framed or inset image. It's not terribly flexible, but it is a good way to get nice results quickly. However, in many themes, the cutouts could be suitable for any content you might want to draw attention to – not just pictures. Here are some examples:

x


In the first image, a cutout is being used to give a graph a more organic feel. (The "droplet" is an image cutout in that slide.) In the second image, the photo cutout is being used to frame a quote. In the third, I am using the cutouts to mask an image, but I am using two separate cutouts for one image.

Many third party themes have very creative cutouts in their slides allowing for some unique uses. Don't let the label "photo cutout" limit you. If the presentation you are giving warrants it, get creative with your use of cutouts. This is just one more way you can let built-in features of applications like Keynote enhance your presentation slides.

As an aside, all of these screenshots (except the Clemenceau quote) use third party themes from Jumsoft. Visit my Presentations page for more theme resource links.

Tags: software, graphics

I'm not a fan of logos plastered over every slide in a presentation. Imagine how much different an Apple press event would feel if their slides looked like this:


Just in case you forgot whose event you were at.

Even at talks given within my own school district, I've seen presentations where our township logo appears in the bottom corner of every slide. This is totally unnecessary clutter, and it makes your slides feel generic and impersonal. Besides, your slides are not a marketing avenue. Your audience should not feel they are watching a feature-length advertisement – even if you are pitching a product or service.

Now, don't get me wrong. Even Apple uses branding for their presentations, but it usually looks like this.

x

Before the presentation formally begins, a solitary Apple logo will be present, and in-your-face branding will pretty much remain absent for the remainder of the talk. You don't need to be reminded whose products you are learning about. The slides remain clean of marketing, and the whole experience is the better for it.

If you prepare slides for a company, business, or other organization, avoid bombarding your audience with your corporate identity. Yes, use the first and possibly the last slide to display your logo, but keep the rest of the slides clear of unnecessary clutter. your slides are meant to reinforce your talk. They are not an advertisement.

Tags: conventions, clutter, examples, graphics

Don't think I'm giving into ads yet by the look of this banner to the right. I saw this ad staring at me today, and I thought, "There's something wrong here, but what?" Then it came to me: What should this lady care about impressing her in-laws? Honestly, she has to be around 50, and she has likely been married to her husband for quite some time. If she hasn't impressed her in-laws yet, she never will!

Seriously, though, this is a perfect example of just plugging in an image to have an image – which we can be guilty of in our slide presentation all too often. In this ad, would it have not made sense to have chosen an image of a twenty-something man or woman, perhaps looking somewhat self-conscious? Our self-assured woman in late midlife simply fails to reinforce the statement made in the advertisement. Forget about impressing your in-laws with taxes! How about you go and visit them more than three times a year? That will impress them even more!

As we design our slides, it is common to want to use images to reinforce what we are saying. (In some cases, we may feel the need to reduce negative space, but we should really resist that particular urge.) Unfortunately, if we don't respect the time it might take to select the right images, we may end up with pictures that merely feel tacked on – pictures that fail to really reinforce our message.

Let's return to some slides on conservation. In the two slides below, which seems to create the greater impact?

x

Both slides emphasize the visual nature of the medium, and both use high quality images. However, the first slide, while very nice, fails to make a connection with the subject. The second actually illustrates the topic. The second slide forges a stronger connection between the subject matter and the audience.

When choosing images for our presentations, we shouldn't just plug something in to fill space or because it creates a certain effect. We need to make sure the images are meaningful to the topic we are presenting on.

PS: Now that I think of it, the woman in the ad may be the in-law in question. Unfortunately, the way the ad is laid out, it still looks life she is the one making the quote.

Tags: graphics, eye candy, clutter