Home / All Skills / Content & Media Creation / presentation-video
Content & Media Creation · iart-ai/data-animation-skills

presentation-video

This skill should be used when the user asks to "make an animated presentation", "turn a pitch deck into a video", "convert slides/a deck to video", "make a presentation video", "build a deck video", "narrate a slide deck as a video", or "auto-advance slides synced to a voiceover". Covers rebuilding slides as motion graphics with staggered build reveals, slide-to-slide transitions, and timing locked to per-slide narration.

L4 High-Privilege · Graded auth & full auditV1 Commit-PinnedExecute CommandNetwork AccessWrite FileDual-pass Audit
Author iart-aiGitHub iart-ai/data-animation-skills ↗Stars 6License MIT(仓库根 LICENSE:「MIT License」/「Copyright (c) 2026 iart.ai」;.claude-plugin/plugin.json 与 README「## License」同声明 MIT)Commit 8ce2709c39
Control levels describe skill capabilities and suggested control measures; they do not represent quality or safety certifications, nor do they dictate usability. Usage decisions rest entirely with users and administrators. Different agent hosts apply varying constraints; do not assume hosts provide automatic protection. Third-party skill copyrights belong to their original authors. Use at your own risk.

1How It Works & Mechanism

The core premise is rebuilding rather than screen recording: screen recording inherits static visuals, mouse jitter, and hard cuts, whereas rebuilding achieves frame determinism, ease-able transitions, crispness at any resolution, and audio-driven durations.

skills/presentation-video/SKILL.md
A screen-recording inherits the deck's static look, mouse jitter, and abrupt slide cuts. Rebuilding in code (Remotion) buys: per-frame-deterministic reveals, transitions that actually ease, text that stays crisp at any resolution, and slide durations driven by audio length.
The working model is "the deck is the script; the video is a new artifact".

Narrative-first: define a one-sentence spine first, convey only one idea per slide, and make slide titles assertions rather than labels.

skills/presentation-video/SKILL.md
- **One throughline (the spine).** State the deck's single takeaway in one sentence. Every slide must advance that sentence; if a slide doesn't, cut it or move it to an appendix.
An autoplaying video has no live presenter to bail it out; the structure itself must carry the logic.

The single iron rule: narration controls the clock—each slide's duration = measured audio length for that slide + a small handle; guessing visually is prohibited.

skills/presentation-video/SKILL.md
**Each slide lasts exactly as long as its narration audio, plus a small handle.** Measure every voiceover clip's real duration, convert to frames, and make that the slide's length.
reference measures concurrently in calculateMetadata and converts to frame counts (HANDLE=0.4s).

Each slide's audio is mounted within its own component: audio and visuals are positioned by the same Sequence, making drift physically impossible.

skills/presentation-video/references/slide-components.md
Because the audio lives inside the same component that draws the visuals, and both are placed by the sequencer at the same start frame, voice and picture physically cannot drift.
Eliminate desync through architectural guarantees rather than manual alignment.

Account for transition frame budgets: transitions in TransitionSeries overlap rather than add time, consuming frames from neighboring slides.

skills/presentation-video/references/sequencing.md
A `<TransitionSeries.Transition>` does **not** add time — it overlaps its neighbors, consuming frames from the end of the outgoing slide and the start of the incoming one.
Slides whose narration must play to completion need the transition duration compensated back into their budget.

In-slide build reveals must sync with narration: elements appear the moment they are spoken, preventing readers from reading three lines ahead.

skills/presentation-video/SKILL.md
The point of a build is pacing: show each element when the narration reaches it, so the viewer reads the line being spoken — not three lines ahead.
Reveal rhythm is therefore derived from the narration rather than a rigid grid.

Readability is a hard line: body text ≥28–32px @1080p, titles 56–80px, contrast ≥4.5:1, content kept within the center 90%.

skills/presentation-video/SKILL.md
- **Type scale, not deck scale.** A deck viewed on a laptop ≠ a video viewed in a feed. Bump body to ≥ 28–32px at 1080p; titles 56–80px.
Supporting discipline: split across slides if content doesn't fit; never shrink font size.

Verification loop: read compositions first to get total duration, then sample from each slide's "hold section" rather than during transitions.

skills/presentation-video/SKILL.md
- Use `npx remotion compositions` to read the deck's `durationInFrames`/`fps` and pick the end frame; sample a still **inside each slide's hold**, not on a transition, to judge the built state.
Check items include overflowing the center 90%, body font too small, and contrast too low.

Transitions must carry logic (therefore / however / so): quiet fades for "and", large pushes only for section dividers.

skills/presentation-video/SKILL.md
- **Transitions carry logic, not just motion.** The cut between slides should answer "so what's next?" — therefore, but, which means, here's the proof.
Upgrade transitions from decoration to argumentative markers.

2Core Capabilities

01Narration-driven duration (calculateMetadata parallel measurement → frames + HANDLE)
02Narrative structure tools (spine / one idea per slide / five-act pitch structure: tension → resolution)
03Slide component library (useEnter / TitleCard / BulletList / Slide / SectionDivider)
04TransitionSeries orchestration (select fade or slide based on neighbor types, large transitions for dividers)
05Transition frame budget accounting (compensate consumed frames back to the slide)
06Readability checklist (font size / contrast / safe area / tabular-nums for numbers)
07Batch rendering multiple decks (one template × one JSON per client/region)
08Failure mode checklist (guessing durations, deck-level audio mounting, heavy transitions everywhere, overcrowding slides, missing fonts)

3External Dependencies

KindDependency / Endpoint
packageremotion(AbsoluteFill/Sequence/Audio/spring/interpolate)
package@remotion/media-utils(getAudioDurationInSeconds 量测旁白)
package@remotion/transitions(TransitionSeries / linearTiming / fade / slide)
package@remotion/google-fonts(reference 建议的字体加载方式;选择它会在渲染期访问 Google Fonts)
clinpm / npx(安装并运行 Remotion 工程、读 compositions、渲染)
networkiart.ai(reference 尾部推广链接,具 utm 参数;仅读者点击才请求)

4Recommended Governance & Evidence

Suggested Controls for Safe Operation
For Agent Runtime
Graded/per-use authorization, sandbox recommended
For Administrators
Approval workflow, rollback support, full audit
Evidence & Triggers (File Paths & Excerpts)
  • scripts/: Local script or command execution: No built-in scripts inside the skill directory; SKILL.md/reference instructs agent to execute `npm i remotion @remotion/tra
  • 网络端点: Declared external network access: No operational API calls during runtime; narration audio consists of local files measured locally by Remotion.
  • 本地工作目录: File I/O and artifact output: Writes `out/f-title.png`/`out/f-mid.png`/`out/f-end.png`, `out/deck.mp4`, `o` inside the user project.
Audit Notes: . The trigger is the classification pattern "relies on third-party plugins, images, remote packages": the skill directory is pure Markdown (no scripts, no credential access, no env access), but the delivery path requires installing and running remote packages remotion + @remotion/media-utils + @remotion/transitions; additionally, reference explicitly suggests using @remotion/google-fonts to load brand fonts, which will trigger requests to Google Fonts at render time. In the same repository, `remotion-video` was marked orange under the same criteria, and this aligns with it. **Explicitly non-applicable items**: No credential/cookie/environment variable reading (zero substantive hits on token scanning); no uploading of assets to external generative services (narration and visuals remain entirely local); no TLS downgrade, no `--no-verify`, no sandbox disabling, no anti-automation evasion. Trigger conditions: Occurs only during project installation, video rendering, or when using Google Fonts.

5Second-Pass Verification

  • [ok] 音频量测与 HANDLE 数值是否两处一致 — SKILL.md 代码块 `const HANDLE = 0.4; // breathing room after the voice ends` 与 sequencing.md 的 `const HANDLE = 0.4; // seconds of breathing room after each voice line` 同值。
  • [ok] theme 数值是否与 reference 一致 — SKILL.md 示例 theme(bg #0B0B12 / fg #F5F5F7 / accent #6C5CE7 / titlePx 72 / bodyPx 30 / maxWidthPct 90)与 slide-components.md 的 theme.ts 逐项相同。
  • [ok] 转场帧预算的声明与实现 — SKILL.md「A transition borrows frames from both neighbors, so add its length back into the slide budget」与 sequencing.md 的记账规则(slide.durationInFrames += TRANSITION)同口径。
  • [discrepancy] @remotion/google-fonts 的声明层级 — @remotion/google-fonts 只出现在 sequencing.md 的 pitfalls(作为可选建议),SKILL.md 既未列入依赖面、也未提示渲染期可能访问 Google Fonts;照抄该建议会产生未声明的出网行为。
  • [ok] SKILL.md 内联组件与 reference 组件是否冲突 — SKILL.md 的 Bullet 用 spring(...durationInFrames: 12) + interpolate(p,[0,1],[18,0]),reference 用 useEnter() 封装同一动效;属精简版与封装版的关系,非矛盾。
  • [unlocatable] 旁白生成方式是否被声明 — SKILL.md workflow 第 2 步写「Generate/record narration per slide.(One audio file per slide (TTS or recorded).)」但未指名任何 TTS 服务或端点——属用户自备素材;「无 TTS 端点」这一结论无法在源码内定位到明确声明,故记 unlocatable(非档位依据)。

6Verdict & Scenarios

  • Durations are derived from actual audio measurement rather than visual estimation, eliminating cutoffs or dead air at the root
  • Audio-visual sync is guaranteed structurally (audio mounted inside slide components), avoiding manual calibration
  • Narrative structure is treated as a first-class citizen (spine, one idea per slide, logic-bearing transitions)
  • Transition frame budgeting rules prevent silent reduction of narration time
  • Enforces concrete readability thresholds with an explicit policy of "split slides instead of shrinking fonts"
  • Best for: Scenarios converting pitch decks, webinars, or course modules into autoplaying narrated videos: requires duration to strictly follow voiceover, one point per slide, brand lock-in, and batch generation across clients/regions.
    Not for: Cases without narration audio (the entire timing logic of this skill relies on audio) or when only a single-page infographic/chart video is needed (use animated-infographic or chart-animation); pure screen recording requests.
    Install Agent-Ready
    ① Verified Mirror 2026-09-28
    Option A · Direct DownloadDownload presentation-video.tar.gz
    sha256: c9a450ffb476b92f…
    Option B · Copy Guide for Agent
    install.json
    Agents automatically download and verify mirrors from this JSON guide.
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit 8ce2709c39.