Revealing Tabris with reveal.js

Revealing Tabris with reveal.js

Creating and sharing presentations using most of the tools available today is a pain. I think this is mainly due to the fact that they mix content and design in one document and often do a poor job in keeping these concerns apart when the user is editing. When I used Keynote for the first time I was really impressed, but over time I found it had the same issues as all of the other programs.

How often have you spent hours fixing a layout bug for an otherwise finalized presentation? Indentation is my favorite. Or dealt with moving content into another slide deck with a different design and finally ended up with a complete mess?

For our Tabris Overview slide deck we tried something new, a completely web-based presentation. The slides are built with reveal.js. Reveal allows you to separate content (HTML, MarkDown) from layout (CSS) and offers a couple of nice features:
* You can navigate in 2 dimensions, which allows you to dive into specifics if necessary.
* Fancy animations.
* Some nice JavaScript allows you to zoom in (Alt-click), very handy for diagrams.
* You can get an overview of all slides (ESC).
* They even support speaker notes in another browser window (haven’t tried that).


The really nice thing about this approach is that slides can be put into git, be versioned, branched, forked and everything we like about version control. Plus, the slides can be put online on your web presence (yes, I know that slideshare exists, but then the content is hosted somewhere else).

So what do you think about the Tabris slides and reveal.js in general? How are you building your slides?

  • Stephan Leicht Vogt
    Posted at 21:39, 2013-03-20

    These are really nice slides, gratulation. I have to try this reveal.js for my next presentation. Thanks for the tip.

  • Michael Scharf
    Posted at 02:50, 2013-04-17

    Great slides! I really like the concept of Tabris.

    > How often have you spent hours fixing a layout bug for an otherwise finalized presentation?

    This is something that frustrates me a lot: too many tools require the user to be a graphics designer. For many applications (desktop-apps, web-apps, mobile but also text documents and presentations) the layout should be separated form the content. I think Knuth got it right, when he created TeX: layout and typography is a science and an art with many rules and most non-experts don’t get it right (look at all the ugly apps and word documents). Also the original versions of HTML did it right — mark up the text with semantics and let the browser decide how to render it.

    From the presentation I can see that Tabris is doing something similar by providing abstractions for common navigation concepts. I think this is the direction of the future for most applications: have clever algorithms or styling that cover the navigation and presentation concepts designed by experts (graphic designers and UI experts) and the programmers encode the business logic and the content of the application (on behalf of the customer).

    I wonder how much SWT/RAP Tabris applications allow abstracting the layout form the business logic. I have never used Tabris or RAP, but SWT is very explicit on layout (you even have to specify padding pixels in some layouts). I am not sure if something like stylesheets is the solution to the problem. I think of a higher level of abstraction where I somehow declare the intent and clever algorithms create the UI. Those algorithms encode the knowledge of graphics designers and UI experts — very much like TeX encodes the knowledge of typesetters for mathematical formula.

    Here the cycle closes: you want intentional presentations where you don’t have to fight the pixels and you want it to run on it in different contexts (present it and host it on a web page) and I want abstractions for UI that encode the knowledge of UI experts that renders nicely on different platforms..

    If Tabris/RAP solves the multi-platform presentation problem in a nice way, it is way ahed of the tools that allow the programmer build UIs either programmatically or graphically by drag-and-drop – most programmes are lousy graphics designers and that is how most applications look like…