WebSlides

A package for creating online presentations for the web browser based on HTML and JavaScript.

Motivation

WebSlides is my personal effort to create functional slides for my lectures. They are currently tested and iteratively improved in the progress of my lecture on Virtual Reality in the winter term 2011 at Bielefeld University. The lecture itself will also be a good example on using the framework. The language, however, is German.

Previously, I used Microsoft PowerPoint to create my slides. However, my lectures and talks often require the presentation of formulas. This made me switch to LaTeX/Beamer, which is much more efficient in this regard. I was, however, still not satisfied. This is why I started to reconsider and kept my eyes out for something else.

In Spring 2011, I stumbled upon the S5 framework by Eric A. Meyer, which allowed to use HTML to create presentations. With my dusty knowledge of HTML and JavaScript, I started working on WebSlides and used it for the first time in a Seminar on Virtual Reality in Summer 2011.

Features (partly planned)

• Media Support (graphics, sound, video)
• Mathematic Formula (LaTeX notation)
• Animations
  • page transitions
  • incremental content
• Interactive 3D graphics
  • online editor
• Themes

Current State

• Media Support - WebSlides supports all media supported by modern browsers. This is quite nice, especially with the availability of HTML5 and the video tag. It is, however, at the moment a little cumbersome to use the video tag, as there is no common format. But you can easily embedd YouTube videos, if you have online access.
• Interactive 3D Graphics - This is the killer-feature I required for my current lectures on Virtual Reality: the presentation of interactive 3D content on my slides was what I wanted. The best thing: in the current implementation, the content can also be edited on the fly during the talk. All of this was enabled by the guys from X3DOM, who brought us X3D into the HTML world.
• Mathematic Formulas -  Being a scientists, I am naturally writing most of my papers using LaTeX. Using LaTeXMathML, a ingenious JavaScript created by Douglas R. Woodall, I was able to translate LaTeX syntax to MathML on the fly. The current version of WebSlides makes use of LaTeXMathML. In the meantime, I have stumbled upon Mathjax, which seems to support similar features and more. I will evaluate this and it could well be that feature version of WebSlides rely on Mathjax.
• Cross-Plattform - As WebSlides use (or will use, one I arrive at 1.0) HTML5, it should be supported on most plattforms.
• Easy Versioning - Especially when creating larger talks or lectures, it is essential to do some basic versioning. E.g. if you create specific versions of a lecture for normal terms, summer schools, etc. Doing this with PowerPoint and others is not that comfortable. Based on HTML5 it is easier to manage all the content using SVN or GIT.
• Theming - The layout of the slides should be easy to change and adjust to the own preferences or a corporate design. This can basically be achieved using CSS. This, and the expandability (the next point) is still work in progress. The current implementation is more a proof-of-concept.
• Expandability - Not all users might need every aspect of WebSlides. Most might not need support for 3D graphics. Some even might not need mathematic formulas. Others might have need I have not foreseen. The idea is to create a basic framework, which can be easily configured and extended. This, however, is currently work-in-progress.
• Bibliography - (planned) - A comfortable support for a bibliography is also a feature I consider highly relevant, but I simply did not have to time yet to do it. Suggestions are welcome!

Demo

To see WebSlides in action, you can try out a small Introduction and Demo of WebSlides. Or you can visit the slides to the current lecture on Virtual Reality, and especially the chapter on visual perception (German).

Download

• WebSlides - Version 0.1 of April 1st, 2011

Contact

Your comments and suggestions are welcome. Please contact me at Thies.Pfeiffer@Uni-Bielefeld.de.