feat(presentations): continue the blog post
- introduction for reveal.js - draft for customisation - rewrite some other parts
This commit is contained in:
		| @@ -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. | ||||
|  | ||||
|  | ||||
|  | ||||
| ### Customisation | ||||
|  | ||||
| - List of default [reveal.js styles] | ||||
| - Simple customisation with CSS: | ||||
|   <https://gist.github.com/jsoma/629b9564af5b1e7fa62d0a3a0a47c296#styling> see | ||||
|   <https://github.com/hakimel/reveal.js/blob/master/css/theme/template/exposer.scss> | ||||
|   as well for exposed variables. | ||||
| - However, in standalone mode, changing the font does not work well… | ||||
| - Create custom theme: <https://github.com/hakimel/reveal.js/blob/master/css/theme/README.md> | ||||
|   - <https://github.com/Chouhartem/reveal.js/tree/cryptpad-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/ | ||||
|   | ||||
		Reference in New Issue
	
	Block a user