Present Slide Decks

What this is

A slide deck editor built on Marp, an open markdown-to-slides format. You write plain text with --- separators between slides, and the editor renders them live. When you're ready, hit Present → and the browser becomes the projector.

The deck editor opens with a sample loaded. Reading it beside this page is the fastest way in.

How you get one

You can paste markdown directly, or generate a deck from scratch.

1. Generate tab — enter a topic and optionally paste learning intentions or content.
2. Set the slide count, then Build prompt and Copy to clipboard.
3. Paste into any AI assistant.
4. Copy the markdown it returns and paste it into the editor.

You can also Import a .md file, or Load URL to pull a deck from a raw GitHub URL or any URL serving markdown.

Slide basics

Every deck starts with a frontmatter block. The --- fences are required — Marp uses them to identify the deck and read its settings.

---
marp: true
theme: default
---

# First slide

Content here

---

## Second slide

More content

• --- on its own line separates slides. Everything between two separators is one slide.
• Standard markdown works: headings, bold, italic, lists, tables, links, images, code blocks.
• A line starting with <!-- --> is an HTML comment — Marp uses these for per-slide directives and speaker notes.

For the full syntax, read the Marpit directives reference. This page covers what the editor adds on top.

Themes

Three built-in themes: default, gaia, and uncover. Set the theme in the frontmatter or use the Theme dropdown in the toolbar — it updates the frontmatter for you and the preview re-renders live.

---
marp: true
theme: gaia
---

Images

Marp uses a special alt-text syntax for background and split-layout images.

