Better Information from Better Visualization

1. Better Information from Better Visualization Nicole Arksey, Inetco Systems Ltd Scott Chapman, American Electric Power

2. Who we are • Nicole – Manager, User Experience and Web Application Group, gets paid to come up with new ways to make it easier for people to understand their data. • Scott – Mainframe capacity and performance guy, gets paid to improve and explain mainframe performance and capacity. That often involves visualizing data that is voluminous, complicated, or both. • Y’all – here to keep us honest and make this interactive!

3. Why Good Visualizations Are Important

4. Why Good Visualizations Are Important Source: http://peltiertech.com/WordPress/use-bar-charts-not-pies/

5. Outline PART 1: Making Bad Visualizations Better PART 2: Visualization Guidelines

6. PART 1: Making Bad Visualization Better

7. Response times by region

8. Response times by region

9. Response times by region

14. CPU Utilization

15. CPU Utilization

16. CPU Utilization

17. Real Time Application Status

18. Real Time Application Status(Bullet Charts) Average Value Current Value Threshold Box

19. Application Performance

20. Application Performance(Sparklines) Max Value Current Value Thresholds Min Value Max, Min and Average

21. Number of Incidents

22. Number of Incidents(with historical perspective)

23. Number of Incidents(variation from SLA)

24. Number of Incidents(Just what’s needed)

25. CPU Delay By Hour(Heat chart)

26. CPU Delay By Hour

27. Transaction Data

28. Transaction Data(Bubble Charts)

29. Transaction Data(Parallel Coordinates)

30. PART 2: Visualization Guidelines

31. Determine your message first • Your data tells a story—have a clear vision of that story • Are you showing: • Value changes over time? • Ratios? • Comparisons to thresholds? • Relationships between changing values? • What conclusion do you want your audience to come to? • If you find you have too much data, think about what really needs to be shown to support the intended conclusion • Consider highlighting data that supports the conclusion

32. Picking a chart:Values changing over time • Classic Line chart • Widely used and easily understood • May be hard to find individual data values on the line • Consider adding data markers (carefully, can lead to cluttered chart) • Wide variability between data points can lead to difficult to read chart • In Excel, consider using data markers only—no line • Area chart • Very similar to line chart, but with more “weight” • Sparklines • Small line charts, meant to be displayed with other information

33. Picking a chart:Ratios and Comparisons • Beware the pie chart! • More difficult to perceive differences between angles than length • If more than a few slices, labeling becomes difficult • Consider bar charts • Bar length makes differences easier to perceive • Consider ordering the observations intelligently • Can effectively display many more values • Heat maps for large quantities of data • Can be difficult to interpret details • Work best when interactive with tool tips or click-through to details • Consider bullet graphs for threshold comparisons • Much more compact than speedometers

34. Picking a chart:Finding relationships • Scatter plots • Good for comparing two quantative values • Correlation generally stands out visually • Bubble charts • Can be used similarly to scatter plots but variances in bubble size and color can encode two more variables • Can be difficult to discern small differences in size/color • Interactive bubble charts can be very compelling though • Parallel Coordinates • Can be used when variables are both quantitative and qualitative • Can help you see correlations between multiple variables • Can be used with very large number of observations • Limited tooling available

35. Colors • Use white as your background for your chart • Consider intensities of a single color for data ranges • Use less saturated colors • Reserve vivid colors for highlighting particular data points • Consider gray scale for most data, reserving color for highlights • Use different colors with similar intensities to denote categories of data • Color blindness is common! • Red-green: 7-10% • Yellow-blue: 6% • Free check tool available at vischeck.com

36. Chart Junk • Don’t include what’s not needed! • Don’t let visual effects distract the reader from the story of your data • Unless obfuscation is the goal • 3-D effects are often overused and unnecessary • Avoid unnecessary gradients, icons, and backgrounds • Sometimes a background indicating thresholds may be ok • Grid lines don’t need to be dark • Y-axis should usually start at zero

37. Tools – everyday use • SAS (and R?) • Great for data analysis • Sophisticated graphical output, with a significant learning curve • Excel and other spreadsheet programs • Less sophisticated data analysis • Much easier to produce customized graphs • Consider combining • Use SAS/R for initial data analysis, producing a CSV file • Use Excel to read the CSV file and produce charts • Data range input can be set up to automatically re-read the data when the spreadsheet is opened

38. Tools – Libraries for Web Apps • A lot more work than Excel • Appropriate for important daily charts • Need HTML, CSS, JavaScript skills • Or a package that creates the web pages for your • Multiple JavaScript libraries available, many free • Protovis and D3 (poor support for IE <9) • Plotr / Flotr / Flotr2 • Raphaël / gRaphaël • YUI Charts • Dojo Charts • JSCharts (commercial licensed) • Highcharts (commercial license)

39. Tools - other • Parallel Coordinates • Parvis • XDAT • GGobi • Many Eyes • Try multiple visualization techniques on your data • See other people’s visualizations • http://www-958.ibm.com/software/data/cognos/manyeyes/

40. Questions?