explain

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Explain

讲解

Make the subject easier to understand. Choose a useful medium, establish a coherent visual model, and deliver a working artifact when requested. This skill runs in Codex, OpenCode, and Claude Code using ordinary file, shell, browser, and HTTP capabilities; no particular MCP server or harness-specific tool is required.

Inspired by Karpathy's explanation-format post: clear writing, diagrams, interactive pages, and bespoke narrated explainers. These are options, not a mandatory escalation ladder.

让主题更容易理解。选择合适的表现形式，建立连贯的视觉模型，并在用户要求时交付可用的作品。本 skill 可在 Codex、OpenCode 和 Claude Code 中运行，使用常规的文件、shell、浏览器和 HTTP 能力；不需要特定的 MCP server 或 harness 专用工具。

灵感来自 Karpathy 的讲解格式文章：清晰的文字、图示、交互式页面以及定制旁白讲解。这些只是可选形式，并非必须逐级升级的流程。

Choose the output

选择输出形式

Honor the requested medium. Otherwise use the smallest format that resolves the understanding problem:

Understanding problem	Output
Definition or short conceptual question	Concise prose, with a small example
Structure, relationships, or a short sequence	SVG or Mermaid diagram
Cause and effect, adjustable parameters, comparing scenarios	Interactive HTML with meaningful controls
A process over time or a story best taught through narration	Animated video with narration and captions

Do not turn a request for recommendations or a script into an unrequested production. For ambiguous artifact requests, infer sensible defaults and state them: technically curious adult, English, local output; for video, roughly 60–90 seconds at 1080p/30 fps. Ask only when missing audience, facts, format, or budget would materially change the result.

遵循用户指定的媒介。否则，选择能够解决理解问题的最小形式：

理解问题	输出形式
定义或简短的概念问题	简洁文字，并附一个小型示例
结构、关系或简短流程	SVG 或 Mermaid 图示
因果关系、可调参数或场景对比	带有有效控制项的交互式 HTML
随时间发展的过程或更适合通过旁白讲述的故事	带旁白和字幕的动画视频

不要将推荐或脚本请求擅自扩展为未经要求的制作。对于含义不明确的作品请求，应合理推断默认设置并明确说明：面向具备一定技术背景的成年受众、使用英语、输出到本地；视频默认约 60–90 秒，分辨率为 1080p/30 fps。只有当受众、事实、格式或预算缺失且会实质影响结果时才进行询问。

Build the explanation

构建讲解

Establish what the viewer should understand afterward. Inspect supplied code/data and verify unstable or disputed claims against primary sources. Keep source URLs with the project. Distinguish simplified examples from measured results.
Write in plain, controlled English inspired by ASD-STE100: short sentences, concrete verbs, stable names, one main idea per sentence, and terms defined before use. Preserve nuance; do not claim formal ASD-STE100 compliance.
Build a causal sequence: familiar starting point → concrete example → visible mechanism → consequence → useful takeaway. A visual should explain a relationship or change, not simply decorate narration.
For substantial artifacts, draft a compact storyboard with scene ID, teaching point, narration, visible objects, action, and source. Proceed within existing authorization; do not impose a new approval gate unless the user asked to review first.

明确观看者理解后应掌握的内容。检查提供的代码和数据，并针对主要来源验证可能变化或存在争议的说法。将来源 URL 与项目一并保留。区分简化示例与实测结果。
采用受 ASD-STE100 启发的平实、克制英语：句子简短、动词具体、名称保持一致、每句话只表达一个主要观点，并在使用术语前给出定义。保留细微含义；不要声称完全符合 ASD-STE100。
构建因果链条：熟悉的起点 → 具体示例 → 可见机制 → 后果 → 实用结论。视觉内容应解释某种关系或变化，而不应只是装饰旁白。
对于内容较多的作品，先编写紧凑的分镜脚本，包含场景 ID、教学重点、旁白、可见对象、动作和来源。在现有授权范围内继续执行；除非用户要求先行审阅，否则不要设置新的审批环节。

Select animation and narration

选择动画和旁白

Read references/animation.md when producing animated HTML or video. Defaults:

Interactive HTML: HTML/CSS/SVG plus GSAP when a timeline or morphing is useful.
Polished video: Remotion with React/SVG and frame-driven motion. Add Three.js through
```
@remotion/three
```
when depth or spatial relationships help.
Vector teaching animations: Motion Canvas when synchronized diagrams are the main content.
Do not default to Manim. Use it only when explicitly requested or accepted for a specific mathematical requirement.

Read references/tts.md when narration is requested:

No API bill / local processing: Kokoro, if its language and available voices fit.
Low-cost hosted narration: Kokoro on DeepInfra, subject to current availability and price.
Premium expressive narration: audition ElevenLabs on a representative passage; quality is a listening judgment, not a guaranteed ranking.

Use the user's existing provider, voice, and budget when specified. An API key being present does not establish a spending budget. Honor existing authorization; otherwise continue free/local preparation and ask only before unapproved paid usage. Keep keys in environment variables and out of generated client code. Do not silently switch local narration to a cloud service.

制作动画 HTML 或视频时，阅读 references/animation.md。默认选择：

交互式 HTML： HTML/CSS/SVG；当时间轴或形变动画有帮助时，使用 GSAP。
精致视频： 使用 Remotion 搭配 React/SVG，以帧驱动动画。当深度或空间关系有助于表达时，通过
```
@remotion/three
```
添加 Three.js。
矢量教学动画： 当同步图示是主要内容时，使用 Motion Canvas。
不要默认使用 Manim。仅在用户明确要求，或已接受其用于特定数学需求时使用。

需要旁白时，阅读 references/tts.md：

