본문으로 건너뛰기
cccskills
무료GitHub에 공개

slides

Generate Marp-compatible slide decks from structured JSON schema. Converts context into presentations for tech talks, sprint demos, and tutorials.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(2)

  • SKILL.md5.2 KB
  • scripts/build-deck.js3.9 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

slides

Purpose

Generates structured slide decks as Marp-compatible markdown. The agent analyzes context (feature, sprint, tutorial) and produces a JSON slide schema, then calls build-deck.js to convert it to presentation-ready markdown. The script standardizes output format — preventing agent freestyle errors when context runs low.

Triggers

  • User says "create slides", "make presentation", "demo deck", "sprint review slides", "tech talk"
  • /rune slides — manual invocation
  • Called by other skills needing presentation output

Called By (inbound)

  • marketing (L2): launch presentations, product demos
  • video-creator (L3): slide-based video storyboards
  • User: direct invocation

Calls (outbound)

None — pure L3 utility.

Executable Instructions

Step 1: Analyze Context

Determine the presentation type from the user's request:

ContextTemplateTypical Slides
Feature demoDemo walkthroughProblem → Solution → Architecture → Live demo → Next steps
Sprint reviewSprint summaryGoals → Completed → Metrics → Blockers → Next sprint
Tech talkTeaching formatHook → Concept → Deep dive → Code examples → Takeaways
TutorialStep-by-stepIntro → Prerequisites → Step 1-N → Summary → Resources
PitchPersuasionProblem → Market → Solution → Traction → Ask

Step 2: Generate JSON Schema

Create a JSON file following this schema:

{
  "title": "Presentation Title",
  "author": "Author Name (optional)",
  "theme": "default|gaia|uncover",
  "slides": [
    {
      "type": "title|content|code|diagram|image|quote|section",
      "heading": "Slide Heading",
      "body": "Markdown body text",
      "notes": "Speaker notes (optional)",
      "code": { "lang": "javascript", "source": "console.log('hi')" },
      "diagram": "graph LR; A-->B"
    }
  ]
}

Slide types:

  • title — opening slide with # heading
  • content — standard slide with ## heading + body
  • code — slide with syntax-highlighted code block
  • diagram — slide with Mermaid diagram (stays a Mermaid fence for Marp; do NOT replace with a diagram-generated HTML here)
  • image — slide with image reference in body
  • quote — slide with blockquote formatting
  • section — section divider with # heading

Save the JSON to a temporary file (e.g., slides.json).

Step 3: Build Deck

Execute the build script:

node {scripts_dir}/build-deck.js --input slides.json --output deck.md

The script outputs Marp-compatible markdown with:

  • Marp frontmatter (marp: true, theme)
  • Slide separators (---)
  • Speaker notes as HTML comments
  • Code blocks with language hints
  • Mermaid diagram blocks

Step 4: Present Result

Show the user:

  1. The generated deck.md file path
  2. How to preview: npx @marp-team/marp-cli deck.md --preview (or any Marp viewer)
  3. How to export PDF: npx @marp-team/marp-cli deck.md --pdf

Fallback: If {scripts_dir}/build-deck.js is unavailable, generate the Marp markdown directly — the script is an optimization, not a hard dependency.

Output Format

---
marp: true
theme: default
---

# Presentation Title

Author Name

---

## Slide Heading

Slide body content

<!-- notes: Speaker notes here -->

Sharp Edges

Failure ModeSeverityMitigation
build-deck.js not foundLOWAgent generates Marp markdown directly (fallback)
Invalid JSON inputMEDIUMScript exits 1 with parse error — agent fixes JSON and retries
Marp not installedLOWScript outputs plain .md — user installs Marp CLI separately
Too many slides (>30)MEDIUMAgent should split into multiple decks or summarize
System/architecture/flow/sequence/state/ER/swimlane diagramsMEDIUMEditorial HTML/SVG diagrams → diagram. For an editorial slide graphic: diagram with size=slide-16x9, then embed the HTML or a screenshot — do NOT replace the Marp type: diagram fence (that stays Mermaid for build-deck.js)

Constraints

  1. Output MUST be valid Marp markdown (parseable by @marp-team/marp-cli)
  2. DO NOT embed build-deck.js source in this skill — call it via {scripts_dir}
  3. DO NOT require Marp installation — output is standard markdown that Marp can consume
  4. Keep slide count reasonable (5-15 for demos, 10-25 for talks)
  5. Always include speaker notes for non-trivial slides

Returns

ArtifactFormatLocation
Slide schemaJSONslides.json (temporary)
Presentation deckMarp Markdowndeck.md or user-specified path

Done When

  • Presentation type identified (demo/sprint/talk/tutorial/pitch)
  • JSON schema generated with correct slide types
  • build-deck.js executed (or fallback markdown generated)
  • Output file path presented to user
  • Preview/export commands provided

Cost Profile

~500-1500 tokens input, ~300-800 tokens output. Sonnet for quality copy and structure.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

adversary

무료

Pre-implementation red-team analysis. Use when a plan is high-risk, critical path, or expensive to reverse. Challenges plans before code is written — finds edge cases, security holes, scalability bottlenecks, error propagation risks, and integration conflicts. Catches flaws at plan time (10x cheaper than post-implementation).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

Creates code-based visual assets — SVG icons, OG image HTML templates, social banners, and icon sets. Use when generating visuals as code (vector/HTML), NOT raster images — for raster generation see @rune-pro/media. Outputs files with usage instructions.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

audit

무료

Comprehensive project audit — security, dependencies, code quality, architecture, performance, infra, docs, and mesh analytics. Use when needing a full 8-dimension health-score snapshot before a major release, M&A diligence, or quarterly review. Delegates to specialist skills (sentinel, dependency-doctor, perf, autopsy, etc.).

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

autopsy

무료

Full codebase health assessment. Use when diagnosing project health or starting a rescue workflow on legacy code — OR when evaluating an external GitHub repo for dependency / fork / contribution decisions (--external mode). Analyzes complexity, dependencies, dead code, tech debt, and git hotspots. Produces a health score and rescue plan.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

ba

무료

Business Analyst agent. Use when starting a new feature requiring requirements elicitation BEFORE plan or cook. Asks probing questions, identifies hidden requirements, maps stakeholders, defines scope boundaries, and produces a structured Requirements Document that plan and cook consume.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

Creative ideation and solution exploration. Generates multiple approaches with trade-offs, uses structured frameworks (SCAMPER, First Principles), and hands off to plan for structuring.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Rune-kit/rune862026년 8월 16일 업데이트

Rune-kit의 스킬 모두 보기

이 스킬의 문제 신고