strata - small is the new big: lessons in visual economy

Kim Rees, Periscopic

kim@periscopic.com@krees, @periscopic

Small is the New Big: Lessons in Visual Economy

INCONVENIENT

EXPEDIENT

Work with

Constraints

Sample Mobile Screen Resolutions• Android (Motorola

Droid)• Android (MyTouch)

• Android (Nexus One)

• Apple iPhone• Apple iPad• Palm Pre

480x854320x480480x800320x480 1024x768320x480

•Use input as output when possible.•Allow the space constraints to define

the interface.

Periscopic

•Compress, compress, compress.•Use degrees of contrast to focus

attention.

Heer, Panopticon

Periscopic

•Size and resize the data to fit the space.•Make use of controls that help shape

the space.

IMF

•Expand inward, not outward. This works like zooming out.

modelab

•Using input as output.•Hint at the invisible – what’s out of view.

Periscopic

TellSmallerStories

Bryan Christie Design

•Use context, but only minimally.

•Use interaction to reveal relationships individually.•Let the visitor create the story.

Ramage and Chuang, Stanford

•Fill in the details later.

Ikea

Get Specific

•Group as much related data together as possible.

Periscopic

•Encode multiple points together.•Marry qualitative and quantitative values.

Few

Freakalytics

•Show only as much data as is needed.

Making Virtual Solid

•Don’t overcomplicate. It’s okay to use a dot plot.

New York Times

Keep the Goal in Mind

•Show, don’t tell.•Remove or hide irrelevant data.

Hipmunk

•Highlight anomalies.•Don’t leave everything up to the viewer.

Periscopic

•Use high contrast colors or other means to focus attention•Show secondary information subtly.

Copley, Praxis; Wagner, DSCI

Utopia Compression

•Use context minimally.•Reduce colors and labeling to only the

essential.

Small Multiples

•Minimize and multiply.•Use interaction to expand on the data.

•Minimize and multiply.•Use interaction to expand on the data.

JULY 10-14 AVERAGESTucson 102Phoenix 109Flagstaff 98Sedona 99

•Use illustrations if necessary.

•Keep your set to a manageable number.

•Use animation to show subtle changes.

Ignatius Rigor

Kim Rees, Periscopic

kim@periscopic.com@krees, @periscopic

We’re hiring! See now.periscopic.com