Datablick Presentation for 2013 Tableau Customer Conference

Preview:

DESCRIPTION

Using Design and Emotion to Create an Impactful Data Visualization This session will walk through the process of creating a data visualization based on product design principles and ideas, focusing on overall product goals and user context. A step by step walk through of the design process for two data products, "Twitter TV Set" and "Firework Injuries" will be used as examples to highlight the impact that design and emotion can add to a visualization.

Citation preview

Using design and emotion to create a data visualization product with impact

©2013 Tableau Software Inc. All rights reserved.

If your data viz was a product, would you spend your hard earned money (time) to purchase (look at) it?

©2013 Tableau Software Inc. All rights reserved.

A viz “product” should provide valuebased on user goals and context.

Which shoe is the best?

Git-R-Done! All I need are some tasty waves, a cool buzz,

and I'm fine.

Last Friday night….

It depends on the goal…

Git-R-Done! All I need are some tasty waves, a cool buzz,

and I'm fine.

Last Friday night….

It depends on the goal…

Git-R-Done! All I need are some tasty waves, a cool buzz,

and I'm fine.

Last Friday night….

And the context…

©2013 Tableau Software Inc. All rights reserved.

Product constraints

When designing a product - your ability to create and communicate is limited by many constraints such as:• Consumer

- Level of understanding of topic- format of display (i.e. print, blog, variable screen resolutions, etc.)- project sponsors goals- timeline / deadline

• Data - availability- data quality- size

• Designer- Technology and materials available (i.e. Tableau, D3, Illustrator, etc.) - skill / creativity / design - emotion

©2013 Tableau Software Inc. All rights reserved.

Product constraints

When designing a product - your ability to create and communicate is limited by many constraints such as:• Consumer

- Level of understanding of topic- format of display (i.e. print, blog, variable screen resolutions, etc.)- project sponsors goals- timeline / deadline

• Data - availability- data quality- size

• Designer- Technology and materials available (i.e. Tableau, D3, Illustrator, etc.) - skill / creativity / design - emotion

©2013 Tableau Software Inc. All rights reserved.

Doesn’t this skew the data?

©2013 Tableau Software Inc. All rights reserved.

Ursus Wehrli – "tidies up" works of art

©2013 Tableau Software Inc. All rights reserved.

Ursus Wehrli – continued

©2013 Tableau Software Inc. All rights reserved.

Every act of communication is a translation.

©2013 Tableau Software Inc. All rights reserved.

No man's life can be encompassed in one telling. There is no way to give each year its allotted weight, to include each event, each person who helped to shape a lifetime. What can be done is to be faithful in spirit to the record, and to try to find one's way to the heart of the man . . .• John Richard Briley

©2013 Tableau Software Inc. All rights reserved.

Emotion and Design

Similar data, differing emotion and impactBen Jones

Similar data, differing emotion and impactJerome Cukier

Similar data, differing emotion and impactPeriscopic

Using design and emotion given constraints

Fireworks, without the “fireworks”

Original inspiration

Dumb Ways to Die Schoolhouse Rock

Just a disclaimer – I am not anti firework!

©2013 Tableau Software Inc. All rights reserved.

First idea - using American and British soldiers being blown upCartoons courtesy of Ray Yuen rayuen.com

©2013 Tableau Software Inc. All rights reserved.

Show body parts or injuries on the body?

©2013 Tableau Software Inc. All rights reserved.

New inspiration…

©2013 Tableau Software Inc. All rights reserved.

Started to work on a comic book look and feel

Who doesn’t like some comedic gore?

A little layout and color inspiration as well…

©2013 Tableau Software Inc. All rights reserved.

Still playing with how to make the gore work

©2013 Tableau Software Inc. All rights reserved.

The final product….

©2013 Tableau Software Inc. All rights reserved.

Side by side comparison….

©2013 Tableau Software Inc. All rights reserved.

First draft was already made to have a “Twitter” look

©2013 Tableau Software Inc. All rights reserved.

The Voice

There is a voice inside of you

That whispers all day long,

"I feel this is right for me,

I know that this is wrong."

No teacher, preacher, parent, friend

Or wise man can decide

What's right for you--just listen to

The voice that speaks inside.”

~Shel Silverstein

©2013 Tableau Software Inc. All rights reserved.

Some of the tweets….

Trayvon Martin NSA

©2013 Tableau Software Inc. All rights reserved.

Some of the tweets….

Anthony Weiner Royal Baby

©2013 Tableau Software Inc. All rights reserved.

Jimmy Jet and His TV Set

I’ll tell you the story of Jimmy Jet—

And you know what I tell you is true.

He loved to watch his TV set

Almost as much as you.

 

He watched all day, he watched all night

Till he grew pale and lean,

From “The Early Show” to “The Late Late Show”

And all the shows between.

 

He watched till his eyes were frozen wide,

And his bottom grew into his chair.

And his chin turned into a tuning dial,

And antennae grew from his hair.

 

And his brains turned into TV tubes,

And his face to a TV screen.

And two knobs saying “VERT.” and “HORIZ.”

Grew where his ears had been.

 

And he grew a plug that looked like a tail

So we plugged in little Jim.

And now instead of him watching TV

We all sit around and watch him.

~Shel Silverstein

©2013 Tableau Software Inc. All rights reserved.

Working on getting that hand drawn look…

©2013 Tableau Software Inc. All rights reserved.

Doing layout and custom work in Photoshop

©2013 Tableau Software Inc. All rights reserved.

The Final Product

Using design and emotion can be effective in creating a data visualization “product” that had a strong impact and is therefore a success.

anya@datablick.com

Recommended