Matthew Reinbold gave a presentation to the Northern Utah ColdFusion User's Group about using information visualization techniques to better display data manipulated with ColdFusion. He discussed challenges web developers face with large amounts of data and introduced concepts like grids, charts, bullet graphs, sparklines and word clouds to help make data more understandable. Reinbold provided examples of visualizing data with ColdFusion and recommended websites and books for further exploring information design best practices.

1. The Good, the Bad, and the
Beautiful
ColdFusion, Infovis, and You
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010

2. The Problem
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Dawn – 2003: 5EB
• Since: 5EB every two days
• (1EB = 1,152,921,504,606,846,976
bytes)

3. The Problem II
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• ColdFusion Makes Data Manipulation Easy
• But Many ColdFusion Developers Aren’t
Information Designers

4. The Problem III
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010

5. Why Me?
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Interned at IBM in 1999
• Graduated from SDSM&T, BS in Computer Engineering, 2000
• Coded Bug Tracking Systems at Digitech, 2001
• Helped Design Game Editors, Microsoft Game Studios, 2003
• Graduated from U of U with MBA, Emerging Tech Biz, 2003
• Conceived, Developed, and Maintained MasterControl
Analytics Module, 2004-2006
• Various Client Dashboards, including State of Oregon, FedEx,
2006-current at Vox Pop Design

6. Solutions: CFGrid
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Contrast Aids Comprehension
– Zebra Striping
– Row Highlighting
• Other Contrast Properties
– Size
– Shape
– Texture
– Position
– Orientation

7. Solutions: CFChart
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Simple Bar Chart
• Multi-Series Chart (and why 3D only makes it look fat)
• Multi-Series with Different Chart Types
• The Problem with Pie Charts
• Using Scaling to Emphasize Differences
• Simple Pareto Example

8. Solutions: Exotic
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Bullet Graphs
• Sparklines
• TreeMaps
• WordClouds

9. Solutions: Bullet Graphs
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Created Explicitly Because
of Gauges
• Gauges Display a single
key measure, sometimes in
the context of a range

10. Solutions: Bullet Graphs II
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010

11. Solutions: Bullet Graphs w CF
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• SparklineCFC Library by Fred Anderson

12. Solutions: Sparklines
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Useful for in line depictions of complex data
• SparklineCFC Library by Fred Anderson
• Tufte – Beautiful Evidence; http://www.edwardtufte.com/bboard/q-and-a-
fetch-msg?msg_id=0001OR

13. Solutions: Treemaps
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Great for displaying large sets of hierarchically structured data in the most
space-effeciet way possible
• Size denotes a quantitative variable
• Hierarchies are represented as rectangles within rectangles
• Color can denote a second quantiative variable
• Great for “drilling down”

14. Solutions: Treemaps II
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Treemap Java Library - http://treemap.sourceforge.net/

15. Solutions: Wordmaps
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• Quickly displays the relevant terms of a large body of work

16. Charting Critique: Oracle
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• http://www.perceptualedge.com/blog/?p=154

17. Possible Solution
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• http://www.perceptualedge.com/blog/?p=154

18. For More: Websites
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010
• PerceptualEdige.com (Stephen Few)
• FlowingData.com (Nathan Yau)
• Neoformix.com (Jeff Clark)
• Infosthetics.com (Andrew Vande Moere)
• EdwardTufte.com/bboard (um, Tufte)
• Recovery.Gov
• PoliticalMathBlog.com/?p=491 (Matthias Shapiro)

19. For More: Books
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010

20. Questions &
Possible Answers
Presented by Matthew Reinbold – Vox Pop Design – http://voxpopdesign.com
Northern Utah ColdFusion User’s Group (NUCFUG), August 18th
, 2010