Presentations & Slides

Standard Garden turns your Markdown notes into polished, responsive presentations without requiring external slide plugins, bespoke slide configuration, or proprietary presentation software.

Write your ideas in plain Markdown. When opened in Obsidian’s native presentation mode or viewed online in your garden, your note automatically transforms into an interactive slide deck that inherits your active typography, design tokens, and theme.

1. Activating Presentation Mode

To designate a note as a presentation, add type: slide, type: slides, or type: presentation to its frontmatter.

---
title: "Product Architecture Review"
type: presentation
theme: kernel
visibility: public
publish: true
---

Theme Inheritance

Presentations automatically inherit the design identity of your chosen theme (kernel, macos, avantgarde, editorial, reveal, etc.). Typography, line heights, heading borders, callouts, and background colors are applied seamlessly across both Obsidian and the web.

2. Slide Structure & Delimiters

Slides are separated using standard Markdown horizontal rules (---):

# Product Architecture Review
A sovereign perspective on distributed design.

---

## The Vision
Every system deserves clarity, calm, and purpose.

- Minimal footprint
- Local-first architecture
- Zero runtime overhead

Each --- creates a discrete slide. You do not need wrapper tags, slide IDs, or special classes.

3. Intelligent Auto-Layouts (iA Presenter Style)

Standard Garden uses content-aware layout detection inspired by iA Presenter. Instead of manually adjusting font sizes or dragging text boxes, the layout engine analyzes the elements on each slide and positions them automatically:

1. Cover Slide

The opening slide of your presentation—or any slide containing a primary # Heading followed by a concise subtitle or metadata—is styled as a centered title slide with generous breathing room.

2. Split Layout (Text + Media)

Whenever a slide contains both narrative text (paragraphs, bullet points, quotes) and visual media (images or videos), the slide automatically divides into a balanced two-column presentation:

• Left Column (58%): Typographic content, headings, and lists.
• Right Column (42%): Visual media, automatically centered and scaled to fit the viewport.

## Scalable Infrastructure
Our edge network distributes notes globally across hundreds of points of presence with sub-10ms response times.

- Edge cache invalidation in milliseconds
- Direct R2 storage streaming
- Zero cold starts

![Global network map](/images/network.png)

3. Multi-Image Grids (Diptychs, Triptychs, and Quads)

Placing two, three, or four images on a slide arranges them into a synchronized comparison grid:

• 2 Images: Side-by-side diptych.
• 3 Images: Balanced 3-column row.
• 4 Images: Clean 2x2 grid.

Aspect ratios are respected with zero arbitrary cropping.

4. Hero Visuals

A slide containing an isolated image or an image paired solely with a caption renders as a high-impact visual slide, expanding the photograph while maintaining comfortable margins.

5. Dynamic Auto-Fit

Text scales fluidly to fit any screen resolution or window dimensions. Whether presenting on a 4K conference projector, a laptop screen, or a phone, your content fills the slide comfortably without vertical scrollbars or awkward text clipping.

4. Minimalist Progress Indicator

Both in Obsidian and on the web, slide decks feature an ultra-discreet progress indicator:

• Hairline Thickness: Set to the system’s hairline token (--stroke-width).
• Harmonious Tone: Filled with the theme’s --color-foreground rather than a distracting accent color, resting on a subtle transparent track.

5. Controls & Interaction

Keyboard Shortcuts

• Next Slide: Right Arrow, Down Arrow, Space, PageDown
• Previous Slide: Left Arrow, Up Arrow, PageUp
• First / Last Slide: Home / End
• Toggle Fullscreen: F
• Exit: Escape

Touch & Mobile

On touch devices, swipe left or right to glide between slides.

Deep Linking & URL Hashes

On the web, each slide synchronizes with the URL hash (e.g., https://your.garden/deck#3). Sharing a link with an anchor opens the deck directly on that specific slide.

Dual Mode: Deck vs. Article

If you or your readers prefer to read a presentation note as a continuous long-form essay rather than a slideshow, append ?view=article to the web URL:

https://your.garden/my-presentation?view=article

6. Complete Example

Here is a ready-to-use template illustrating various slide layouts:

---
title: "A Sovereign Web"
type: presentation
theme: kernel
visibility: public
publish: true
---

# A Sovereign Web
Designing tools that respect human attention.

---

## The Problem
Modern web publishing has devolved into attention extraction, intrusive analytics, and bloated software stacks.

> "Simplicity is prerequisite for reliability."  
> — Edsger W. Dijkstra

---

## The Architecture
Standard Garden pairs your local Obsidian vault directly with an edge-distributed publication engine.

- **File over app**: Your Markdown stays yours forever
- **Zero build pipelines**: Instant edge rendering
- **Classical typography**: Curated editorial design tokens

![Architecture schema](/images/architecture.png)

---

## Visual Craft
Side-by-side design comparisons with automatic height equalization:

![Light theme](/images/theme-light.png)
![Dark theme](/images/theme-dark.png)

---

# Thank You
Questions, thoughts, and conversations welcome.