A picture is worth a thousand words. In general, images are more powerful than words when it comes to clarifying parts of our communication. Maybe ALL of our communication — this can be the subject of another topic — but since we have relied so much of our communication on words (spoken or written), here I will take a stance that words and images are both essential and compensate each other.
I will use two examples to illustrate how images effectively replaces words to make the whole communication shorter and clearer. One is a presentation slide from Garr Reynolds, a presentation guru and the author of the bestselling book, Presentation Zen. It shows the power of pictorial aspects of images ( = photos and illustrations). Another is an informative map from Information Architects, a Tokyo-based interaction design firm. Their informative maps show the symbolic aspects of images ( = patterned symbols and icons)
Presentation Zen is an impractical advice about making practical presentation (Sorry Garr, your advice is so sweet and motivative that it almost sounds like music, but is hard to follow to me). Nevertheless, being a guru, his presentations are highly aesthetic and easy to understand. Let’s break one of his presentations down and see how images are used.
Slide No.1: Seduction. Come on, it’s gonna taste like a raw sushi. What does a sushi image has to do with presentation? Nothing. But it has a loose connection with the word “Zen” (both are from Japan) and anyhow, most of us love sushi, or have heard it is delicious.
Slide No.2: Example. This is how you reduce clutter. Here, a series of stones shows what it means to reduce clutter. By showing a set of stones built on fragile balance and making it more stable step by step, Reynolds effectively demonstrates both the definition of reduction and the effects behind it.
Slide No.3: Catalyst. Open up your heart, now. We all have different ideas about abstract words such as emotions, as used in this slide. What shall we do to demonstrate such words? The answer: let the audience come up with their own definitions. A beautiful image of a nature always work well for this purpose.
Slide No.4, 7, and 8: Focus. Read the words. In these slides, Reynolds uses the lack of image to guide users to focus on the texts (which is the default usage of presentation slides) but since his previous images were so effective, users also notice that something is missing, which also enhances his “less is more” philosophy (slide No. 7).
Slide No.5: Humor. I know how you feel. Reynolds shows his sense of humor and humiliation by laughing at his own expense (presentation IS boring, isn’t it?). This image shows the power of visual clearance; unlike verbal humor, we don’t need to think hard (sometimes) what the punchline is.
Slide No.6: Future. This is where you can apply what you have learned today. The image shows the future (or current) possibility — where the presentation philosophy can be applied in our real life.
Slide No.9: Switch. That’s it, thank you ladies and gentlemen. The image demonstrates clearly that the slide is over (we all know that it is not always that clear), with grace and appreciation. What works better than an image of a theater curtain?
Based in Japan but originated in Europe, the members of the design firm Information Architects organizes information (especially that related to the web) in a series of 3D-like interactive maps. Titled Web Trend Map, users not only understand the “big picture” but also dive into each of the presented website easily. The unique part? They map information on real locations. The following is such map for Infographics web sphere, mapped over geographics of Manhattan, New York. Let’s see what makes this map effective, in terms of graphical symbols and wayfinding.
Icon: graphical icons makes it easier to identify the website because the real profile photos are copied from the original websites. It is not only easier than creating original icons for each website, it is also more effective.
Symbol:all information is presented according to a set of design rules (including icons). Even the title texts are presented in icon-like manner, making the whole presentation a collection of symbols. Once users get used to the rules, identifying information becomes easy because even text search turns into graphical (symbol) search which requires less brain power.
Wayfinding: I know — even though the map is based on Manhattan, aside from landscape there is nothing that resembles the real location. Nevertheless, mapping websites onto a pseudo-location works well for wayfinding, because we are wired to memorize a particular place (in this case, a website) with regard to its surrounding markings. Isn’t it easy to memorize a location when it is presented like “cross the Brooklyn bridge, turn to the left, walk two blocks”?
Bonus: Why not have a gigantic web trend map covering the whole web sphere, based on Tokyo’s rail system (which is arguably as complex and 1/100th as convenient as the Internet)?