Don’t call me DOM

I gave a couple of talks over the past month, where I chose not to use the W3C-traditional HTML-based slides (using Slidy), but instead to use a more graphical approach, using two different tools:

• Prezi, a Flash-based commercial tool that I used for a presentation I gave on Web 2.0 and beyond
• JessyInk, an open-source extension to the open-source SVG editor InkScape, with which I built the presentation I gave on W3C and the Social Web.

I’m summarizing below my experiences with both these tools.

Prezi

Prezi is a Flash-based tool, that allows both to build and show 2D-presentations.

I stumbled upon Prezi a few months ago, and was rather impressed by the type of presentations it allows to build: instead of working on slides that replace each other as you progress in the presentation, it offers an infinite canvas on which you zoom-in and out, translate and rotate during the presentation.

Beyond the rather impressive effects it creates when navigating through the presentation, I found it a rather inspiring writing model too: instead of organizing a presentation as a linear succession of topics that are all on the same level, it encourages thinking of topics as a map where you would focus on some points while keeping the big picture available.

I was rather pleased by what I managed to build for my presentation on Web 2.0, and based on the positive feedback I got after the presentations, I think the “slides” themselves helped carry the message I wanted to carry – although I could only really present half of what I wanted at that occasion since my alloted time was cut in half the minute before I went on stage. Of course, on a topic such as “Web 2.0”, it certainly helped to add a bit of bells and whistles to the supporting material…

The editor that Prezi provides is quite good, and I found it fairly simple to learn how to use it after watching a couple of the Prezi-based tutorials provided on the site; there are still some rough edges, and some limitations into what you can do with that editor – in particular, you cannot animate a specific part of the canvas e.g. to make some information appear as you progress in your presentation. Some of it might be a design decision to keep the tool simple, and I expect the rest might get fixed over time since the company Prezi seems to be getting some good level of funding.

There are unfortunately some pretty big problems with Prezi that makes it difficult for me to consider using it on a long term basis:

• it’s Flash-based, which means it relies on a non-standard technology, and for which it is hard to say how long it will remain readable; I don’t expect that many of my presentations will need to remain readable for a very long time, but it certainly doesn’t feel good to invest times in things whose lifetime is rather unclear;
• the only local export you can get from the tool is a Windows executable; presumably that executable mostly runs a Flash object, but that makes it even less good for interoperability and preservability
• since all of it is a blackbox, reusing elements from one presentation to the other, or re-using elements from somebody else presentation won’t work
• I have no idea if anything has been invested to make the resulting Flash accessible, but given the way the editor works, I strongly suspects that it is not; this also means that the content of my presentations have very little chances to be indexed by search engines.
• I didn’t find a way to make links from part of the presentation; while you wouldn’t necessarily follow links during the presentation itself, I have always found it a great assert for those that choose to look at your slides again after the presentation.

All in all, these problems appeared to be sufficiently big for me to explore other solutions that would allow to build the same kind of presentations, but without these limitations.

JessyInk/InkScape

The first time I heard about Prezi, I started looking for a possible equivalent in SVG, and I discovered that JessyInk was a pretty good candidate: it combines a Javascript library that deals with enabling simple navigation through a SVG document according to some conventions, with an extension to the fantastic InkScape SVG editor to make it possible to integrate effects, transitions and views from the editor itself.

But it wasn’t until a few weeks ago that I got confirmation that JessyInk now provides the tools needed to build Prezi-like effects, and so, when I was invited to talk on “W3C and the Social Web” at the 10th anniversary of the W3C Italian office I decided to give it a try to build my presentation.

The resulting “slides” were OK, but they clearly remain much more “slide-based” than what I would have done with Prezi.

A big reason for that is that JessyInk still uses slide as the basic unit for its operations – slides are based on Inkscape layers across which you can have transitions. This doesn’t encourage working on a completely 2D-based presentation, even though it allows fairly easily to zoom in and out in a particular slide.

Another problem with JessyInk is that the editing interface it offers is really sub-optimal; InkScape is a great SVG editor, but way too rich for the things you’re likely to need in a presentation-context – that said, having all this power at your hands can also help creativity in building diagrams and graphical illustration that you would likely dismiss as too complex in other environments.

The few user interfaces that the JessyInk extension adds to the editor are modal dialogs, with somewhat awkward wording and organization that don’t really make it intuitive to add effects. I was able to use it without too much trouble, but I don’t think I would feel comfortable recommending it to someone who doesn’t like fiddling with computers as much as I do.

I’m reasonably confident that the resulting slides are more accessible than the Prezi-ones, but I’m also pretty sure I would need to hand edit the (rather big) resulting SVG file to make it really accessible since again, the editor doesn’t provide easy ways to annotate the content you put in there. In particular, I’m not sure how accessible it is to use overlaid layers as based for separating content in slides.

Finally, the resulting slides are not visible for most Internet Explorer users (which cuts off a pretty large population), and I don’t think most search engines properly index SVG content either at this time.

That said, JessyInk offers the possibility to make local animations – one of the thing I was missing in Prezi; the interface doesn’t necessarily help to make the kind of effects I was looking for, but the potential is there and I think I could have gotten there with more time.

In the future

Despite the current defects I’ve found in JessyInk, I think I’m likely to try using it a few more times for presentations I would have to prepare, trying to force myself into reusing the 2D-concept rather than the easy path of using slides/layers.

I doubt I’ll find time to make proper bug reports to the JessyInk project on the usability of their interfaces, esp. as I am not sure how much leeway the Inkscape extension framework leaves there – but here is some hope that I would :)

I think I’ll look into getting reports on the accessibility of the resulting slides, though, since that’s clearly an important concern for me.

One thing I’m considering is turning my existing Prezi presentation into a JessyInk/SVG one, to evaluate how much of Prezi JessyInk can emulate, as well as see if it can help improve it; at the very least, it would provide me with a more reliable alternative of the presentation, but still nicer than the HTML version I had already built.

I think my ideal future for JessyInk would it for it be based on a more limited editing interface than JessyInk, possibly in a Web-based editor such as the one made possible by svg-edit, which would focus on the actual tasks you’re likely to consider when composing a presentation.