OpenPress

Skill

openpress-create-slide

Create an OpenPress presentation, including slide Press Tree generation, DeckSlide, slide layouts, reusable UI elements, deck structure, and an initial theme.

Skill Impl

# openpress-create-slide

Create an OpenPress presentation and deck structure.

skills/openpress-create-slide/SKILL.md

This document explains how to use the openpress-create-slide skill to create a presentation project.

Step 1: Environment Check

Please ensure your environment has Node.js 20 or newer installed, along with npm and npx.

Step 2: Initialize Workspace

If you have not created a project shell yet, run the following command first:

npm create @open-press@latest <project-name> -- --type slides

Step 3: Generate Deck Structure

Use an Agent to trigger the openpress-create-slide workflow, providing:

  • Deck title and target audience
  • Visual direction and animation needs
  • Number of slides and content density

This process will automatically create DeckSlide, layouts/, and ui/ folders for you, and configure the corresponding Tailwind op-* styles.

The generated presentation entry file looks like this:

<Press slug="slide" title="Deck Title" type="slides" page="slide-16-9">
  <TitleSlide id="cover" title="Deck Title">
    <TitleSlide.Title objectId="title">Deck Title</TitleSlide.Title>
    <TitleSlide.Description objectId="description">
      One-line audience promise.
    </TitleSlide.Description>
  </TitleSlide>
</Press>

Step 4: Configure Page Folio

In your slide layouts, ensure you use the PageFolio component instead of hardcoding numbers. This guarantees correct display in previews, PDFs, and image exports:

<PageFolio currentFormat="2-digit" />

Step 5: Validate Deck Build

After adding the structure and slides, run the following command to verify that the project can compile correctly:

npm run build

Please note that this workflow is only for presentation artifacts; it is not responsible for creating page documents (like reports) or performing deployment tasks.