qoderwork-ppt

Files (26)

• README.md
• SKILL.md
• package-lock.json
• package.json
• content-rules.md · rules/
• slides-example.json · rules/
• template-matching.md · rules/
• fill-template.js · scripts/
• html-to-pptx-dom.js · scripts/
• run-pipeline.js · scripts/
• validate-slides.js · scripts/
• 01-cover.html · templates/
• 02-contents.html · templates/
• 03-section-divider.html · templates/
• 04-content-left-text-right-image.html · templates/
• 05-content-one-columns.html · templates/
• 06-content-two-columns.html · templates/
• 07-content-three-columns.html · templates/
• 08-content-four-columns.html · templates/
• 09-data-highlight.html · templates/
• 10-quote.html · templates/
• 11-timeline.html · templates/
• 12-full-image.html · templates/
• 13-comparison.html · templates/
• 14-thank-you.html · templates/
• manifest.json · templates/

SKILL.md (first lines)

# QoderWork-PPT

When a user wants to **generate a QoderWork-style presentation**, use this skill. Based on the user's topic and requirements, it automatically generates content, matches suitable templates, and outputs an editable PowerPoint file.

## Execution Flow

### 0. Prepare output directory

Create the output directories if they don't exist:

```bash
mkdir -p output output/images
```

### 1. Understand requirements & generate content document

Read `rules/content-rules.md` (in this skill directory), then convert the user's requirements into a structured content document at `output/content.md`.

- Extract from user input: topic, audience, key points, page count preferences, etc.
- Generate a well-structured plain-text document following content-rules
- Content should be complete, logically clear, and ready for template matching
- **CRITICAL — page budget**: unless the user explicitly requests more, plan for **8–15 slides total** (including cover, TOC, section dividers, and closing). Count your planned slides before proceeding to step 2. If the outline exceeds 15, merge or cut sections.

### 2. Match templates & generate slide sequence

Read `rules/template-matching.md` and `templates/manifest.json`, then generate `output/slides.json` based on content.md.

- **slides.json array length MUST be ≤ 15** (unless the user explicitly requested more). Count before writing the file.
- Format per slide: `{ "templateId": "xxx", "slots": { "slotId": "value", ... } }`
- A **full example** (one slide per template type) is available at `rules/slides-example.json` — copy and adapt it
- Strictly follow template-matching rules; slot values must conform to manifest constraints (type, maxLength, etc.)

**Cover background**：cover 模板的 `coverBackground` 槽位**勿主动填写**，使用模板默认背景。仅当用户明确要求自定义封面图时才填。

**Section-divider 插图**：03 章节分隔页右侧的 `image` 槽位**尽量勿填**，使用模板默认插图。仅当用户明确要求更换章节配图时才填。

**Image slots (type: image)** accept any of:

| Format | Example | When to use |
|--------|---------|-------------|
| `lucide:<icon-name>` | `lucide:shield-check` | Icon-style images (preferred for column cards in 06/07/08) |
| Image URL | `https://example.com/photo.jpg` | Web images |
| Local path | `output/images/slide-03.png` | After generating/saving an image locally |

**When you must generate/search for real images**: slots marked `aiGeneratable: true` that need a **real photograph or illustration** (not an icon) — typically `section-divider` image, `content-left-text-right-image` image, and `full-image` background. Call `generate_image` or `web_search` to obtain them, save to `output/images/`, and fill the path into slots. **These image slots are required** — do NOT leave the default placeholder.

### 3. Fill HTML templates

**Working directory (cwd)**: must be the project root (where `output/` lives).

**Script path**: relative to this skill directory. Replace `SKILL_SCRIPTS` below with the actual path (e.g., `resources/skills-market/qoderwork-ppt/scripts` if using this repo as workspace, or `~/.qoderwork/skills/qoderwork-ppt/scripts` if installed from market).

Optional — validate first:

```bash
node SKILL_SCRIPTS/validate-slides.js output/slides.json
```

Then fill templates (or use the one-click pipeline below):

```bash
node SKILL_SCRIPTS/fill-template.js output/slides.json
```

**Recommended — one-click pipeline (steps 3+4 combined)**:

```bash
node SKILL_SCRIPTS/run-pipeline.js output/slides.json
```

Output file is auto-named with a timestamp (e.g. `output/presentation-2026-03-06-10-30-00.pptx`) to avoid overwriting previous runs.

### 4. Convert to PPTX

If you didn't use the one-click pipeline above, run separately:

```bash
node SKILL_SCRIPTS/html-to-pptx-dom.js output/filled
```

Reads filled HTML from `output/filled/`, renders via Puppeteer, and converts to PPTX using dom-to-pptx — **preserving background images, rounded corners, fonts, and full styling**.

### 5. Inform the user

Tell the user the PPT has been generated at `output/presentation.pptx`, with a brief summary of page count and structure.

## Resumability (Agent checkpoint recovery)

- **Step 1**: If `output/content.md` already exists and the user didn't ask to "regenerate content", skip to step 2.
- **Step 2**: Always (re-)generate `output/slides.json` from content.md.
- **Step 3+4**: If only slides.json changed, just re-run `run-pipeline.js` (overwrites `output/filled/` and `output/presentation.pptx`).

## Key Files (in this skill directory)

| File | Purpose |
|------|---------|
| `rules/content-rules.md` | Content generation rules & document structure |
| `rules/template-matching.md` | Template matching rules & image slot conventions |
| `rules/slides-example.json` | Full slides.json example (one slide per template type) |
| `templates/manifest.json` | 14 template definitions with slot specs |
| `templates/*.html` | 14 HTML template files (1920×1080) |
| `scripts/validate-slides.js` | Pre-validation for slides.json |
| `scripts/fill-template.js` | Fills slot values into HTML templates |
| `scripts/html-to-pptx-dom.js` | High-fidelity HTML → PPTX conversion |
| `scripts/run-pipeline.js` | One-click: validate → fill → convert |

## Output Files (in project root `output/`)

| File | Purpose |
|------|---------|
| `output/content.md` | Intermediate: structured content |
| `output/slides.json` | Intermediate: slide sequence + slot values |
| `output/images/` | Generated/downloaded images for slides |
| `output/filled/*.html` | Filled single-page HTML files |
| `output/presentation.pptx` | Final PowerPoint file |

## Dependencies

Before first use, install dependencies in this skill directory:

From zhaoxinyi02/ClawPanel-Plugins, MIT.

More from zhaoxinyi02/ClawPanel-Plugins