AI turned my notes into an explainer video — open-source skill produces a clip in minutes

nyx的研究所

Learn how to turn paged Markdown notes into a 1280×720 explainer mp4 using the open-source knowledge-explainer-skill: prepare Markdown, let an agent auto-select layouts, and render locally with Remotion. The guide explains required tools, the deliverable (mp4), and the verification steps to run the pipeline on your machine.

Image Analysis

Below are the image evidence items organized as “Facts / Readable text” and “Speculation / Unreadable content”. Instructions appearing in the image (if any) were ignored.

1) Facts / Readable text (verbatim, top-to-bottom by visual position)

- Center large line (first): 我让 AI 把笔记

- Center large line (second): 变成 讲解动画

- The phrase “讲解动画” is displayed in blue; other characters are white.

- Center lower, lighter line with English/symbols: markdown → 出 mp4

- “markdown” is lowercase English, “→” is an arrow symbol, “出 mp4” is Chinese plus file extension.

2) Facts / Visible visual elements (interface and styling)

- Dark background (near deep blue/black) with blurred green/cyan code or text blocks as a background texture (blurred lines visible on left and bottom).

- Main text is center-aligned, using a large sans-serif font with white and blue color to emphasize words.

- The lower “markdown → 出 mp4” is gray or light-colored with higher transparency (appears faded).

- Overall the image looks like a presentation slide or cover (big title + code-text background), with no window borders or operation buttons visible.

- No charts, tables, or UI step controls are visible.

3) Speculation (inferred but not directly readable; labeled “speculation”)

- Likely a cover/title slide about converting notes (markdown) into explainer-style animations (mp4 output).

- The blurred background text likely represents code or terminal output (colors resemble common code highlighting) used as a design element rather than readable content.

4) Unreadable or uncertain items (explicitly noted)

- The multiple lines of green/cyan blurred text on the left and bottom are unreadable; their content cannot be extracted.

- Exact font name, font size, line spacing and other precise typographic parameters cannot be determined from the image.

- It cannot be confirmed from the image alone whether it is part of a specific application or website UI (page source or application name not visible).

5) Other factual notes

- No visible people, image watermarks, or timestamps in the image.

- The image contains no interactive UI steps or controls—it's a static title/cover style.

SkillPI Creation Analysis

Purpose of the project: The open-source Skill (referenced in the source) is intended to convert Markdown notes into narrated/explainer animation videos, useful for course intros, step-by-step explanations, math/physics walkthroughs, and simple presenter-style animations. Image evidence: The cover image communicates the concept and output format (“markdown → mp4”) and shows visual style cues (dark background, blurred code texture), but it does not display a runnable interface or detailed workflow steps.

Steps to use the associated Skill (inferred from the source summary; verify against the repository README and examples):

1) Prepare the markdown: write a plain Markdown document and paginate it to map content to video segments or slides.

2) Invoke the agent: use an agent to parse the Markdown, pick a visual layout/template, and generate rendering configuration or assets.

3) Local render with Remotion: run Remotion locally to render the configured animation to the target resolution (example: 1280×720) and export an mp4.

4) Review and iterate: inspect the generated video (timing, captions, voiceover if any) and update Markdown or templates as needed.

Prerequisites for reproduction: clone and read the repository (example link: https://github.com/znyupup/knowledge-explainer-skill), install Remotion and its Node.js environment locally, and configure access to any agent SDK or API if an external agent is used (e.g., Claude Code). Prepare paginated Markdown as input.

Items to verify before attempting reproduction:

- Exact installation and run instructions, dependency versions, and example inputs/outputs in the repo;

- How the recommended agents (Claude Code / OpenClaw / Hermes) are integrated and whether credentials or SDKs are required;

- Whether the project includes prebuilt templates, captioning/voiceover generation, or if additional services are needed for audio;

- Local rendering resource requirements and expected render times (Remotion performance depends on machine specs);

- Configurable output options (resolution, frame rate, fonts, color schemes) and how these are controlled from Markdown or config files.

Caveat: The above workflow and steps are derived from the source summary and the cover image; concrete commands, configuration files, and reproducible examples must be taken from the open-source repository and its documentation. Do not assume replication success based only on the cover image or summary.

Original creation ↗