Skip to content

Presenting

I do presentations quite often. I usually end up working with standard presentation software (Microsoft Powerpoint, Google Slides). They offer good ways to create a bit of a standard style, but I find working with them awkward every time.

Backgrounds

Over the years, I have made a few attempts to use reveal.js, and other HTML/CSS-based approaches.

Info

In fact, in 2011, I experimented with @media projection in CSS, but this CSS option was deprecated in Media Queries 4.

My idea back then was to write out a story, and have a presentation version of the same page with just the slides.

As of now (towards the end of 2025):

  • I sometimes present from within VS Code:

    • The vscode-reveal extension does a decent job turning a Markdown file into an instant presentation, either inside VS Code or via a browser, using reveal.js.

    • VS Code has its own screencast mode that can for instance show shortcut keys on the screen, or a circle around the mouse pointer when clicked.

    • Since I still sometimes want to zoom in on parts of the interface, I have set up a keyboard shortcut to use Gnome's accessibility feature to zoom in on the desktop.

  • I am experimenting with mkslides as a companion to mkdocs, to be able to write slide decks in the same repository as my notes, as Markdown.

  • I bought a clicker so I can move around but still move the mouse around a click on things.

    • I have the Logitech Spotlight. The basic features work on Ubuntu, but I haven't managed to run the additional software to enable highlight and zoom.

    • I have installed the Pointer Tracker extension for Gnome and assigned a keyboard shortcut to switch it on or off. That then also works if I move my laptop mouse around instead of using the clicker.

  • I use the mouse ripple effect of the accessibilty settings. This is also useful when not presenting, to just get a visual hint where my mouse cursor is when dealing with multiple windows.

How to

VS Code

Ctrl-Shift-P then screencast

to toggle the screencast mode.

  • Check the settings, to set for instance how long a key press is shown, its font size, etc.
Ctrl-Shift-P then revealjs

to open a Markdown file as presentation (in my browser).

  • You need the vscode-reveal extension.
  • All standard revealJS options work.
  • Slides are separated in Markdown by a --- line.
  • It is possible to open speaker notes in a separate window with S. I add speaker notes as Markdown in a slide like this:
    <aside class="notes" data-markdown>
    - my first point
    - another point
    </aside>
    

Ubuntu

My current keyboard settings:

Win-Z
to toggle the Zoom mode of Ubuntu's accessibility settings.
Ctrl
to show a ripple effect around the mouse cursor.
Win-T
to toggle a circle around my mouse pointer, with the Pointer Tracker extension for Gnome.

RevealJS

?
to show available keyboard shortcuts.
B

depends on the setup of reveal.js

  • The standard version will toggle a black screen.
  • The version in vscode-reveal will toggle a blackboard, with the option to write things with different colours on a board.
S
to open a separate speaker notes window.
Ctrl + click
to zoom in on part of a slide (Alt+click if not on Linux).