无 API 费用／本地处理： 如果语言和可用声音适合，使用 Kokoro。
低成本托管旁白： 在 DeepInfra 上使用 Kokoro，具体取决于当前可用性和价格。
高质量表现力旁白： 使用一段有代表性的文本试听 ElevenLabs；质量应以实际试听判断，而不是依赖固定排名。

如果用户指定了现有 provider、声音和预算，应优先采用。存在 API key 并不代表已确定支出预算。遵循现有授权；否则继续进行免费／本地的准备工作，并且仅在可能产生未经批准的付费使用前询问。将 key 保存在环境变量中，不要写入生成的客户端代码。不要在未说明的情况下将本地旁白切换为云服务。

Produce and synchronize

制作与同步

Work in a dedicated output folder, with editable source and pinned dependencies. Resolve reference paths relative to this skill, not the current project. Inspect the existing runtime before installing anything; keep dependencies in the artifact project or its virtual environment.
Define typography, spacing, palette, and recurring object identities before animating. Use deliberate easing, restrained depth, and visual continuity. Introduce labels at the moment their objects matter. Avoid dense paragraphs and gratuitous camera motion.
Generate narration by scene. Cache each result by text, provider/model, voice, and voice settings so a visual edit does not trigger another paid synthesis.
Measure actual audio duration before finalizing scene lengths. Use timestamps or alignment for precise captions; do not manufacture word timestamps from character counts. Keep captions faithful to spoken audio when pronunciation spellings differ from display text.
Drive video motion from frame/time, with seeded randomness. Do not rely on wall-clock animation, live scrolling, network responses, or unseeded particle motion during rendering.
For HTML, provide keyboard controls, pause/replay, a useful reduced-motion state, and a text explanation. Load local assets when promising offline operation.
For video, render a short representative segment before the full export. Use an MP4 with broadly supported video/audio codecs unless another format is requested. Preserve narration and subtitle files separately.

在专用输出文件夹中工作，保留可编辑源文件和固定版本的依赖项。参考路径应相对于本 skill 解析，而不是相对于当前项目。安装任何内容前先检查现有运行环境；将依赖项保留在作品项目或其虚拟环境中。
开始制作动画前，先确定字体排印、间距、配色和重复出现的对象身份。使用有目的的缓动、克制的纵深效果和视觉连续性。在对象发挥作用时才引入标签。避免密集段落和无意义的镜头运动。
按场景生成旁白。依据文本、provider/model、声音和声音设置缓存每个结果，避免视觉编辑触发再次付费合成。
确定场景长度前，测量实际音频时长。使用时间戳或对齐机制生成精确字幕；不要根据字符数伪造单词时间戳。当发音拼写与显示文本不同时，字幕应忠实于实际语音。
使用帧／时间驱动视频动画，并采用带种子的随机性。渲染期间不要依赖实时时钟动画、实时滚动、网络响应或未设种子的粒子运动。
对于 HTML，应提供键盘控制、暂停／重播功能实用的减少动态效果状态，以及文字说明。承诺离线运行时，应加载本地资源。
对于视频，在完整导出前先渲染一段有代表性的片段。除非用户要求其他格式，否则使用采用广泛支持的视频／音频编解码器的 MP4。旁白和字幕文件应分别保留。

Verify and deliver

验证与交付

Open the HTML and exercise its controls, or inspect rendered video frames at scene boundaries and the densest moments. Check clipping, contrast, mobile legibility where applicable, missing fonts/assets, and factual labels. Check audio duration, clipping/silence, pronunciations, and synchronization using playback where available. If listening or visual inspection is unavailable, report exactly which checks were not performed.

For video, verify container, codecs, dimensions, frame rate, duration, and presence of the audio stream using available media tools. Check captions fit their scenes and the final sentence is not cut off. Building source code alone does not verify the export.

Deliver the requested artifact, editable sources, a concise transcript/source list, and a reproduction command. State actual versus estimated narration cost and any incomplete verification. Save local previews without publishing or uploading unless the task authorizes it.

打开 HTML 并实际操作其控制项，或检查视频在场景边界和信息最密集时刻的渲染帧。检查内容裁切、对比度、适用时的移动端可读性、缺失的字体／资源和事实性标签。环境允许时，通过播放检查音频时长、削波／静音、发音和同步。如果无法进行聆听或视觉检查，应准确说明未执行的检查项目。

对于视频，使用可用的媒体工具检查容器格式、编解码器、尺寸、帧率、时长以及音频流是否存在。检查字幕是否适配对应场景，并确认最后一句未被截断。仅生成源代码并不能验证导出结果。

交付用户要求的作品、可编辑源文件、简洁的文字稿／来源列表以及复现命令。说明实际旁白成本与估算成本的差异，以及尚未完成的验证项目。保存本地预览，除非任务明确授权，否则不要发布或上传。

Invocation examples

调用示例

“Use explain to explain transformer attention with an interactive HTML page.”
“Use explain to make a polished 90-second video of this architecture. Use local Kokoro and Remotion.”
“Use explain to turn this research into a narrated explainer. Hosted TTS budget: $1.”

Codex can invoke

$explain

; Claude Code can invoke

/explain

. In OpenCode, ask to use the

explain

skill. Natural-language selection is also supported when the harness makes the skill available.

“使用 explain 通过交互式 HTML 页面讲解 Transformer 的 attention 机制。”
“使用 explain 为此架构制作一段精致的 90 秒视频。使用本地 Kokoro 和 Remotion。”
“使用 explain 将这项研究制作成带旁白的讲解视频。托管 TTS 预算：1 美元。”

Codex 可以调用

$explain

；Claude Code 可以调用

/explain

。在 OpenCode 中，可以要求使用

explain

skill。如果 harness 提供该 skill，也支持通过自然语言进行选择。