After giving a talk at work to colleagues recently using slides I’d created in Google Docs; I thought I’d had a great idea! What if I could edit my slides as text (something like Markdown) and bypass the nasty WYSIWYG editor?!

Well; as is usually the case when you have a great idea; it’s already been done. I played around with a few I found online and one that was really neat. Not only does it support markdown; but it also has extensions so you can add CSS classes to content to lay things out just like a web developer is used to! As it’s web-based, you can even put your own JavaScript in to mess with things further!

The project is called remark, you can see a slideshow created using their script on their website. The source text can be seen here.

In addition to being able to knock together a slideshow in text; there are some other cool features (you can try these out on their website slideshow):

  • Press ‘c’ to clone the window, so you can show a separate copy on an external screen (the clones are kept in sync with an API)
  • Press ‘p’ to open presenter mode for the active window, which shows current/next slide and speaker notes (and unlike Google Docs; the slide preview is not tiny!)
  • Press ‘f’ to make the slideshow full screen (you can set the aspect ratio in the code)

I often use other peoples software; but I don’t have enough time to contribute to many. However, I liked this one so much, I had a stab at fixing a niggle I found; and it’s now been merged into the main repo :)

Slide

remark slide

Presenter Mode

remark presenter mode

So, it all looks pretty slick. One thing I’m certain of; if this hadn’t existed and I’d started my own; it wouldn’t have looked this neat! If you’re a web developer; give it a go. I’m certain you’ll prefer it to PowerPoint and Google Docs! :)