diff --git a/content/examples/revealjs-speakerview.png b/content/examples/revealjs-speakerview.png new file mode 100644 index 0000000..812ecf5 Binary files /dev/null and b/content/examples/revealjs-speakerview.png differ diff --git a/content/tips/presenting.md b/content/tips/presenting.md index a2cb0c3..cccec77 100644 --- a/content/tips/presenting.md +++ b/content/tips/presenting.md @@ -7,7 +7,7 @@ Tags: presentation, vim, latex Slug: presenting Header_Cover: ../images/covers/pts24-talk.jpg Summary: Some of the tools I use for making and giving presentations. -Lang: en +lang: en --- # Introduction @@ -16,12 +16,13 @@ Over the past year, I have to give quite a few presentations in different contexts: internal to the company, for open-source conferences, for business conferences… -I use this opportunity to refine a bit my presentation tools, and I just -summarize them here for curious people. +I used these different opportunities to refine a bit my presentation tools, and +I just summarize them here for curious people. Please note that this blog post +will only cover the tooling needed to produce slides, not what to put inside. -This page may be updated, for instance if I start using [typst] for slide -making. If you have subscribed to this blog’s [RSS feed], you will be notified -of future updates. +This page may be updated, for instance if I start using yet another tool for +slide making that I think is worth mentioning. If you have subscribed to this +blog’s [RSS feed], you will be notified of future updates. # Making Slides @@ -36,14 +37,17 @@ documents, and presentations are not an exception. For this purpose I’m using [beamer]. For this purpose, my [vim setup for LaTeX] proved to be pretty useful, -especially with the “on save compilation”. However, the backward search is not -very accurate with beamer slides. +especially with the “compilation on save” feature. It allows me to have an +already set up text editor for LaTeX without having to fiddle and twiddle with +multiple setups. However, the backward search is not very accurate with beamer +slides. ### Overlays and Graphics The main advantage, besides my familiarity with [LaTeX], lays in the [overlay] system in beamer, that is quite powerful and provides a very precise way to -display elements, especially with [TikZ] to design animated graphics. +display elements. This overlay mechanism also compounds well with [TikZ] to +design animated graphics. For instance in the example below, I can show the top part of the graph initially, then the bottom, and change the name of the last node for the second @@ -76,17 +80,17 @@ Resulting in: Moreover, you have access to the whole latex ecosystem, especially those for neat illustrations such as [tikzpingus]. -**Note:** I have to say that the above technique is unsafe under fairly -reasonnable assumptions. Long story short you should sign first *then* encrypt +**Note:** I feel compelled to say that the above technique is unsafe under fairly +reasonable assumptions. Long story short you should sign first *then* encrypt and not do both in parallel. Please see [this paper](https://ia.cr/2001/045) -from Crypto’01 if you want a more detailed explanation. +from the Crypto 2001 conference if you want a more detailed explanation. ### Customisation It is also quite easy to customise slides with beamer. For instance, with [metropolis], from its [documentation](https://ctan.tetaneutral.net/macros/latex/contrib/beamer-contrib/themes/metropolis/doc/metropolistheme.pdf), -section 8 describe where to find specific colours. As for the fonts, if you are +section 8 describes where to find specific colours. As for the fonts, if you are using xelatex/lualatex, a simple `\setmainfont` suffices to redefine it. For instance, if I want to have the alert text in orange: @@ -113,6 +117,52 @@ than they are. settings to generate them are liberally inspired by [Pablo Coves](https://pcoves.gitlab.io/blog/pandoc-markdown-revealjs/). +[Pandoc] on the other hand is a document converter tool that supports a very +extensive spectrum of formats and syntaxes. My most use case is to convert +markdown to some other reflowable format (usually HTML, and sometimes EPUB). + +Using both in conjunction allows for quick and dynamic presentations which don’t +require _accuracy_ in placements. That may be the case for lightning talks for +instance. The main advantage compared to the two above solutions is that +[reveal.js] takes advantage of web browser capabilities to produce dynamic +transitions. Those are otherwise hard to get from PDFs (some people made custom +PDF reader for that). + +I know that it’s also possible to use [pandoc] to produce directly [beamer] slides +for instance, thus benefiting from the simpler [Markdown] syntax while having +[LaTeX] as an engine. I however find this approach too rigid. It is indeed easy +to feed some LaTeX‑specific commands via the YAML header, e.g., for styling. +Unfortunately, when the need arises to do some specific positioning on a slide +for example, then we end up with some markdown-TeX mix that I found deeply +inelegant. That’s why I usually stick to LaTeX (or more recently [typst]) to +produce PDFs, as these tools are designed with an awareness of the page layout +(which blends well into the language). This property is not the case with +[Markdown], which is a markup language for text formatting (not typesetting). + +### Ease of use + +### Speaker view + +One of the advantage of [reveal.js] is the built-in [speaker view]. It spans a +pop-up with useful pieces of information for the speaker: a chronometer, a preview of the +upcoming slide and notes if there are any. + +Its behaviour is similar to what you can have with `pdfpc` that I’ll show later +for PDF slides. + +![](/examples/revealjs-speakerview.png "Speaker View") + +### Customisation + +- List of default [reveal.js styles] +- Simple customisation with CSS: + see + + as well for exposed variables. +- However, in standalone mode, changing the font does not work well… +- Create custom theme: + - + # Presenting Slides {#presenting-slides} ## wl-mirror @@ -130,3 +180,8 @@ Coves](https://pcoves.gitlab.io/blog/pandoc-markdown-revealjs/). [TikZ]: https://www.ctan.org/pkg/pgf [tikzpingus]: https://github.com/EagleoutIce/tikzpingus [reveal.js]: https://revealjs.com/ +[reveal.js styles]: https://revealjs.com/themes/ +[pandoc]: https://pandoc.org/ +[metropolis]: https://github.com/matze/mtheme +[markdown]: https://en.wikipedia.org/wiki/Markdown +[speaker view]: https://revealjs.com/speaker-view/