Information Radiation and You

by https://speakerdeck.com/pvande

Embed

Start on current slide

Slide 1

Slide 1 text

Open Source Bridge 2012 Information Radiation and You http://www.ﬂickr.com/photos/evil_cheese_scientist/6813664844

Slide 2

Slide 2 text

About Me Pieter van de Bruggen UX Designer at Puppet Labs Software Enthusiast and Developer [email protected] Github / Dribbble / Twitter: @pvande

Slide 3

Slide 3 text

Terminology

Slide 4

Slide 4 text

Knowledge (n): the set of things we can know Terminology

Slide 5

Slide 5 text

Data (n, singular datum): measurements, facts, and premises from which conclusions may be drawn; fundamental knowledge Terminology

Slide 6

Slide 6 text

Information (n): knowledge gather as the result of processing or analyzing data Terminology

Slide 7

Slide 7 text

Information Radiator (n): a tool for constantly presenting up-to-date information Terminology

Slide 8

Slide 8 text

What is an Information Radiator? What do they look like?

Slide 9

Slide 9 text

ASARCO Globe Smelting Plant ﬂickr.com/photos/sugarandweedkiller/4456565684

Slide 10

Slide 10 text

ﬂickr.com/photos/jankrutisch/4272142306 mindmatters

Slide 11

Slide 11 text

Github ﬂickr.com/photos/unavoidablegrain/4622043091

Slide 12

Slide 12 text

targetprocess.com/blog/tag/information-radiator Target Process

Slide 13

Slide 13 text

Panic panic.com/blog/2010/03/the-panic-status-board

Slide 14

Slide 14 text

Why have an Information Radiator? What are they good for?

Slide 15

Slide 15 text

Empowerment Why have an Information Radiator?

Slide 16

Slide 16 text

Improvement Why have an Information Radiator?

Slide 17

Slide 17 text

Situational insight Why have an Information Radiator?

Slide 18

Slide 18 text

ﬂickr.com/photos/redvers/523072182

Slide 19

Slide 19 text

What makes a useful Information Radiator? How can I succeed?

Slide 20

Slide 20 text

Conspicuous Easily absorbed by a casual, interested observer What makes a useful Information Radiator?

Slide 21

Slide 21 text

Clear Easily understood at a glance What makes a useful Information Radiator?

Slide 22

Slide 22 text

Consistent Easy to spot changes from day to day What makes a useful Information Radiator?

Slide 23

Slide 23 text

Insightful Useful to the intended audience, and meeting their needs What makes a useful Information Radiator?

Slide 24

Slide 24 text

Volatile Changes periodically, making it worth revisiting What makes a useful Information Radiator?

Slide 25

Slide 25 text

Maintainable Easy to keep up to date What makes a useful Information Radiator?

Slide 26

Slide 26 text

What makes for an insightful Information Radiator? Can I put just anything up?

Slide 27

Slide 27 text

What do you hope to gain? What makes for an insightful Information Radiator?

Slide 28

Slide 28 text

What do you hope to gain? Better communication with other teams What makes for an insightful Information Radiator?

Slide 29

Slide 29 text

What do you hope to gain? Improved productivity What makes for an insightful Information Radiator?

Slide 30

Slide 30 text

What do you hope to gain? Disaster prevention What makes for an insightful Information Radiator?

Slide 31

Slide 31 text

Who is your audience? What makes for an insightful Information Radiator?

Slide 32

Slide 32 text

Who is your audience? What are the things they need to know? What makes for an insightful Information Radiator?

Slide 33

Slide 33 text

Who is your audience? How much detail do they really need? What makes for an insightful Information Radiator?

Slide 34

Slide 34 text

Who is your audience? How is the information related? What makes for an insightful Information Radiator?

Slide 35

Slide 35 text

What is your data? What makes for an insightful Information Radiator?

Slide 36

Slide 36 text

Why is your data important? What makes for an insightful Information Radiator?

Slide 37

Slide 37 text

0 20 40 60 80 100 January February March April May June July August September October November December Emails Sent Number of Emails What makes for an insightful Information Radiator?

Slide 38

Slide 38 text

0 20 40 60 80 100 January February March April May June July August September October November December How Many Spiders Have We Squished? Dead Spiders What makes for an insightful Information Radiator?

Slide 39

Slide 39 text

Slide 40

Slide 40 text

0 20 40 60 80 100 January February March April May June July August September October November December How Many Spiders Have We Squished? Dead Spiders f(x) – Distance What makes for an insightful Information Radiator?

Slide 41

Slide 41 text

0 4 8 12 16 20 January February March April May June July August September October November December How Fast Were We Squishing Spiders? Dead Spiders per Month What makes for an insightful Information Radiator?

Slide 42

Slide 42 text

0 4 8 12 16 20 January February March April May June July August September October November December How Fast Were We Squishing Spiders? Dead Spiders per Month f′(x) - Velocity What makes for an insightful Information Radiator?

Slide 43

Slide 43 text

-15 -12 -9 -6 -3 0 3 6 January February March April May June July August September October November December Were We Becoming More or Less Efficient at Squishing Spiders? Dead Spiders per Month (per Month) What makes for an insightful Information Radiator?

Slide 44

Slide 44 text

Slide 45

Slide 45 text

