Information Design Watch

January 21, 2009, 11:31 am

Examples, Symbols, and Signposts

By Henry Woodbury

Comics impresario Scott McCloud takes on the TED conference and delivers an engaging and funny talk titled “Understanding comics.” The title doesn’t do McCloud justice. He’s really talking about vision. And it’s a great presentation.

One reason for that is McCloud’s playfulness. Even as he unpacks his thesis, he tells stories, plugs in cross-references, and puns on his own ideas. When he gets to talking about comics he uses simple, but effective animations and symbols to highlight concepts such as directionality, space, and time.

Ah, but maybe this is too easy. He’s a comic artist, talking about comics, and his examples are comics.

Not true. When McCloud is talking about ideas, he is equally creative. Except for one key sequence, there are almost no words on his slides. Instead, McCloud offers visual references — a picture of Jung when talking about Jung, a sequence of Ray Charles, Albert Einstein, Wernher Von Braun, and Thomas Edison as he describes his father: ”a blind genius rocket scientist inventor.” He also uses simple, but effective symbols such as an eye to symbolize science, “where what we see and can ascertain are the foundation for what we know.”

(hat tip to Garr Reynolds at Presentation Zen)

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

Comments (0) | Filed under: Art, Comics, Visual Explanation

January 20, 2009, 10:06 am

Goosing the Gray Lady

By Lisa Agustin

newjournalists090119_2_560

Interactive infographics and visualizations have been part of the New York Times’ online edition for some time; typical examples include the “Word Train,” an interactive mood database for collecting public opinion on Election Day, and “Casualties of War: Faces of the Dead,” a project merging photography, databases, audio, and graphics that marked the date U.S. military fatalities in Iraq reached 3,000 (both pictured above).

Now this week’s issue of New York Magazine features an article on how the Times’ Interactive Technologies Group came to be:

The proposal was to create a newsroom: a group of developers-slash-journalists, or journalists-slash-developers, who would work on long-term, medium-term, short-term journalism—everything from elections to NFL penalties to kind of the stuff you see in the Word Train.  This team would “cut across all the desks,” providing a corrective to the maddening old system, in which each innovation required months for permissions and design. The new system elevated coders into full-fledged members of the Times—deputized to collaborate with reporters and editors, not merely to serve their needs.

Most interesting to me is this idea that the roles of journalist and developer have merged at the Times, resulting in projects that aren’t window-dressing for articles, but offer new ways to explore and make the news more relevant to its readers.

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

Comments (1) | Filed under: Business, Technology, User Experience

January 16, 2009, 4:46 pm

Dynamic Diagrams White Papers

By Henry Woodbury

For our recent Dynamic Diagrams site redesign we competely updated our two longstanding white papers (PDF format):

Why Your Ideas Need Visual Explanation and
Why Your Online Projects Need Information Architecture

Today we added our most recent white paper to the site:

Why Your Sales and Marketing Communciations Need Visual Explanation

With analysis and examples, this paper rounds out our presentation of how our approach delivers tangible benefits to business. We welcome your perusal and feedback.

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

Comments (0) | Filed under: Business, Dynamic Diagrams News

January 16, 2009, 10:39 am

Gerrymander Away

By Henry Woodbury

Computers have arguably made the gerrymandering of U.S. Congressional Districts easier and more egregious. They should be able to make the problem go away. That is, if anyone can figure out an algorithm:

…it is surprisingly hard to define, or at least reduce to a set of rules, what a “gerrymandered district” is. Writing a formula for drawing districts requires us to define how funny-looking is too funny looking. And what is funny, anyway?

“The idea is that circles are the best shape for districts,” said George Washington University’s Daniel Ullman, talking about one school of thought. “Unfortunately, they don’t tessellate well.” This was apparently a joke, because the room burst out laughing. For the rest of the afternoon, the word tessellate never failed to produce giggles. (Tessellate means to tile together, as in an M.C. Escher drawing.)

Mathematicians and lawyers are focused on improving the reapportioning process coming up in less than two years. Another use of their analysis is simpler – to find the worst offenders and shame the politicians that put them in place. Is this too funny looking?

Illinois 4th District

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

Comments (1) | Filed under: Current Events, Technology, Visual Explanation

January 13, 2009, 1:21 pm

Bad Usability Calendar 2009

By Lisa Agustin

usabilitycalendar1

Another January, another chance to grab the latest Bad Usability Calendar.

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

Comments (0) | Filed under: Usability

January 12, 2009, 10:24 am