![bg right:40%](https://example.com/photo.jpg)

• ![bg](url) — full-slide background image.
• ![bg right:40%](url) — image takes 40% on the right, content on the left.
• ![bg left:45%](url) — image on the left.

Drag and drop. Drag an image from any website onto the slide preview. If the slide has a placeholder (placehold.co), it fills that. If it has an existing image, it replaces it. If it has neither, it inserts a new split-layout image.

Edit images. The 🖼️ Edit images button opens a panel where you can change URLs, adjust layout (left, right, background, inline), sizing, and split percentage for every image in the deck at once.

Speaker notes

Write speaker notes as HTML comments after the slide content. They won't appear on the projected slide.

## Cell Structure

The cell membrane controls what enters and exits.

<!-- Remind students about osmosis from last week.
     Ask for examples of selective permeability. -->

Notes appear in the slide preview panel and in presenter view during presentation — press P to toggle it. They're also carried into PowerPoint exports as slide notes.

Diagrams

Fenced ```mermaid code blocks are rendered to images automatically. Write the diagram source in the editor — the preview shows the rendered result.

```mermaid
graph LR
    A[Input] --> B[Process]
    B --> C[Output]
```

Mermaid is lazy-loaded only when a deck uses it, so it doesn't slow down decks that don't. If there's a syntax error, the raw code block shows instead — fix the source and the diagram re-renders.

Check slides

A check slide asks the class something and collects their answers on their own devices. You write it in the editor like any other slide — there is no separate builder and no form to fill in. If you have written a bullet list, you can write one of these.

A deck with check slides still presents perfectly normally on its own. The answering part is optional and comes later; you can write the slides today and decide about sessions another day.

Where it goes

Exactly where any slide goes. Slides are separated by a line of three dashes, and a check slide is just a slide with a fenced block in it — a line of three colons to open, a line of three colons to close. Everything between them is the part students answer.

---
marp: true
theme: default
---

# Digital Systems & Data

---

## How many bytes for "Digital"?

::: session
- A) 5 bytes
- B) 7 bytes
- C) 8 bytes

* ✅ **B) 7 bytes** — seven letters, one byte each
:::

---

## What happens to an image?

The heading stays outside the fence. It is the question, and it is what the class reads — the fence holds the answers, not the asking.

Turning a slide you already have into a check

The most common way to write one is to start from a slide that already has the options on it, and add three lines: the two fence lines, and the answer.

## How many bytes for "Digital"?

- A) 5 bytes
- B) 7 bytes
- C) 8 bytes

## How many bytes for "Digital"?

::: session
- A) 5 bytes
- B) 7 bytes
- C) 8 bytes

* ✅ **B) 7 bytes** — seven letters, one byte each
:::

Nothing about the options changed. The list is the same list; it has been wrapped, and an answer added underneath it.

• ::: session opens the block and ::: closes it. Both go on their own line.
• The label at the start of each option — A), B) — is what gets recorded. Keep them.
• The line beginning with * is the answer. It stays hidden until you advance to it, so it is safe to have on screen. It has to name the same label as the option it means.
• The blank line before the * matters. Without it the answer joins the option list and becomes a fourth option.

What it does before there is a session

Presented as-is — no session, nothing pasted into the frontmatter — a check slide behaves like any other slide. The class sees the question and the options; advancing reveals the answer line, the same way advancing reveals any * fragment. You can teach with it today exactly like that, taking hands instead of taps.

Collecting real answers on devices — and the Reveal control that comes with it — needs a session, which changes how the slide presents. That is covered in Running a live check.

A written answer instead

Leave the fence empty and students get a text box rather than buttons. There is no answer to mark against, so there is no * line.

## Why does compression lose quality?

Discuss with the person next to you.

## Why does compression lose quality?

::: session
:::

A confidence check

One line per thing you want them to rate. Each line gets three lights — got it, getting there, not yet — and each is counted separately, so you can see which part lost them.

## How are we going?

- I can explain why binary uses base 2
- I can convert a decimal number to binary

## How are we going?

::: confidence
- I can explain why binary uses base 2
- I can convert a decimal number to binary
:::

Write them as things a student can say yes or no to about themselves. "I can convert a decimal number to binary" works; "binary conversion" does not, because there is nothing to be confident about.

Collecting answers without showing the class

Add the word quiet after the fence name. Students still see the question and still answer it — the results simply never go on the projection. Useful for an exit ticket, or anything where a public distribution would change what people say.

::: confidence

::: confidence quiet

Putting a check beside an image

Fences can sit inside a grid. The only rule is that the outer fence has to be longer than the inner one — four colons around three — so the right one closes first. Pasting from an AI usually gets this right, and Prepare repairs it if not.

:::: grid-2x1
![](diagram.png)

::: session
- A) It doubles
- B) It halves

* ✅ **B) It halves**
:::
::::

Presenting

Click Present → to enter presentation mode. The browser becomes the projector — no export step, no app switch.

• Arrow keys and Space navigate slides and fragments (bullet reveals).
• F toggles fullscreen.
• P opens presenter view — your notes and slide count alongside the current slide.
• C hides the control bar for a clean display.
• R shows or hides results on a check slide — only once the deck carries a session block; see below.
• Esc returns to the editor.

The control bar also has buttons for sharing, copying markdown, changing the theme live, and exporting — all accessible without leaving the presentation.

Running a live check

Check slides work on their own — you can ask the question and take hands. To collect answers on devices you also need a session, which lives in Waypoints Signal. Setting one up is three steps and you only do it once per deck.

1. Send the questions to Signal

With a deck open, click Export questions. Prepare pulls every check fence out of the deck and copies them to your clipboard. Paste that into Signal, which gives you back a short block:

signal_session: XKQT-4821
signal_check: a1b2c3d4
signal_control: ctl-7f3a9c2e5b1d4a8f

Paste the whole block into the code box beside Export questions and click Add code to deck. All three lines go into your frontmatter.

What that block changes

This is worth reading once, because the deck now presents differently — the block is not just a registration, it switches the check slides into their live behaviour.

• A results box appears at every check fence. Live bars from the class, shown on your screen for the room. It starts hidden.
• Reveal moves off the advance key. Without the block, advancing reveals the answer fragment. With it, the results box is under R — or the Reveal button in the control bar — and pressing it again takes the box back down. Arrow keys go back to doing exactly one thing: moving through the deck.
• The Class dropdown and Reveal button appear in the control bar. They exist only when the deck carries this block; a deck without it has nothing to drive with.
• The student link becomes answerable. One link carries the slides and the session together — nothing separate for students to join.

Briefly, what each line is: the first names the session, the second lets Prepare notice if you edit the questions afterwards, and the third is the key that lets this deck drive the class — it is stripped from the student link automatically, along with your notes and answers.

2. Give students the student link

Open 🔗 Share link. There are two links there and they are not interchangeable — the student one is described under Sharing below. Hand out the student link.

3. Present

On a check slide, students answer on their phones. The two screens deliberately show different things:

Students tap and see that it saved — answered ✓ and nothing else. They do not see the bars and they do not see whether they were right: the results belong on the shared screen, and the answer never leaves your browser. If a student tells you nothing happened on their phone when you revealed, that is working as intended.

Trying it yourself first

Worth doing once before you run it with a class. You need the deck open in present mode and the student link open somewhere else — your phone is ideal, because it is what students will actually use.

1. Present the deck and go to a check slide.
2. Open the student link on your phone, or in a private window.
3. Answer as a student would. It should say answered ✓.
4. Press R on the presenting screen. The bars appear.
5. Set Class to Follow me and move a slide. The other screen should follow within a second.

Use a private window, not a second tab. Answers are counted per browser, so a normal second tab is treated as the same student — you would replace your own answer rather than adding one, and the count would stay at one no matter how many times you answered. A private window, a different browser, or a phone each count separately.

Your test answers stay in the session, so a class running the same session later starts with a couple of responses already in the totals. If that matters, export the questions again before the lesson to get a fresh session code, and re-share the student link.

Controlling where the class is

The control bar has a Class dropdown with three settings:

• Free — students move through the deck at their own pace. This is the default.
• Follow me — students see only the slide you are on, and move when you move. Their navigation buttons grey out and their screen reads Following the class.
• Up to here — students can work at their own pace anywhere up to the slide you have reached, but not past it.

Switch back to Free at any time. Leaving presentation mode with Esc releases the class automatically, so you can't strand thirty students on slide 12 by closing the deck. Closing the browser tab outright does not — present again and set it to Free if that happens.

A student joining late, or reloading, lands wherever the class currently is and keeps any answers they had already given. A laptop that has been asleep catches up when it wakes.

If you edit the deck afterwards

Adding a check slide is fine. Reordering or rewording existing ones is not — the session still holds the questions as they were, and students whose deck no longer matches are told so and have answering turned off for those questions. Export the questions again and re-share the student link.

If something isn't working

• No Class dropdown or Reveal button. The deck needs both signal_session and signal_control in its frontmatter. A session code on its own isn't enough to drive the class.
• Students see nothing change. They need the student link for this deck. An older link carries an older copy of the slides.
• Nothing appears on a student's phone when you reveal. That's expected — reveal shows the results on the projection, not on their device.

Sharing

Click 🔗 Share link to get a URL that contains the entire deck. No server, no upload — the deck is compressed and encoded into the URL hash. Anyone with the link sees exactly what you see.

Very large decks can be truncated by messaging apps or LMS fields. The share dialog warns you when the URL exceeds a safe length.

The student link is a different link

A deck with check slides gets a second link in the same dialog, and handing out the wrong one is worth one careful look. The share link above contains your speaker notes and your answers. Both are in the deck source, and the source is what the link carries.

The student link is built from the same deck with those removed — speaker notes stripped, the * answer line taken out of every check fence, and the control token removed so a student can't drive the class. Everything else is identical, including the session, so one link gets them the slides and the answering together with nothing else to join.

The dialog states what each one contains rather than leaving you to remember. Give students the second one.

Exporting

• Export PPTX — renders each slide as a high-resolution image inside a PowerPoint file. Speaker notes are carried through. The export runs entirely in your browser; nothing is uploaded. Hold Shift and click for a debug preview of slide 1.
• Export markdown — downloads the deck as a .md file. This is the source format and round-trips perfectly.
• Copy markdown — copies the raw markdown to your clipboard.

Generating well

• More source material → better decks. A topic alone produces generic slides. Paste learning intentions, success criteria, or lesson notes and the AI has something to work with.
• Set the slide count. The prompt tells the AI how many slides to aim for. Eight is a sensible default for a lesson segment; adjust to match.
• Use the style field. Formatting preferences, house conventions, whether you want more images or fewer — it goes into the prompt verbatim.
• Expect to edit. Replace placeholder images, adjust the theme, reorder slides, add speaker notes. The generator gets you to a draft, not to a finished deck.

Shortcuts

In the editor

Pasting a fenced ```markdown reply from an AI automatically strips the fences — you get clean markdown, not a code block.

In presentation mode