0 3 6 9 12 15 System Uptime Consecutive Uptime (in Days) What makes for an insightful Information Radiator?

Slide 46

Slide 46 text

0 3 6 9 12 15 System Uptime Consecutive Uptime (in Days) What's Interesting? What makes for an insightful Information Radiator?

Slide 47

Slide 47 text

0 3 6 9 12 15 System Uptime Consecutive Uptime (in Days) What's Interesting? What makes for an insightful Information Radiator?

Slide 48

Slide 48 text

0 3 6 9 12 15 System Uptime Streaks Consecutive Uptime (in Days) What makes for an insightful Information Radiator?

Slide 49

Slide 49 text

0 3 6 9 12 15 System Uptime Streaks Consecutive Uptime (in Days) Streak Length Moving Average (previous 3) What makes for an insightful Information Radiator?

Slide 50

Slide 50 text

System Uptime Best: 15 Days Average: 8 Days Current: 3 Days What makes for an insightful Information Radiator?

Slide 51

Slide 51 text

System Uptime Best: 15 Days Current: 3 Days What makes for an insightful Information Radiator?

Slide 52

Slide 52 text

What’s the Frequency, Kenneth? 0 1000 2000 3000 4000 5000 00:00 04:00 08:00 12:00 16:00 20:00 00:00 Server Load Requests per Second Today Yesterday $0K $100K $200K $300K 2007 2008 2009 2010 2011 2012 Sales by Year Sales (in dollars) What makes for an insightful Information Radiator?

Slide 53

Slide 53 text

Historical visualizations are great for shaping long-term direction and decisions… What makes for an insightful Information Radiator?

Slide 54

Slide 54 text

…but they frequently have little to say about what is happening right now. What makes for an insightful Information Radiator?

Slide 55

Slide 55 text

At best, they provide an incomplete picture. What makes for an insightful Information Radiator?

Slide 56

Slide 56 text

Let your information radiator talk about today. What makes for an insightful Information Radiator?

Slide 57

Slide 57 text

Let your information radiator talk about today. (But keep the data around!) What makes for an insightful Information Radiator?

Slide 58

Slide 58 text

“Above all else, show the data.” ~ Edward Tufte What makes for an insightful Information Radiator?

Slide 59

Slide 59 text

…No. ﬂickr.com/photos/elainegreycats/29404108

Slide 60

Slide 60 text

0% 25% 50% 75% 100% Percent complete 2007 2008 2009 2010 Year Memorial Completion by Year Monument ‘A’ Monument ‘B’ What makes for an insightful Information Radiator?

Slide 61

Slide 61 text

0% 25% 50% 75% 100% 2007 2008 2009 2010 Memorial Completion by Year Percent complete Year Monument ‘A’ Monument ‘B’ What makes for an insightful Information Radiator?

Slide 62

Slide 62 text

0% 25% 50% 75% 100% 2007 2008 2009 2010 Memorial Completion by Year Monument ‘A’ Monument ‘B’ What makes for an insightful Information Radiator?

Slide 63

Slide 63 text

Estimated Completion Dates Monument ‘A’: ˛ 2011 Q1 Monument ‘B’: ▼ 2014 Q3 What makes for an insightful Information Radiator?

Slide 64

Slide 64 text

ﬂickr.com/photos/dhaun/5640386266 CI Build Status

Slide 65

Slide 65 text

targetprocess.com/blog/tag/visualization CI Build Status

Slide 66

Slide 66 text

What do other status systems do?

Slide 67

Slide 67 text

ﬂickr.com/photos/jackcheng/6114860434 Flight Schedules

Slide 68

Slide 68 text

Crossing Signal ﬂickr.com/photos/sp8254/2052235918

Slide 69

Slide 69 text

ﬂickr.com/photos/wafﬂechomper/1425183970 Digital Traffic Displays

Slide 70

Slide 70 text

Stock Tickers ﬂickr.com/photos/ddebold/5900034065

Slide 71

Slide 71 text

How Do I Build an Information Radiator? What do I need to do?

Slide 72

Slide 72 text

alistair.cockburn.us/Information+radiator Analog

Slide 73

Slide 73 text

Digital panic.com/blog/2010/03/the-panic-status-board

Slide 74

Slide 74 text

Tranquil How Do I Build an Information Radiator?

Slide 75

Slide 75 text

Tranquil Standard web technologies How Do I Build an Information Radiator?

Slide 76

Slide 76 text

Tranquil Basic JSON conﬁguration How Do I Build an Information Radiator?

Slide 77

Slide 77 text

Tranquil Fully customizable How Do I Build an Information Radiator?

Slide 78

Slide 78 text

Tranquil Simple Sinatra application… How Do I Build an Information Radiator?

Slide 79

Slide 79 text

Tranquil …or hosted service (BYOD) How Do I Build an Information Radiator?

Slide 80

Slide 80 text

No content

Slide 81

Slide 81 text

Project Information Homepage: github.com/pvande/Tranquil Widget Type Reference: github.com/pvande/Tranquil/wiki/Types

Slide 82

Slide 82 text

Information Design Edward Tufte: edwardtufte.com Steven Few: perceptualedge.com The InfoVis Wiki: infovis-wiki.net

Slide 83

Slide 83 text

Thank You