Wednesday, February 24, 2010

Whip out your I.D.s!: Informational Design, Instructional Design, and User Interface Design (pt.1)


Note: At first, this may seem a deviation from my focus on educational gaming but read on, dear friend, and enlightenment will come…

(Good karma, and tasty too. These tiny Buddha babies are pears grown within Buddha molds ==  #@$i12-ing awesome!) 


Circuitous Introduction
This semester, I’m taking a class on visualizing data, and it’s been ehh – pretty good. Lectures are overly simple and I have a hard time focusing on them (or going to them, heh heh), but the homework has been really useful: I’ve learned regular expressions, data-scraped a couple of websites, learned the fundamentals of Processing, a Java-based programming language for visual design, and thought of a really killer idea for my final project (Be prepared for May 2010, when my final project finishes development…it will blow your mind and change your dietary habits forever!...or so the current [really lame] marketing slogan goes).  In any case, last week we had to find, critique, and redesign some data visualizations.

As I've seen and learned, the overarching difficulty for a designer is balancing aesthetic consciousness with good design principles and proper expression of data. 

There was one visualization that particularly epitomized this problem. The designer in question? David McCandless, a self-described Information Designer with an interest in “how designed information can help us understand the world, cut through BS and reveal hidden connections, patterns and stories underneath.” Of his many notable accomplishments, McCandless has created a webpage, Information is Beautiful, won numerous awards, been featured all across the Internet, and published a book, The Visual Miscellaneum: A Colorful Guide to the World’s Most Consequential Trivia. Clearly, he’s somewhat of a hot shot. 


Designer focus: David McCandless (McCandles would have been so much cuter.)
There’s no doubt that the McCandless’ work is eye-catching and provocative: the data covers interesting topics (“Haiti Earthquake: Who’s given what?”, “What does China censor online?”, etc.), the colors used are vibrant and varied, and the shapes clean and vectorized. For the aesthetic enthusiast or information junkie, it’s a feast: delectable eye candy drizzled with stimulating brain candy. As a (brutally unscientific) measure of its visual impact, one common reason for purchase is its use as a coffee table decoration, presumably to instantly impress upon guests one’s unique intellectual bent. After all, how better to express your quirky love for knowledge than vibrant data on the time it takes different condiments to spoil? 

Worried about looking stupid in front of a potential love interest? Just put this book on your coffee table and she’ll realize your empty, awkward silences are actually moments of profound, unfathomable intellect.


So far, so good. It's clear that McCandless’ problem does not lie within his choice of content, and it certainly does not lie within his technical and artistic abilities (for they are substantial). What is the culprit then? None other than his fetish for transmogrifying the data so much that the fidelity of the data is destroyed. When the data – the base supporting the visualization’s very existence – is misconstrued, the visualization cannot be trusted and its value falls by a landslide. Quite astonishingly, McCandless is unapologetic for having deceptive visualizations. On the design I analyzed (“The Billion Dollar Gram”), he unabashedly states that there was “a little visual cheating to make everything fit.” Close inspection of the visualization shows obvious anomalies; for example, the area of Facebook’s $15 billion is larger than the area of Online Advertising’s $20 billion:

No no no, the LARGER rectangle represents the SMALLER amount. What are they teaching you in school these days??


No matter how high up the income ladder you may be, $5 billion is no chump change. This isn’t a data visualization – it’s one of those whacked up psychology tests where you’re seeing one thing and reading another!  

Y..no, Green, Bl-Red, Orange,.......
….I give up.

As if that wasn’t bad enough, there’s another serious problem: what are the numbers for “Facebook” and “Online Marketing” quantifying? Facebook’s net worth? Facebook’s profits? Online advertising’s revenue? The cost online advertising has inflicted on traditional print advertising? Revenue/profits/net worth/costs are HUGELY different. What is the point of looking at a visualization of data if 1) the visualization deceives and 2) the data is incomprehensible? I remind you that this work is from a highly acclaimed, published designer whose mission is to “cut through BS.” 
Maybe BS looks different when you have purple squares magically hovering before your eyes…
(McCandless’ profile pic)


Final thoughts on data visualizations and David McCandless (who hopefully never finds my blog. Or hopefully does. In which case my ego would become very, very large.)
I’m a bit unsure about my final thoughts on McCandless. On one hand, as I’ve stated, I’m really peeved about some of his designs and his disinterest in fixing some huge errors. If McCandless insists on bastardizing the data, then, well, he’s killing the main point of informational design: to inform efficiently and effectively.  It’s not just the deceitful data. McCandless has used design techniques that are clearly NOT optimal for presenting information. For example, the Billion Dollar Gram uses areas to represent amounts (the human mind is not good at measuring area – length is more comprehensible), as well as random colors that create false groupings. On the other hand, through his digital artwork, McCandless has made a lot of information more approachable to people. As someone who sees the potential in using technology to educate, I can’t help but be supportive of this kind of thing. Some of his designs are simply gorgeous, thought provoking, and at the very least, spur some great intellectual discussion online (for an example of one that I liked, see When Sea Levels Attack!).

So, what do you think?
        Do you support McCandless for making information more approachable?
        Or do you think he’s fundamentally wrong for bastardizing the data?


Next time: Front-end vs. Back-end in User Interface Design
Being able to present information clearly and pleasingly while maintaining the fidelity of the data is difficult. It requires an excellent designer who values the data and the user, a designer who doesn’t exploit graphics to enthrall and detract from the lack of usable, factually correct data. That is not to say good graphics are not important; a boring, visually ugly design will garner no interest and will be just as (or even more) useless.

The problem between balancing the front-end (look and feel) versus the back-end (code and data) similarly arises in user interface design, also called interaction design. The value of good user interface design is becoming an increasingly recognized, due in large part to the successes of companies employing user-friendly interfaces (iPod and Google search, to name a few of the most popular). This is a good segway to part 2, in which I will examine the user interface design of applications and programs (including, yes! - educational games). Let’s end with a quote, which we expand on next time. It seems to have been inspired by a cadre of McCandless-like User Interface Designers. Hmm.:

“We often see products that look really good – whose aesthetics are superb – but whose functionality or whose interactivity isn’t adequate. That is not because the product wasn’t designed, but because it was designed by an aesthetic, visual designer rather than by an interaction designer with the tools to master cognitive friction" 
-Alan Cooper, The Inmates are Running the Asylum, pg. 212







No comments:

Post a Comment