Help us improve
Share bugs, ideas, or general feedback.
From education
Create lecture presentations for FFHS in reveal.js (default) or PowerPoint format. Use when user requests presentations for PVA sessions, lecture slides, or teaching materials. Supports both web-based reveal.js and traditional PPTX output.
npx claudepluginhub talent-factory/claude-plugins --plugin educationHow this skill is triggered — by the user, by Claude, or both
Slash command
/education:ffhs-lecture-slidesThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Create lecture presentations for FFHS (Fernfachhochschule Schweiz) in two formats:
Creates Slidev presentations with markdown slides, Vue components, modular imports, layouts, themes, animations, code highlighting, and best practices for developers.
Creates reveal.js presentations with themes, multi-column layouts, code highlighting, animations, speaker notes, and custom styling. Generates HTML + CSS with no build step. Use for slides, decks, or slideshows.
Generates Slidev presentations using a custom theme with layouts for cover, bullets, two-cols, stats-grid, and section-divider. References local theme files and guides slide structure from reports or outlines.
Share bugs, ideas, or general feedback.
Create lecture presentations for FFHS (Fernfachhochschule Schweiz) in two formats:
Use this skill when:
| Format | File Type | Output Directory | Advantages |
|---|---|---|---|
| reveal.js | HTML/Markdown | docs/slides/ | Web-based, Mermaid support, code highlighting |
| PowerPoint | PPTX | docs/slides/ | Offline, FFHS template, easy sharing |
docs/slides/
├── pva-01/
│ ├── index.html # Main presentation
│ └── slides.md # Markdown content (optional)
├── pva-02/
│ └── index.html
└── assets/
├── ffhs-theme.css # FFHS styling
└── ffhs-logo.svg # Logo
Create a reveal.js presentation using this template:
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PVA 1 - Grundlagen und Strukturen</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/reset.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/reveal.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/theme/white.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/styles/github.min.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;600;700&family=JetBrains+Mono&display=swap" rel="stylesheet">
<style>
/* FFHS Corporate Design - Red/Violet */
:root {
--ffhs-red: #d50006;
--ffhs-red-light: #e63946;
--ffhs-violet: #51247a;
--ffhs-violet-light: #9b59b6;
--ffhs-violet-transparent: rgba(81, 36, 122, 0.1);
--ffhs-text: #181716;
--ffhs-gray: #666666;
--ffhs-light-gray: #f5f5f5;
}
.reveal h1, .reveal h2 { color: var(--ffhs-red); font-weight: 600; }
.reveal h3 { color: var(--ffhs-violet); font-weight: 600; }
.reveal { font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif; color: var(--ffhs-text); }
.reveal .slides section { text-align: left; }
.reveal pre { border-left: 3px solid var(--ffhs-red); background: var(--ffhs-light-gray); border-radius: 4px; }
.reveal pre code { font-family: 'JetBrains Mono', monospace; font-size: 0.8em; background: var(--ffhs-light-gray) !important; }
.reveal pre code tr, .reveal pre code .hljs-ln-line { background: transparent !important; }
.reveal ul { margin-left: 1em; }
.reveal a { color: var(--ffhs-violet); }
.reveal a:hover { color: var(--ffhs-red); }
.reveal blockquote { background: var(--ffhs-violet-transparent); border-left: 4px solid var(--ffhs-violet); }
.reveal table th { background: linear-gradient(90deg, var(--ffhs-red) 0%, var(--ffhs-violet) 100%); color: white; }
.reveal .title-slide h1 { font-size: 2.5em; text-align: center; }
.reveal .title-slide h2 { color: var(--ffhs-violet); text-align: center; }
.reveal .title-slide p { text-align: center; color: var(--ffhs-gray); }
.ffhs-footer {
position: absolute; bottom: 1em; left: 1em;
font-size: 0.5em; color: var(--ffhs-gray);
}
</style>
</head>
<body>
<div class="reveal">
<div class="slides">
<!-- Title slide -->
<section class="title-slide">
<h1>PVA 1</h1>
<h2>Grundlagen und Strukturen</h2>
<p>Java Fundamentals (JaF) - FFHS</p>
</section>
<!-- Learning objectives -->
<section>
<h2>Lernziele</h2>
<ul>
<li>Von-Neumann-Architektur erklären</li>
<li>Java-Entwicklungsumgebung aufsetzen</li>
<li>Erstes Java-Programm schreiben</li>
<li>Klassen und Objekte verstehen</li>
</ul>
</section>
<!-- Code example -->
<section>
<h2>Erstes Java-Programm</h2>
<pre><code class="language-java" data-trim>
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello, FFHS!");
}
}
</code></pre>
</section>
<!-- Mermaid diagram -->
<section>
<h2>UML-Klassendiagramm</h2>
<div class="mermaid">
classDiagram
class Hund {
int groesse
String name
bellen()
}
</div>
</section>
</div>
<div class="ffhs-footer">FFHS - Java Fundamentals</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/reveal.js"></script>
<script src="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/highlight/highlight.js"></script>
<script src="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/markdown/markdown.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
<script>
mermaid.initialize({ startOnLoad: true, theme: 'default' });
Reveal.initialize({
hash: true,
slideNumber: true,
plugins: [ RevealHighlight, RevealMarkdown ]
});
</script>
</body>
</html>
| Type | HTML Structure |
|---|---|
| Title | <section class="title-slide"><h1>...</h1></section> |
| Content | <section><h2>Title</h2><ul>...</ul></section> |
| Code | <section><h2>...</h2><pre><code>...</code></pre></section> |
| Diagram | <section><h2>...</h2><div class="mermaid">...</div></section> |
| Image | <section><h2>...</h2><img src="..."></section> |
| Two Columns | <section><div style="display:flex">...</div></section> |
<section>
<section><h2>Main slide</h2></section>
<section><h3>Sub-slide 1</h3></section>
<section><h3>Sub-slide 2</h3></section>
</section>
Press S to open speaker notes:
<section>
<h2>Slide Title</h2>
<aside class="notes">
Notes for the instructor, not visible to students.
</aside>
</section>
The FFHS template is located at assets/ffhs-template.pptx (relative to this skill directory). When installed as a plugin, the resolved path is ${CLAUDE_PLUGIN_ROOT}/skills/ffhs-lecture-slides/assets/ffhs-template.pptx.
| Index | Layout | Usage |
|---|---|---|
| 0 | FFHS Titelfolie_einfach 4:3 | Title slide |
| 1 | FFHS Titel und Inhalt 4:3 | Standard content |
| 2 | FFHS Nummerierung 4:3 | Numbered list |
| 4 | FFHS Zwei Inhalte 4:3 | Two columns |
| 5 | FFHS Drei Inhalte 4:3 | Three columns |
| 6 | FFHS Vergleich 4:3 | Comparison slide |
| 9 | FFHS Bild mit Überschrift 4:3 | Image with title |
| 10 | FFHS Abschlussfolie 4:3 | Closing slide |
from pathlib import Path
from pptx import Presentation
# Load template (adjust path to your project layout)
template_path = 'assets/ffhs-template.pptx'
prs = Presentation(template_path)
# Remove example slides
while len(prs.slides) > 0:
rId = prs.slides._sldIdLst[0].rId
prs.part.drop_rel(rId)
del prs.slides._sldIdLst[0]
# Title slide
slide = prs.slides.add_slide(prs.slide_layouts[0])
slide.shapes.title.text = "PVA 1 - Grundlagen"
# Content slide
slide = prs.slides.add_slide(prs.slide_layouts[1])
slide.shapes.title.text = "Lernziele"
for shape in slide.shapes:
if shape.has_text_frame and shape != slide.shapes.title:
tf = shape.text_frame
tf.clear()
p = tf.paragraphs[0]
p.text = "Von-Neumann-Architektur erklären"
p = tf.add_paragraph()
p.text = "Java-Programm schreiben"
break
# Save
Path('docs/slides').mkdir(parents=True, exist_ok=True)
prs.save('docs/slides/pva-01-grundlagen.pptx')
Slide structure:
Slide structure:
extends keywordmkdir -p docs/slides/pva-01
# Then create index.html using the template above
pip install python-pptx
python scripts/create_pva_slides.py
# Using Python server
cd docs/slides/pva-01
python -m http.server 8000
# Open http://localhost:8000
| Key | Function |
|---|---|
→ / ↓ | Next slide |
← / ↑ | Previous slide |
Esc / O | Overview |
S | Speaker notes |
F | Fullscreen |
B | Black screen |
? | Help |