skills.rest
pgoell
pgoellCOMMUNITY
Explore all skills by this author →
Website𝕏@pagoellGitHub

crafting-presentations

Builds multi-slide HTML decks with deck-stage navigation and a two-window presenter view.

Updated Mar 18, 2026
Search Tags:#html#presentation#slides#deprecated#deck#speaker notes#presenter mode
One-click install
npx skills add https://github.com/pgoell/pgoell-claude-tools --skill crafting-presentations-pgoell
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: crafting-presentations
Source: https://github.com/pgoell/pgoell-claude-tools/tree/main/plugins/deprecated/skills/crafting-presentations
Command: npx skills add https://github.com/pgoell/pgoell-claude-tools --skill crafting-presentations-pgoell

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? This Skill addresses the need to produce multi-slide HTML presentations with consistent scaling, slide-type templates, speaker notes, and a live presenter view for screen-shared meetings. Note: this Skill is deprecated and superseded by presentations:creating-presentations, which should be preferred for all new decks. ## Core Features & Use Cases - Deck-stage engine: Every slide is a <section> inside a <deck-stage> custom element on a 1920x1080 canvas, scaled to any viewport via CSS transforms. - Slide-type catalog: Ten slide types including Title, SectionDivider, Agenda, Content, Stat, Capabilities, Comparison, Quote, Timeline, and Closing. - Presenter mode: A second window synced over BroadcastChannel with speaker notes from a JSON island, live note editing, blackout keys, and a timer. - Use Case: A user needs a 15-slide deck for a Zoom presentation with speaker notes visible only to them; this Skill produces the HTML deck plus presenter sidecar, and the user shares only the deck window. ## Quick Start Ask the AI to build a multi-slide HTML presentation with speaker notes and a presenter view using the crafting-presentations skill.

Frequently Asked Questions about crafting-presentations

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a multi-slide HTML presentation with speaker notes?▼

Compose slides as `<section>` elements inside a `<deck-stage>` element and store speaker notes in a JSON island keyed by 1-based slide index. The presenter.js script reads the notes and syncs them to a separate presenter window over BroadcastChannel.

How do I present an HTML deck on Zoom or Teams without showing speaker notes?▼

Open the deck in a Chromium browser, press P to open the presenter window, then use Share to Window and select only the deck window. Never share the full screen, or the presenter notes become visible to the audience.

Does the HTML deck presenter mode work offline or without a server?▼

Yes, sync uses BroadcastChannel, which works across file:// pages in Chromium browsers with no server required. However, decks loading CDN fonts or icon libraries break offline, so vendor those assets into the slides directory.

Can a single-file HTML deck still have presenter mode?▼

A strictly single-file deck has no presenter mode because presenter.html must exist as a sidecar next to the deck file. If the deck must travel but presenter mode matters, ship the deck plus presenter.html as a pair.

Should I still use crafting-presentations for new decks?▼

No, this Skill is deprecated and superseded by presentations:creating-presentations, which bundles the same deck-stage engine plus a preset architecture and review loop. Use the presentations plugin for all new decks.

Related Skills

Explore More Design & Creative Skills→
mahg-esmahg-es
3

slide-deck-generate

Generate branded slide deck structures with per-slide content and speaker notes.

Official
Intermediate
MuzeWinterMuzeWinter
1

report-to-google-slides

Convert HTML analytics reports into editable PPTX decks for Google Slides.

Community
Advanced
jiaiyanjiaiyan
21

element-plus-theming

Customize Element Plus themes with SCSS or CSS variables.

Community
Intermediate
2lab-ai2lab-ai

deck-simple

Design simple horizontal-swipe HTML presentation decks in 16:9 aspect ratio.

Official
Basic