Web Visualization Tools & Approaches for Information Visualization on the Web
Pedro Lopes | pedrolopes@ua.pt | PDEI - TAEI2: Data Visualization | June 26th, 2009
Acknowledgement: The research leading to these results has received funding from the European Community's Seventh Framework Programme (FP7/2007-2013) under grant agreement nยบ 200754, the GEN2PHEN project.
Thursday, June 25, 2009
Outline ‣ Introduction ‣ History ‣ Approaches ‣ Tools & Technologies - Flash - Silverlight - AJAX - Comparison ‣ Conclusion
Thursday, June 25, 2009
Introduction ‣ World Wide Web has evolved - Primary media for knowledge exchange - Internet is main platform for Electronically Delivered Content ‣ Applications have also evolved - Desktop is being replaced as the main application platform ‣ We have three main challenges now - Move complex desktop visualization applications to the web - Improve existing web user interfaces - Create powerful data visualization components that can be used by any developer
Thursday, June 25, 2009
Some history... ‣ Content in the web has changed - Text > Graphics > Multimedia - Rich Internet Applications ‣ Paradigm change - Desktop applications in the Web ‣ VRML, Java Applets
- Use web tech to resemble desktop applications ‣ Flash, Silverlight, AJAX
Thursday, June 25, 2009
Approaches [textual content visualization] ‣ Display large text content and its relations in a visually appealing format
http://universe.daylife.com http://newsmap.jp
Thursday, June 25, 2009
Approaches [textual content visualization] ‣ Display large text content and its relations in a visually appealing format
http://universe.daylife.com http://newsmap.jp
Thursday, June 25, 2009
Approaches [maps] ‣ Several Maps APIs allow the creation of new geograpy-based visualizations
Google Maps Eurovision Contest
Thursday, June 25, 2009
Approaches [interactive timelines] ‣ Static timelines do not provide enough interaction
http://rssvoyage.com http://bit.ly//pnRur
Thursday, June 25, 2009
Approaches [interactive timelines] ‣ Static timelines do not provide enough interaction
http://rssvoyage.com http://bit.ly//pnRur
Thursday, June 25, 2009
Flash [technology] ‣ Adobe - Initially created for designers ‣ Latest versions more developer-oriented ‣ Features - Visually rich and interactive applications - Allows the creation of complex 3D models - Cross-platform ‣ Requires plugin
Thursday, June 25, 2009
Flash [tools] ‣ Several pre-built components ‣ Flare Actionscript collection
http://flare.prefuse.org Thursday, June 25, 2009
Flash [tools] ‣ Several pre-built components ‣ Flare Actionscript collection
http://flare.prefuse.org Thursday, June 25, 2009
Flash [tools] ‣ Several pre-built components ‣ Flare Actionscript collection
http://flare.prefuse.org Thursday, June 25, 2009
Flash [tools] ‣ Several pre-built components ‣ Flare Actionscript collection
http://flare.prefuse.org Thursday, June 25, 2009
Silverlight [technology] ‣ Microsoft - Created for developers - Response to Flash’s hegemony ‣ Quite similar to Flash
‣ Features - Huge support for developers ‣ ASP.NET integration
- Cross-platform (almost) ‣ Requires plugin
Thursday, June 25, 2009
Silverlight [tools] ‣ Diverse set of pre-built components ‣ Descry framework
http://www.visitmix.com/labs/descry/theobesityepidemic/ http://www.visitmix.com/labs/descry/theirfirstwords/
Thursday, June 25, 2009
Silverlight [tools] ‣ Diverse set of pre-built components ‣ Descry framework
http://www.visitmix.com/labs/descry/theobesityepidemic/ http://www.visitmix.com/labs/descry/theirfirstwords/
Thursday, June 25, 2009
AJAX [technology] ‣ Javascript based - Asynchronous XML and Javascript ‣ Open Source development - Many (many) frameworks ‣ Features - Asynchronous data exchanges - No full page refresh ‣ No white screens
- Cross-platform ‣ No plugin required
Thursday, June 25, 2009
AJAX [tools] ‣ The larger set of frameworks... ‣ MIT Similine, JIT, jQuery, Prototype....
http://simile.mit.edu/timeline/ http://thejit.org/
Thursday, June 25, 2009
AJAX [tools] ‣ The larger set of frameworks... ‣ MIT Similine, JIT, jQuery, Prototype....
http://simile.mit.edu/timeline/ http://thejit.org/
Thursday, June 25, 2009
AJAX [Google] ‣ Google Visualization API: the best framework
http://code.google.com/apis/visualization/
Thursday, June 25, 2009
AJAX [Google] ‣ Google Visualization API: the best framework
http://code.google.com/apis/visualization/
Thursday, June 25, 2009
AJAX [Google] ‣ Google Visualization API: the best framework
http://code.google.com/apis/visualization/
Thursday, June 25, 2009
Demo
Thursday, June 25, 2009
Demo
Thursday, June 25, 2009
Comparison Flash
Silverlight
Javascript
Google API
Ease of Use
Learning Curve
Adaptability
Number of Tools
Future
Overall
Thursday, June 25, 2009
Comparison Flash
Silverlight
Javascript
Google API
Ease of Use
Learning Curve
Adaptability
Number of Tools
Future
Overall
Thursday, June 25, 2009
Conclusion ‣ Internet is the main communication platform ‣ We have to use it! ‣ So much information available online... ‣ How to offer good insights about information? ‣ Good information visualizations ‣ Choose datasets wisely ‣ Answer one question with each visualization ‣ Be agile ‣ Remember usability
Thursday, June 25, 2009
Thank You!
Thursday, June 25, 2009
Questions?
Thursday, June 25, 2009