Markdown and Mdpress for Presentations

I see Prezi presentations instead of PowerPoint slides at a lot of conferences these days. When done well, they can challenge the presentation paradigm and make innovative use of an “infinite canvas,” but done poorly, they can be simply be disorienting. As Anastasia has pointed out, opinions are strongly divided. Whatever one thinks about its relative utility in terms of presenting content, the novelty of animated movement across scale and space does seem to have a hypnotic effect on audiences. Also, on more than one occasion, the visual jump seems to have jolted a half-dozing neighbor to attention. This side effect alone may encourage some of the more skeptical among us to try it.

Prezi is not an open format (to be fair, neither are PowerPoint or Keynote!). It uses Flash technology and despite recent support for mobile devices, including the anti-Flash world of iOS, it requires the installation of a special app. So what are the alternatives? There is a JavaScript implementation of many of the features of Prezi called Impress.js, but it strongly discourages anyone who is not an experienced web designer from trying it. The only documentation is provided within the code for the demo. There have been some attempts to create a friendly WYSIWYG editor for Impress.js but I think they have some work to go.

If you want to go all the way open, simple, and mostly portable with your presentations, then composing your presentation in good old simple text, with a touch of markup formatting with something like Markdown or its cousins seems like a good way to go. We’ve talked a lot about Markdown here, from its simple syntax, some of the apps you can use, and how to convert it into anything, including an ebook.

If you compose a basic presentation in plain text Markdown, there are lots of solutions out there for transforming it into a functioning browser-based slideshow. Louis Lazaris gives a quick run down of browser presentation toolkits here. Kerim Friedman pointed out two more to me: Remark and the dead-simple QuickSlides, which both work with Markdown.

If you are comfortable with messing around with CSS stylesheets to customize the appearance of your slides and want to add the wake-me-up and infinite-canvas features of Prezi/Impress.js you might want to try something called Mdpress. It requires just a little bit of command line use and works like this:

  1. On Mac OS X or Linux, open up a terminal window and install mdpress: gem install mdpress
  2. Compose your Markdown formatted text document with the contents of your slides.
    • Use --- (that is three hyphens) to separate each slide.
  3. Save it as a “.md” file (instead of “.txt“).
  4. If you add no special effects, you will get a simple slideshow. If you want to add them, the special effects of impress.js are placed immediately below the “---” slide delimiter line and involve you listing a series of attributes for how you want the slide to jump or scale after an “=” sign.
    • For example, if you want to have the center of the next slide to be at 1000 pixels to the right, and 1000 pixels below the first slide, at twice the scale, then you would write = data-x="1000" data-y="1000" data-scale="2".
    • See mdpress home and the impress.jsdocumentation” for more examples, including rotation and 3-d support.
    • The effects appear to be cumulative, so you may have to play with the numbers.
  5. When you are done with your markdown presentation text and any special effects you want to add, on the command line in the same directory simply type mdpress This will generate a folder with the name of your file. Your presentation will have been embedded in an index.html page that you can open in a modern browser to show your presentation.
  6. What if you want to make more changes to your document?
    • You can issue the command again, but even better, go back to the command line and type “mdpress -a” instead.
    • This added parameter “-a” will ask mdpress to check your markdown file every 2 seconds (until you close the terminal or ctrl-c the program) to look for any changes.
    • This lets you move back and forth between your markdown and the browser and see the changes reflected there.
  7. What if you don’t like the fonts and sizes and other features of your presentation?
    • You can create a “theme” folder next to your markdown file where you can put your own styesheet. Use the basic default CSS and HTML theme that mdpress comes with here as a template and modify it to fit your style.
    • Save both files with the same name plus .css and .html in the “theme” folder before you run mdpress on your Markdown.
    • When you issue the mdpress command, add "-s your-theme-name” (without added .css) and it will look for a theme by that name in the theme folder.
    • It is very likely that you won’t like your modified stylesheet the first time. Fortunately the “-a” function will also look for any changes to the theme stylesheet (the .css file) that controls the appearance of your website.
    • Thus you can continuously tweak your presentation text in the .md file, and your theme appearance in the theme/your-theme-name.css file.

If you don’t need impress.js style effects, then a much simpler tool like QuickSlides will let you just edit a single file and open it where ever you go.

Has anyone out there made the move to Markdown or plain text markup based presentations? If so, what is your favorite tool for marrying your text file with a browser-based presentation toolkit?

Image public domain by the author.

Return to Top