Example Talk

Dr. Alex Johnson · Meta AI

Research Overview

Multimodal LLMs
Efficient training
Responsible AI

Code & Math

def score(x: int) -> int:
    return x * x

$$ E = mc^2 $$

Dual Column Layout

Left Column

Point A
Point B
Point C

Right Column

Detail 1
Detail 2
Detail 3

Main Content (2/3 width)

This column takes up twice the space of the right column.

def example():
    return "code works too"

Note
Key points in smaller column

Image + Text Layout

Results

95% accuracy
10x faster inference
Lower memory usage

Breakthrough!

Speaker Notes

Press S to open presenter view with notes!

This slide has hidden speaker notes below.

Note:

This is a speaker note (only visible in presenter view)
Press S key to open presenter console
Perfect for remembering key talking points
Can include reminders, timing, references
Supports Markdown formatting too!

Progressive Reveals

Content appears step-by-step:

First point appears Then the second point Finally the conclusion This one can be highlighted!

Note: Use fragments to control pacing and maintain audience attention. Each fragment appears on click.

Diagrams with Mermaid

graph LR A[Research Question] --> B{Hypothesis} B -->|Valid| C[Experiment] B -->|Invalid| D[Revise] C --> E[Analyze Data] E --> F{Significant?} F -->|Yes| G[Publish] F -->|No| D

Perfect for: Workflows, architectures, processes

Note: Mermaid diagrams are created from simple text. They’re version-controllable and edit anywhere!

Research Results

Model	Accuracy	Speed	Memory
Baseline	87.3%	1.0x	2GB
Ours (v1)	92.1%	1.5x	1.8GB
Ours (v2)	95.8%	2.3x	1.2GB

Key Finding: 8.5% improvement over baseline with 40% memory reduction

Note: Tables are perfect for comparative results. Markdown tables are simple and version-control friendly.

Custom Backgrounds

This slide has a blue background!

You can customize:

Background colors
Background images
Gradients
Videos (yes, really!)

Use {{< slide background-color="#hex" >}}

There’s more content below! ⬇️

Press the Down Arrow to see substeps.

Note: This demonstrates Reveal.js’s vertical slide feature. Great for optional details or deep dives.

Substep 1: Details

This is additional content in a vertical stack.

Navigate down for more, or right to skip to next topic →

Substep 2: More Details

Even more detailed information.

Press Up Arrow to go back, or Right Arrow to continue.

Citations & Quotes

“The best way to predict the future is to invent it.”

— Alan Kay

Or reference research:

Recent work by Smith et al. (2024) demonstrates that Markdown-based slides improve reproducibility by 78% compared to proprietary formats¹.

Media: YouTube Videos

Note: Embed YouTube videos with just the video ID. Perfect for demos, tutorials, or interviews.

Media: All Options

Embed various media types with simple shortcodes:

YouTube: {{< youtube VIDEO_ID >}}
Bilibili: {{< bilibili id="BV1..." >}}
Local videos: {{< video src="file.mp4" controls="yes" >}}
Audio: {{< audio src="file.mp3" >}}

Perfect for demos, interviews, tutorials, or podcasts!

Note: All media types work seamlessly in slides. Just use the appropriate shortcode.

Interactive Elements

Try these keyboard shortcuts:

→ ← : Navigate slides
↓ ↑ : Vertical navigation
S : Speaker notes
F : Fullscreen
O : Overview mode
/ : Search
ESC : Exit modes

Hidden Slide Demo (Inline Comment)

This slide is hidden using the  comment method.

Perfect for:

Speaker-only content
Backup slides
Work-in-progress content

Note: This slide won’t appear in the presentation but remains in source for reference.

Thanks

Questions?

🌐 Website:
🐦 X/Twitter:
💬 Discord:
⭐ GitHub:

All slides created with Markdown • No vendor lock-in • Edit anywhere

Note: Thank you for your attention! Feel free to reach out with questions or contributions.

🎨 Branding Your Slides

Add your identity to every slide with simple configuration!

What you can add:

Element	Position Options
Logo	top-left, top-right, bottom-left, bottom-right
Title	Same as above
Author	Same as above
Footer Text	Same + bottom-center

Edit the branding: section in your slide’s front matter (top of file).

📁 Adding Your Logo

Place your logo in assets/media/ folder
Use SVG format for best results (auto-adapts to any theme!)
Add to front matter:

branding:
  logo:
    filename: "your-logo.svg"  # Must be in assets/media/
    position: "top-right"
    width: "60px"

Tip: SVGs with fill="currentColor" automatically match theme colors!

📝 Title & Author Overlays

Show presentation title and/or author on every slide:

branding:
  title:
    show: true
    position: "bottom-left"
    text: "Short Title"  # Optional: override long page title
  
  author:
    show: true
    position: "bottom-right"

Author is auto-detected from page front matter (author: or authors:).

📄 Footer Text

Add copyright, conference name, or any persistent text:

branding:
  footer:
    text: "© 2024 Your Name · ICML 2024"
    position: "bottom-center"

Tip: Supports Markdown! Use [Link](url) for clickable links.

🔇 Hiding Branding Per-Slide

Sometimes you want a clean slide (title slides, full-screen images).

Add this comment at the start of your slide content:

<!-- no-branding -->
## My Clean Slide

Content here...

☝️ This slide uses  — notice no logo or overlays!

🔇 Selective Hiding

Hide just the header (logo + title):

<!-- no-header -->

Or just the footer (author + footer text):

<!-- no-footer -->

☝️ This slide uses  — footer still visible below!

✅ Quick Reference

Comment	Hides
`<!-- no-branding -->`	Everything (logo, title, author, footer)
`<!-- no-header -->`	Logo + Title overlay
`<!-- no-footer -->`	Author + Footer text

☝️ This slide uses  — logo still visible above!

🚀 Get Started

Copy this example’s front matter as a starting point
Replace logo with yours in assets/media/
Customize positions and text
Use  for special slides

Pro tip: Set site-wide defaults in config/_default/params.yaml under slides.branding!

Smith, J. et al. (2024). Open Science Presentations. Nature Methods. ↩︎