Individual skill
motion-showreel
用代码制作图形、文字或界面动画视频,输出 MP4 和可编辑源码,最长 20 分钟。适用于动效作品集、产品片、UI 动效、动态排版、Logo 片头、生成艺术与讲解视频;支持独立选择 BGM/音效来源、用户口播,以及用用户提供的口播稿通过 TTS 合成语音。不用于实拍制作、写实人物生成或一般视频剪辑。
skills/motion-showreel/SKILL.md
Source commit 2b9a89340b70f632d31c0f1c69fce94a7912423e
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- Yes
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Network or broad shell
- Last checked
- Nov 9, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 14,956
- Repository last updated
- Nov 8, 2026
- License
- MIT
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- agent Repository topic
- claude Repository topic
- gpt-image-2 Repository topic
- rag Repository topic
- skills Repository topic
- web-design Repository topic
- design Derived category
- design-interface Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
README.mddoc · 21,213 bytesREADME.zh-CN.mddoc · 21,157 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesSKILL.mdcore · 32,386 bytesassets/editor/editor.cssasset · 20,545 bytesassets/editor/editor.jsruns · 28,650 bytesassets/editor/index.htmlasset · 6,861 bytesassets/editor/progress.jsruns · 12,105 bytesassets/editor/viewport.cssasset · 340 bytesassets/editor/viewport.jsruns · 10,309 bytesassets/starter/build.shruns · 5,286 bytesassets/starter/index.htmlasset · 4,783 bytesassets/starter/motion.jsruns · 13,717 bytesassets/starter/narration.jsruns · 7,311 bytesassets/starter/package.jsonruns · 64 bytesassets/starter/preview.jsruns · 12,572 bytesassets/starter/score.layer.mjsruns · 1,402 bytesassets/starter/score.mjsruns · 2,404 bytesassets/starter/score.tone.jsruns · 2,791 bytesassets/starter/timeline.jsruns · 1,805 bytesmanifest.jsonasset · 797 bytesreferences/brief-template.mddoc · 9,534 bytesreferences/craft.mddoc · 22,521 bytesreferences/editor.mddoc · 7,300 bytesreferences/formats.mddoc · 9,162 bytesreferences/long-form.mddoc · 6,190 bytesreferences/narration.mddoc · 12,666 bytesreferences/progress.mddoc · 11,143 bytesreferences/recipes.mddoc · 17,295 bytesreferences/review.mddoc · 15,015 bytesreferences/sound.mddoc · 28,109 bytesreferences/stack.mddoc · 13,558 bytesreferences/styles/INDEX.mddoc · 10,177 bytesreferences/styles/_template.mddoc · 3,503 bytesreferences/styles/art-deco.mddoc · 8,276 bytesreferences/styles/blueprint.mddoc · 8,335 bytesreferences/styles/cel-anime-80s.mddoc · 8,448 bytesreferences/styles/cinematic-title.mddoc · 6,112 bytesreferences/styles/comic-pop.mddoc · 7,807 bytesreferences/styles/concept-morph.mddoc · 7,563 bytesreferences/styles/copperplate-engraving.mddoc · 9,703 bytesreferences/styles/crayon-storybook.mddoc · 5,772 bytesreferences/styles/crt-vhs.mddoc · 6,179 bytesreferences/styles/dark-keynote.mddoc · 6,087 bytesreferences/styles/data-motion.mddoc · 6,485 bytesreferences/styles/editorial-collage.mddoc · 5,712 bytesreferences/styles/flat-vector.mddoc · 7,336 bytesreferences/styles/generative-geometry.mddoc · 5,515 bytesreferences/styles/glass-material.mddoc · 7,255 bytesreferences/styles/glitch-digital.mddoc · 7,824 bytesreferences/styles/guochao.mddoc · 7,791 bytesreferences/styles/hologram-hud.mddoc · 8,390 bytesreferences/styles/illuminated-manuscript.mddoc · 7,850 bytesreferences/styles/ink-wash.mddoc · 5,830 bytesreferences/styles/isometric-infographic.mddoc · 5,887 bytesreferences/styles/kinetic-brutalist.mddoc · 6,001 bytesreferences/styles/liquid-shader.mddoc · 5,864 bytesreferences/styles/minimal-ui.mddoc · 6,263 bytesreferences/styles/mixed-media-era.mddoc · 9,223 bytesreferences/styles/one-line.mddoc · 8,221 bytesreferences/styles/painterly.mddoc · 7,553 bytesreferences/styles/paper-cut.mddoc · 5,684 bytesreferences/styles/particle-field.mddoc · 5,826 bytesreferences/styles/pixel-diorama.mddoc · 8,637 bytesreferences/styles/pixel-game.mddoc · 6,147 bytesreferences/styles/risograph-print.mddoc · 6,050 bytesreferences/styles/rubber-hose.mddoc · 8,634 bytesreferences/styles/shadow-puppet.mddoc · 8,496 bytesreferences/styles/soft-3d-toy.mddoc · 5,682 bytesreferences/styles/soft-organic.mddoc · 7,175 bytesreferences/styles/stained-glass.mddoc · 8,635 bytesreferences/styles/swiss-editorial.mddoc · 6,974 bytesreferences/styles/synthwave-neon.mddoc · 8,710 bytesreferences/styles/terminal-ascii.mddoc · 5,759 bytesreferences/styles/tilt-shift-miniature.mddoc · 8,390 bytesreferences/styles/ukiyo-e.mddoc · 8,180 bytesreferences/styles/whiteboard-explainer.mddoc · 7,906 bytesscripts/audio.mjsruns · 22,028 bytesscripts/build-long.mjsruns · 17,565 bytesscripts/check-env.mjsruns · 2,302 bytesscripts/editor.mjsruns · 11,822 bytesscripts/inspect.mjsruns · 23,952 bytesscripts/lib/browser.mjsruns · 8,319 bytesscripts/lib/editor-media.mjsruns · 10,233 bytesscripts/lib/editor-model.mjsruns · 8,648 bytesscripts/lib/editor-progress.mjsruns · 17,841 bytesscripts/lib/fft.mjsruns · 1,508 bytesscripts/lib/frames.mjsruns · 10,214 bytesscripts/lib/narration-providers.mjsruns · 8,325 bytesscripts/lib/narration.mjsruns · 22,669 bytesscripts/lib/project.mjsruns · 2,721 bytesscripts/lib/synth.mjsruns · 41,387 bytesscripts/lib/text-hook.mjsruns · 7,366 bytesscripts/lib/tone-render.mjsruns · 5,892 bytesscripts/narration.mjsruns · 4,058 bytesscripts/package-lock.jsonasset · 3,066 bytesscripts/package.jsonruns · 393 bytesscripts/preview.mjsruns · 6,229 bytesscripts/progress.mjsruns · 4,051 bytesscripts/render.mjsruns · 25,446 bytesscripts/scaffold.shruns · 3,316 bytesscripts/setup.shruns · 1,544 bytesscripts/test/editor-layout.test.mjsruns · 11,628 bytesscripts/test/editor-model.test.mjsruns · 7,560 bytesscripts/test/editor-progress.test.mjsruns · 21,663 bytesscripts/test/editor.test.mjsruns · 13,463 bytesscripts/test/fixtures/page/index.htmlasset · 907 bytesscripts/test/fixtures/text/index.htmlasset · 2,168 bytesscripts/test/long.test.mjsruns · 11,959 bytesscripts/test/narration-clock.test.mjsruns · 7,451 bytesscripts/test/narration.test.mjsruns · 14,231 bytesscripts/test/preview.test.mjsruns · 14,356 bytesscripts/test/render-context.test.mjsruns · 3,605 bytesscripts/test/starter.test.mjsruns · 3,322 bytesscripts/test/tools.test.mjsruns · 31,026 bytes
Read excerpt
# Motion Showreel
把一个想法做成以图形、文字或界面动画为主的视频,交付 MP4 和能重建的源码。保留短片的动效密度和创意自由,也支持按章节制作最长 20 分钟的内容。
**原理**:页面暴露确定性的 `render(t)`,脚本逐帧截图,再用 ffmpeg 合成 MP4。画面、口播、配乐和音效共用 `timeline.js`。无口播时按内容和音乐节拍组织画面;有口播时以真实语音时间为准,再安排音乐和音效。
**默认先预览,再导出**:所有类型都先打开剪辑工作区让用户查看真实画面与声音。用户点击「导出视频」或在对话中确认预览通过、可以导出后,才合成 MP4。首次要求「做一个视频」不等于预览已经通过;只有用户明确免除预览时才能直接导出。静帧、自查和音频准备可提前进行,不默认生成代理 MP4 或整片样片。
**按需观看制作过程**:需求问答时识别「边做边看、实时进度、每个阶段看看」等意愿;用户表达后就提前打开进度页,从需求说明到风格帧、口播样例、镜头与混音逐步展示。按 `references/progress.md` 发布已自查的阶段成果,不直接加载半成品代码。收到用户确认后,先用 `progress.mjs <project> --stage <当前阶段> --confirm --message "已确认,正在……"` 解除等待,再进行调研、下载或制作;不等产物做完才补进度。未提出时保持默认的最终工作区预览;不改变制作标准、确认节点和成片验收。
**好片子从哪来**:变化密度、运动质感、一个记忆点、音画关系,这四项通常决定观感。但具体怎么动、动多少,由**风格和内容**决定,不是每支片子都要多机位、弹簧和满屏音效。全局只守几条底线(见「底线」),其余都是给模型的起点,不是天花板。
**视频感**:讲解、产品演示和叙事片要让对象的行为与关系随内容发展,保持镜头间的空间承接。不能把口播逐句变成静态标题卡,再用淡入、缩放和背景粒子包装。分镜先写清「观众要看懂什么变化、主体前后状态、如何接上一个镜头」,再选动效。Logo、动态排版、循环与刻意静止的风格仍按自身语法制作;不靠持续乱动或强制 60fps 判定好坏。具体方法见 `references/craft.md` 的「连续叙事」。