I had the privilege this summer of working with Jeremy Banks
, a Google Summer of Code
student whose project, Slide-Drive
, explored what a web-native presentation tool might be. Jeremy's work, which is a continuation of David Seifried's (described in these posts
), tries to solve a double-barrelled problem:
- Desktop presentation tools (like PowerPoint and Impress) allow people to mix text and graphics freely, just as they would on a whiteboard, but don't play nicely with the web. If you export a PowerPoint presentation, what you get is a bunch of image files that are opaque to search engines and accessibility tools. More importantly, perhaps, any hyperlinks in them are lost, and any CSS styling you apply to the page has no effect on what's in the slides.
- With HTML-based slideshow tools like S5 and deck.js, on the other hand, text is text, but they severely restrict what can go in a page—basically, you're back to paragraphs, bullet points, and tables. If you want to draw an arrow from one word to another as you would on a whiteboard, you have to fall back on embedded images (with all the limitations discussed above).
- Neither class of tool takes advantage of HTML5's multimedia features. For example, if you want to connect a slideshow to a voiceover, you have to either create a movie, which means your content is just pixels painted on the screen once again.
Slide-Drive's approach is to use SVG for the slides rather than PNG or JPEG images, so that hyperlinks work, text can be selected and copied, accessibility tools and search engines can "see" the text, and so on. Synchronization with other media (like a voiceover soundtrack) is done using Popcorn.js
(think "jQuery for video") and Butter, a browser-based multimedia editing tool. This recorded Slide-Drive presentation
will show you how it all works, but if you want to see it in action, you can run the presentation
in your own browser. (Warning: the source file is large, so it may take a while to load.)
Slide-Drive isn't ready for everyday use just yet: there turned out to be a lot of nasty surprises lurking in the darker corners of the SVG standard, various browsers' handling of fonts, and other areas discussed in Jeremy's blog
. But we're more excited than ever about this approach's potential; as I said a few weeks ago
, some of these ideas could and should
be part of any next-generation web-based ebook-slash-teaching-platform. If you'd like to explore it with us, please check it out