motion-stack
From the author
用代码做动效短片的通用底座:按 brief 从 20 个开源库(Three.js、PixiJS、p5、Paper、Matter、Rapier、anime.js、tsParticles、OGL、GL Transitions、Tone.js、Chatterbox、faster-whisper、Remotion、HyperFrames、FFmpeg 等)里挑最小组合,写成「画面是时间的纯函数」的场景,用本地无头渲染器出 MP4(可带离线合成的音效),并自动写出可复现清单(库版本、字体、文件哈希、引擎版本、命令)。当用户说「做个动效 / motion 短片 / 物理动画 / 3D 动画视频 / 用 three.js 做个视频 / 用这套 motion stack」时使用。MV、知识视频、尺寸图动画走各自专用 skill。只在明确请求时触发,忽略顺带提及。
Install
npx skills add majiayu000/spellbook --skill motion-stack -a claude-code
Installs to .claude/skills/motion-stack/ · Each command fetches the skill straight from GitHub with the open skills CLI.
Byte-identical to the scanned commit, with the repository’s licence and a SOURCE.txt.
Want your agent to suggest skills while you type? See how to use skills from your IDE.
Safety checks on SKILL.md
- Ships scripts we have not reviewedLow
Why 79
aiqbench computes the trust score from public signals. It is not a security audit, so read a skill before you install it.
Similar skills
Closest to this one by what they do and when they are used.
- code-filmmajiayu000/spellbook用纯代码(three.js 离线渲染 + 合成音频)做有故事、有电影质感的动画短片并导出 MP4。当用户想做短片、动画片、宣传片、角色动画、循环视频、片头、产品故事片,或者说“用代码做个视频”“做一个有趣的短片”“帮我设计个小动画”“make a short film / animated video / motion piece with code”时使用,即使没提 three.js。也用于继续修改这类片子。写实真人、实拍感、AI 视频生成、普通视频剪辑不适用。Engineering★ 289
- ruic-motion-reelHRuiCcc/RuiC-motion-reel用代码生成动态图形与动效宣传片成片,时长按需(12 / 15 / 24 / 30 / 45 / 60 秒),默认 1920×1080。两条路线:常规宣传片(HUD / 终端 / 动字 / 玻璃面板 / 粒子)走仓库自带的 remotion/ 模板(React 组件 + 浏览器渲染,60fps 无压力);需要自研渲染独有能力(超采样矢量文字、真 3D 点云、丝网印/riso 四色分色、普朗克真彩色、合成器配乐)走本引擎的 Python 管线。画面与音乐全部由代码产出、不用任何外部美术素材、不用 AE。视觉语言有 16 张牌,默认随机抽一张(轻的、非 3D 的、编辑排版/手绘/纸艺/标本那类一样做),不默认做最炫的那一支。当用户说「用代码做个动效视频/动态图形/motion graphics」「生成一条作品集样片/产品片/宣传短片」「做一条 24 秒/30 秒的品牌片」「按某种风格做视频」「给某个品牌/产品做一条片子」「复刻某条动效片的风格」,或要改已有片子的品牌、配色、节奏、镜头、时长时使用。触发词:动效视频、动态图形、motion graphics、作品集样片、产品片、宣传片、任意时长、24 秒、30 秒、1080p30、1080p60、代码生成视频、ruic-motion-reel。Engineering★ 180
- motion-graphicsJimLiu/baocut给音频视频定制内容背景与标题,或要在视频上加一段动效图形时用:下横栏(姓名职务)、关键词字幕、大数字与图表、标注与引导、品牌贴片与片尾、倒计时与进度。不选模板,按规则写一个自包含的 HTML 画面(时间的纯函数),打包成代码包导入后放上时间线。只加静态文字、贴纸或已有的文字动画预设时不用;声波一律用内置的声波元素,不用本 skill 画;整条成片的规划看「从简报到成片」。Other★ 1.7K
- motion-directorfrankxai/awesome-motion-design-agent-skillsUse when designing motion concepts, animation systems, choreography, timing, easing, reduced-motion behavior, or deciding which motion stack to use for web UI, video, GIF, Rive, Lottie, GSAP, Motion, Remotion, or Three.js work.Design★ 93
- vid-motion-graphicsVarnan-Tech/opendirectoryGenerates motion graphics videos (MP4) from a content brief. Multi-scene HTML/CSS animations rendered frame-by-frame in headless Chromium via Playwright, assembled with FFmpeg. 1080×1080 default, 16:9 (1920×1080) and 9:16 (1080×1920) supported. 5 style presets. Trigger when user says "create a video", "motion graphic", "animated video", "make a reel", "create an explainer", "animated infographic", or "short video".Testing★ 689
- remotion-motion-graphicshaidrrrry/claude-remotion-skillCreate and edit professional motion graphics videos with Remotion (React-based video). Use this skill EVERY time the user wants to create a video, edit a video, animate something, build an intro/outro/logo animation, make a Reel/Short/promo/launch video, add text animations or captions to footage, composite images and B-roll into a video, or mentions Remotion, motion graphics, video rendering, or "make this video look better/less generic". Also trigger when editing an existing Remotion project or when the user complains their video looks basic, generic, or amateur — this skill contains the exact fixes. Always read this skill BEFORE writing any Remotion code.Media★ 797
Ratings & reviews
—
no reviews
Tried this skill? Rate it to help others. Sign in
Discussion
Join the discussion. Sign in