Ahead of Our Time?

By Matt DeMeis

I came across this video recently titled “Did You Know” that was created by Karl Fisch, Scott McLeod and XPLANE. It reminded me of a project dD created almost 8 years prior called “Global Village”. I dug around in our archive and after some careful cross converting and video capturing (the first generation ActionScript didn’t want to play nice), I was able to resurrect the presentation. Some of the sound effects were lost due to the age of the file but it’s enough to show the similarities between the two. It’s not as fancy as the 2007 “Did You Know” but the way the visual statistics are represented has much more of an impact. Have a look…

“Global Village” 1999-2000

“Did You Know” 2007

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

Comments (1) | Filed under: Charts and Graphs, Infographics, Information Design, Technology, Visual Explanation

January 9, 2009, 4:13 pm

A Pattern That Always Fits But Never Repeats

By Lisa Agustin

nyttokolo12

Computer-scientist-turned-designer Asao Tokolo has developed Tokolo Pattern Magnets, which allow you to interlock the tiles to create a non-repeating pattern that still manages to match the edges of a single tile to its adjoining one.   The magnets’ pattern is based on the karakusa, or the Japanese version of the arabesque, which made its way to Japan twelve hundred years ago via the Spice Route. According to the New York Times:

Scholarly papers have been dedicated to the ingenious ways these patterns can be generated and made to interlock and repeat — the fractal geometries of form. What interested Tokolo, though, was the way each tile could have a completely unique shape, and yet be made to link harmoniously to all the others — an unexpected harmony, perhaps, between Western individualism and Eastern collectivism.

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

Comments (1) | Filed under: Art, Creativity, Design

January 9, 2009, 10:34 am

History of Visual Communication

By Kirsten Robinson

Elif Ayiter, a doctoral student at the University of Plymouth, has pubished an illustrated history of visual communication on the web, covering everything from cave paintings to graphical user interfaces. I was particularly struck by the transition from illuminated manuscripts to printed books and how much uglier the mass-produced books were by comparison.

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

Comments (0) | Filed under: Information Design

January 8, 2009, 2:56 pm

Rounded Corners and Other Hooks

By Henry Woodbury

The upcoming CSS3 Specification looks to codify some of today’s favorite interface design tricks, including rounded corners, drop shadows, alpha transparency, and custom fonts. Many of these features can be accessed already using the probable CSS3 style or a browser-targeted version of the same. For example, rounded corners has three test declarations:

-moz-border-radius (for Mozilla-based browsers such as Firefox)
-webkit-border-radius (for Webkit-based browsers such as Safari)
border-radius (the probable CSS style)

Here is a semi-transparent white box with rounded corners and a drop shadow. Two circles are overlayed to show transparency effects.

None of these effects show on the current version of MSIE 7 — so let that be your control. Some may not show on Firefox until the release of Firefox 3.1, but all work on Safari using the Webkit syntax.

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

Comments (1) | Filed under: Implementation, Web Interface Design

January 5, 2009, 12:18 pm

A Short History of the United Nations Logo

By Henry Woodbury

Top: Prototype for the United Nations' original logo. Bottom: The organization's current logo.An obituary for architect and designer Oliver Lincoln Lundquist highlights his leadership in the creation of the United Nations logo. The story, as summarized by reporter Steven Heller, highlights the role of serendipity and a shift in point of view:

After the Navy, Mr. Lundquist attended the San Francisco conference at which the United Nations Charter was signed. His team was responsible for designing all the graphics for the conference and an official delegate’s badge, which became the prototype for the United Nations logo. The team did not set out to design the logo for the United Nations, but the badge became the prototype. It was initially designed by Donald McLaughlin, who worked for Mr. Lundquist as the director of graphics for the conference.

The distinctive blue in the design, Mr. Lundquist explained, was “the opposite of red, the war color.” He continued, “It was a gray blue, a little different than the modern United Nations flag.”

The symbol of the globe was also slightly different in the original design, he said: “We had originally based it on what’s called an azimuthal north polar projection of the world, so that all the countries of the world were spun around this concentric circle, and we had limited it in the Southern sector to a parallel that cut off Argentina because Argentina was not to be a member of the United Nations. We centered the symbol on the United States as the host country. Subsequently, in England our design was adapted as the official symbol of the United Nations, centered on Europe as more the epicenter, I guess, of the East-West world, and took into account the whole Earth, including Antarctica. By then, of course, Argentina had been made a member.”

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

Comments (1) | Filed under: Branding, Color, Marketing