Slides Skill

A Claude Code /slides skill that turns a rough outline into a fully animated HTML slide deck in minutes, replacing PowerPoint and Google Slides.

Productivity / Presentationsproductivitypresentations
by AgentVoltv1.0.0Published 1y ago1 install
Free to sign up · every skill included with AgentVolt Pro

Before & after

Same prompt, same agent — the only difference is the skill.

PromptMake a 10-slide deck about our product roadmap
Beforegeneric AI agent
I can help you build a slide deck about your product roadmap. First, I'll need you to give me an outline of what you want to cover - the key themes, timelines, and milestones you want to highlight. Do you want each quarter in its own slide, or themes across quarters? What's your audience - internal team, investors, customers? Should I include specific feature names or keep it high-level? Once you provide an outline with the main points for each slide, I can create a deck for you, though you may want to refine the design and add your company logo afterward.
Afterwith Slides Skill
ANIMATED HTML SLIDE DECK GENERATED

╔═════════════════════════════════════════╗
║  Product Roadmap 2026 - 2027             ║
║  Fully animated, 10 slides               ║
║  Ready to present or share               ║
╚═════════════════════════════════════════╝

SLIDE 1: Title + Logo
  Fade-in animation, fade-out on advance

SLIDE 2: 2026 Completed (full-width chart)
  Q1: Auth v2, API stability
  Q2: Mobile app, Dashboard redesign
  Slide animation: left-to-right progress bar

SLIDE 3: Q3 2026 - In Progress
  Bullet points with staggered fade-in:
  • AI-powered insights engine (50% complete)
  • Integrations marketplace (30% complete)
  • Enterprise SSO (70% complete)
  Progress overlay animates as you present

SLIDE 4: Q4 2026 - Starting Soon
  Three parallel initiatives with icons
  Workflow automation, Team collaboration, Analytics overhaul
  Slide transitions with scale-up effect

SLIDE 5: H1 2027 Roadmap
  Timeline visualization with milestone dots
  (Jan) AI Features, (Feb) Automation, (Mar) Integrations
  Hover tooltips reveal detail on click

SLIDE 6: Feature Deep Dive - AI Insights
  3-column layout: Feature | Timeline | Value Prop
  Emphasis text animates in on advance

SLIDE 7: Customer Impact
  Bar chart showing expected efficiency gains
  X-axis: feature rollout | Y-axis: time saved
  Chart bars animate in with data labels

SLIDE 8: Dependencies & Risks
  2 columns: green checkmarks (mitigated) | orange warnings (monitoring)
  Risk mitigation animates with icon swaps

SLIDE 9: Investment & Resource Allocation
  Pie chart: engineering split by initiative
  Donut chart animates with percentages

SLIDE 10: Closing + Q&A
  Key takeaways list, fade-in by line

CUSTOMIZATION APPLIED:
  Color: Brand navy + accent gold
  Font: Playfair Display (headers) + Inter (body)
  Transitions: 400ms easing, consistent spacing
  Fully responsive for projector + mobile preview

DELIVERABLE:
  Single HTML file, no dependencies
  Works offline, shareable as link
  Print to PDF or present in any browser

About this skill


name: slides-skill-peter-yang description: Use when A Claude Code /slides skill that turns a rough outline into a fully animated HTML slide deck in minutes, replacing PowerPoint and Google Slides.

Slides Skill

the original author built a custom /slides skill with 12 slide formats and 3 templates that takes a rough outline and produces a polished, animated HTML deck without manual slide design.

What you get

  • A written tutorial breaking down the 6 steps that make the skill work, plus what's inside the skill file itself.

Customize your output

  • Swap in your own 3 templates, adjust the 12 available slide formats, or add new ones.

Example output

A full animated HTML deck generated in about 3 minutes, demoed live in the video.

Best for

Founders, marketers, and product people who build a lot of decks.

SKILL.md preview

SKILL.md
---
name: slides-skill-peter-yang
description: Use this skill when a rough outline needs to become a fully formatted, animated HTML slide deck instead of building slides manually in PowerPoint or Google Slides.
version: 1.0.0
category: Productivity / Presentations
author: AgentVolt
license: proprietary
tags:
  - productivity
  - presentations
  - standard
---

# Slides Skill

Turns a rough outline into a polished, animated HTML slide deck, selecting from a set of slide formats and templates instead of manual slide-by-slide design.

## When to use

… (sign up to view the full skill)
Sign up to view, copy, and install the full skill

More productivity skills

View all Productivity skills →