Information Design Watch

December 30, 2010, 3:08 pm

A Lesson in Venn Diagrams

By Henry Woodbury

I’m not going to reproduce the “Who Gets Paid to Touch Your Junk” Venn diagram. It’s already doing the rounds. This summary of what does and does not constitute a Venn Diagram is more entertaining than the original joke (which leads the discussion anyway).

Selected commenters push back against the critique. Most tersely, Commenter Michael writes, “The original is an accurate Venn diagram. The labels within overlapping areas are simple not exhaustive.” Commenter Jose_X elaborates:

Yup, as explained in a different comment, the original is essentially correct.

To see what I mean, replace “Doctors” with “Characteristics of Doctors” and repeat the replacement pattern for the other sets as well.

The most interesting comment is not about definitions, but about usage. Commenter Marcus Carab observes:

There’s quite a lot of “incorrect” Venn diagrams like the original out there – to the point that it has basically become an accepted format for a joke.

I’m not sure if any other type of chart or diagram has achieved this status. Pie and bar charts invite mockery for their clumsy misuse. Venn diagrams offer a platform for fun. For example.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (0) | Filed under: Charts and Graphs, Diagrams, Information Design

December 20, 2010, 3:04 pm

Flip Book Presentation

By Henry Woodbury

Presentation software does flip book animations. There’s nothing complicated about it. It’s just the way presentations work, if you let them. From 2010, here’s a Google Docs example:

This is beautifully done and encourages the typical trash-talking of Microsoft PowerPoint. And I have to believe that Google Docs’ layout and drawing tools are easier to use than PowerPoint’s truly awful toolkit. But the kernel of this presentation is not in the drawing, but in its 450 slides. With enough slides you can animate anything.

From 2008, here’s a Flash version of an animation we created in PowerPoint for Textron.

In contrast to the Google Docs example, we did our drawing in Adobe Illustrator and imported each frame into PowerPoint from the external application. But as I said before, drawing isn’t the issue. What we really lack is a soundtrack.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (0) | Filed under: Charts and Graphs, Creativity, Information Design, PowerPoint, Visual Explanation

December 15, 2010, 9:47 am

Map Meme Goes Manhattan

By Henry Woodbury

Back in September I posted on Bill Rankin’s beautiful maps of census data.

Now the New York Times has turned the idea into a powerful data-driven Flash application. As a Flash application it lacks the resolution and elegance of Rankin’s maps, but it makes up for that in coverage and interactivity. Paradoxically, the lack of resolution is most apparent in the suburbs and rural areas that the application makes available for analysis.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (0) | Filed under: Charts and Graphs, Information Design, Maps, Visual Explanation

December 14, 2010, 2:02 pm

The Borrowed Brand, or How Not to Create a Logo

By Henry Woodbury

While U.S. political organization No Labels talks up a kind of vague newness, its design contractor quite concretely stole its look from the past. John Del Signore at Gothamist reports:

[The group's] slogan is “No Labels. Not Left. Not Right. Forward.” But considering how closely the group’s logo/design … resembles the work of graphic designer Thomas Porostocky, they might want to change the name to No Copyright.

Porostocky’s work, from his More Party Animals web site, is on the left. The now-expunged No Labels design, produced by Dave Warren, is on the right.

More Party Animals vs. No Labels (courtesy Gothamist)

After some ugly hyperventilating, Warren has apologized. An assistant is to blame. The assistant blames clip-art.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (0) | Filed under: Branding, Current Events, Marketing

December 9, 2010, 2:10 pm

The Phone Call as Community

By Henry Woodbury

If we define a community by evidence of social interaction, how well do political and historical boundaries hold up? That question is posed, and answered (in part) by a study of landline phone calls in Great Britain led by Professor Carlo Ratti of MIT’s SENSEable City Lab. Analysis of over 12 billion calls identified point-to-point geographical connections (defined at the sub-regional level to protect individual identity) whose relative strength was derived by the frequency and length of calls.  The result is a map that mostly aligns to familiar regions, but with some unexpected variations.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (1) | Filed under: Information Design, Maps, Technology, Visual Explanation

December 7, 2010, 3:26 pm

What Color are Your Tentacles?

By Henry Woodbury

Build a Squid InterfaceThanks to the Museum of New Zealand, Te Papa Tongarewa, you can build your own squid.

The Build a Squid interactive is akin to the avatar-builders associated with online games and social media sites. It is a great example of the advantage of fewer choices. There are six components, each with three options, and, for all but eyes, the same palette of 14 colors, blends and patterns. All the naming and design options are accessible all the time. You can cycle through options using “Next” and “Previous” but there’s no need to be sequential.

Also refreshing, for a man who has spent a number of hours logging his children into Disney web sites, is the absence of terms, permissions, and validations. Which isn’t surprising since once you create your squid and drag it back and forth across your screen, you’re pretty much done. All you can do is release your virtual creature into the virtual deep.

How interesting is that?

Interesting enough I guess. After you release your squid, it is easy to find it again using its name or your email. You can check its age, weight, and mileage and drag it around the screen again.

Since the real point of Build a Squid is to drive traffic to Te Papa’s colossal squid exhibition it would seem to be doing its job. The application is two years old and hosts plenty of squid.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (1) | Filed under: Social Media, Technology, Visual Explanation

December 5, 2010, 10:18 am

Hello Skullhead

By Henry Woodbury

Cross Blackbeard with Black Sabbath and you might end up with something like Patrick Galbraith’s Map of Metal:

Map of Metal, Key

The map has a method, indicated by the legend above, and a timeline. The latter runs in a diagonal, from the northwest 60s to the southeast 00s.

Aurally, the map offers definitional tracks for each genre. Visually, its delight comes from Galbraith’s emblematic variations on the leather default. Below is his riff on Visual Kei, “a movement among Japanese musicians, that is characterized by the use of make-up, elaborate hair styles and flamboyant costumes….”

Map of Metal, Visual Kei

Hello Kitty.

(via LearnedLeague)

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (0) | Filed under: Art, Illustration, Information Design, Maps, Visual Explanation

December 3, 2010, 10:18 am

Meta Works (Remodeling Dynamic Diagrams)

By Henry Woodbury

In Tim’s last post on Remodeling Dynamic Diagrams he mentioned our decision to use web fonts. By maintaining font files on our server and referencing them via @font-face calls in our CSS files, we can bring to our web presence the Meta typeface we have long used in our diagrams, presentations, print collateral and Flash animations.

This demo page shows the Meta Web version we have purchased for the site redesign. Internally we have tested it on Internet Explorer 6, 7, and 8, and current versions of Firefox, Safari, and Google Chrome (such incremental browser testing is part of our process). It also works on the iPhone’s Safari browser.

If the fonts on the demo page don’t resemble the image below on your browser, let us know!

A sample of Meta

UPDATE (December 9, 2010): As Andy mentions in the comments, the lower-case y in Meta Web Medium renders with a flaw. This appears on all Windows-based browsers. We’ve reprocessed the fonts and uploaded a new demo.

  • Facebook
  • Twitter
  • del.icio.us
  • StumbleUpon

Comments (2) | Filed under: Dynamic Diagrams News, Implementation, Technology, Typography, Web Interface Design