Bringing Networks to Life:Data visualization for user engagement
About KeyLines• A JavaScript web application SDK• Pure HTML5 network visualization• Graph layouts and analytics• Customizable appearance &
functionality• Full event model• Fast performance• Excellent developer support
What does data look like?
It’s definitely blue, right?
Sometimes green…
What does data look like?
(Answer: It’s invisible)
What is network visualization• Also known as graph visualization• Visualizing connected data• Interactive node-link diagrams
Three rules of data visualization1. Visualization must be efficientOtherwise users misinterpret data, or miss key insights
2. Visualization must be intuitiveOtherwise users won’t know what they’re looking at
3. Visualization must be engagingOtherwise users will be bored, or not use it at all
Visualization must be efficient
Combine Nodes
Utilize Filters
Display Dependencies
• Understand your data model• Limit your variables • Limit volume of data • Aggregate and group where possible • Use intuitive attributes• Offer the ‘right’ layouts
Visualization must be efficient
George Bush looking at Osama Bin Laden's financial network (AP Photo / Doug Mills)
Visualization must be intuitive
Plan Your Interactions
Plan Your Emphasis Methods
• Define your question• Plan your interactions • Plan your emphasis methods • Use a meaningful color scheme• Forget using 3D• Use only functionality that answers
the question
Visualization must be intuitive
Visualization must be engaging
Consistent Interactions
Use Animation (Sparingly)
• Know your users• Seamless integration into existing
tools• Consistent interactions• Easy chart navigation • Explore and expand on demand • Add animation (sparingly)
Visualization must be engaging
Thanks! Any Questions?
[email protected]@Key_Lines