Canvas Based Presentation - Zeroth Review
Download as PPTX, PDF2 likes1,675 views
Canvas Based Presentation Tool LandScape is a canvas based presentation tool that uses Scalable Vector Graphics (SVG) and JavaScript. It allows dynamic control of presentations by zooming, panning, and rotating on a large canvas without slide boundaries. Features include importing multiple media formats, templates, and motion paths for transitions. The goal is to create attractive presentations that are not too dependent on features of the viewing program and require only nominal browser resources. It integrates JavaScript manipulation of SVG objects created using the Inkscape editor.
![References
*1+ Edward R. Tufte, “The Visual Display of Quantitative Information”,
Second Edition, Graphics Press LLC, 2001.
*2+ W3C Recommendations, “Scalable Vector Graphics (SVG) 1.1”
(Second Edition)
http://www.w3.org/TR/SVG/
[3] Raphael.js, a cross-browser JavaScript library for drawing vector
graphics on websites
http://www.raphaeljs.com
[4] Apache Batik, Java classes for manipulating SVG
http://xmlgraphics.apache.org/batik/javadoc/
[5] Prezi, a cloud based SaaS presentation software
http://www.prezi.com
[6] Taymjong Bah, “Inkscape guide to a vector drawing program”, Third
Edition, Prentice Hall](https://image.slidesharecdn.com/finalcanvas-111130194907-phpapp02/85/Canvas-Based-Presentation-Zeroth-Review-14-320.jpg)
Canvas Based Presentation - Zeroth Review
- 1. Canvas Based Presentation Using SVG and Javascript S.Srikrishnan Final Year, CSE ‘B’ V.Vishal Gautham Final Year, CSE ‘B’ (Arvind Krishnaa J) (Final Year CSE ‘A’) Guided by R. S. Milton, Ph.D.
- 2. Presentation Paradigms Slide • Information is organized into slides. • Each slide typically consists of a list of bulleted points. Based • Eg., Microsoft PowerPoint, OpenOffice Impress etc., Canvas • The material to be presented is laid out in a large canvas without any page (slide) boundaries. Based • View can change orientation to suit the information to be presented.
- 3. Why not the Slide Based Paradigm? • Features can be complicated to use. • Tendency to skip slides – leads to distract the audience. • Single pre-set path. • Presence of content creator is not critical during the presentation.
- 4. Edward Tufte’s Views Edward Tufte • Slide-ware reduces the analytical quality of presentations. • Bullets are just raw facts listed point-wise. • Abuse of graphical technique. He is noted for his writings • Suggests the use of web on information design and as a browser as a pioneer in the field of data presentation tool. visualization.
- 5. Why Canvas Based Paradigm? • Tweaked to the • Animations and other level of detail the rich form of presenter wants multimedia to express • Presentation never Flexibility Attractive seems monotonous Focus Flow • Emphasis more on • Reflects the the central idea. presenter’s flow of • Audience thought process. concentrate better
- 6. Prezi – A Canvas Presentation Tool • Canvas based presentation software developed using Flash™. • Ideas explored on a virtual canvas. • Zooming in and out of presentation media (ZUI). • Text, images, videos can be grouped together as frames.
- 7. LandScape – Our Canvas Presentation Tool • Animates the presentation elements. SVG • Open standard • Supported by modern browsers. • Programmatically manipulate the JavaScript components of the presentation.
- 8. Scalable Vector Graphics (SVG) • Language for describing two- dimensional graphics in XML. • Three types of graphic objects – Vector graphic shapes – Images – Text • Objects can be grouped, styled, transformed and composited SVG Viewers Web Applications Browsers Inkscape “Vector graphics is more flexible Batik Squiggle than raster graphics”
- 9. Inkscape – An SVG Editor • Allows drag and drop creation of SVG. • Full fledged editor with advanced image processing support. • Animation toolbox allows individual elements to be animated. • JessyInk extension to Inkscape allows the creation of basic canvas presentations
- 10. Features and Drawbacks of JessyInk (a) Create both slide- (a) Limited set of based as well as canvas- features with respect to based presentations. animation, transition (b) Light-weight effects etc., extension to Inkscape (b) Poor performance in most browsers. (c) Not suitable for the common man to create.
- 11. LandScape User Interface Plugin for Inkscape Integrating a plugin using Python Raphaël.js Apache Batik Raphaël is a small JavaScript Creating/ Java-based toolkit for applications or library that should simplify your work with vector graphics Editing the applets that want to use images in the SVG format for various purposes, on the web presentation such as display, generation or manipulation
- 12. Features Features Dynamic Importing Multi- control of multiple Exporting Templates Platform Presentati media support on formats Text Motion Pan, zoom Exporting Export as outline as path for and rotate as SVG PDF notes for transitions presenter
- 13. Scope and Goal • Will be used to create attractive canvas based presentations. • Requires some level of expertise to create content. • May not have all features of commercially available software. • Useful for teacher to create lecture slides. • Presentation not too dependent on features of the viewer. • Browser requirements are quite nominal. • Integration of JavaScript layer over SVG.
- 14. References *1+ Edward R. Tufte, “The Visual Display of Quantitative Information”, Second Edition, Graphics Press LLC, 2001. *2+ W3C Recommendations, “Scalable Vector Graphics (SVG) 1.1” (Second Edition) http://www.w3.org/TR/SVG/ [3] Raphael.js, a cross-browser JavaScript library for drawing vector graphics on websites http://www.raphaeljs.com [4] Apache Batik, Java classes for manipulating SVG http://xmlgraphics.apache.org/batik/javadoc/ [5] Prezi, a cloud based SaaS presentation software http://www.prezi.com [6] Taymjong Bah, “Inkscape guide to a vector drawing program”, Third Edition, Prentice Hall