Motion Kit
Code-drawn motion graphics, animated videos, explainers of 1-3 minutes with a story, kinetic typography, transitions, editing, Three.js scenes, pixel-art and retro films (fixed palettes, dithering, chiptune, demoscene effects) and browser games with strong game feel. Use when you need to make a good-looking animation, video, explainer, intro, interactive scene or game in HTML/JS and render it to MP4, or to break down a reference video.
Install
npx skills add kiselas/every-frame-is-code --skill motion-kitgit clone --depth 1 https://github.com/kiselas/every-frame-is-code.git /tmp/every-frame-is-code
mkdir -p ~/.claude/skills
cp -r /tmp/every-frame-is-code/. ~/.claude/skills/motion-kitPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# Motion Kit 1. Read `00-agent-brief.md` in full. These rules are mandatory. 2. Read the files for the task: - any video: `01-pipeline.md`, `04-motion-easing.md`, `06-montage.md`, `12-render-qa.md`, `13-performance.md`; - choosing a style: `03-visual-style.md`; - transitions between scenes: `05-transitions.md`; - fire, particles, glow, grain, shaders: `07-effects-cookbook.md`; - titles and animated text: `08-kinetic-typography.md`; - music, sound effects, voice-over: `09-audio-sync.md`; - games: `10-games-juice.md`; - 3D: `11-threejs.md`; - pixel art, retro or fixed-palette looks, Mode 7 floors, dithered transitions, turning any scene into pixel art: `15-pixel-retro.md` and `runtime/pixel.js`, see `examples/pixel/`; - chiptune music and 8-bit sound effects as text (MML): `16-chiptune.md` and `runtime/chip.js`; - demoscene effects (plasma, tunnel, rotozoom, copper bars, metaballs, starfield) as functions of x, y, t: `17-demoscene.md` and `runtime/pixel-fx.js`; - a film longer than ~45 s, an explainer, a story on any topic: `14-long-form.md` and `runtime/README.md`, build on `runtime/film.js`, see `examples/gps/`; - a reference video to learn from: `node render/analyze.mjs ref.mp4 out/`, then read its report and sheets. 3. Show the plan as data first (style, beat grid, shots, events), then write the code. For a long film, the plan is `SCRIPT.md`: thesis, spine, through-line and the shot table (`14-long-form.md`).
Details
- Skill name
motion-kit- Repository
- kiselas/every-frame-is-code
- License
- MIT
- Repo updated
- 1 October 2026
FAQ
What does the Motion Kit skill do?
Code-drawn motion graphics, animated videos, explainers of 1-3 minutes with a story, kinetic typography, transitions, editing, Three.js scenes, pixel-art and retro films (fixed palettes, dithering, chiptune, demoscene effects) and browser games with strong game feel. Use when you need to make a good-looking animation, video, explainer, intro, interactive scene or game in HTML/JS and render it to MP4, or to break down a reference video.
How do I install the Motion Kit skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add kiselas/every-frame-is-code --skill motion-kit. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Motion Kit popular?
It lives in kiselas/every-frame-is-code, which has 17 GitHub stars and 3 forks.
Related skills
Greybox Harness
177ohnson/VLM-Generation-Harness
用 Blender 白模(greybox)给 AI 视频生成做机位、空间和切点的预演层——建房间、摆机位、导出参考视频喂进生成模型的 video 通道,再用规范化的 prompt 补齐表演与材质。当任务涉及「白模/greybox/previs/分镜预演」、要让同一场景的多个镜头保持空间一致、要精确控制硬切时刻、或要在花钱出片之前先验证机位和遮挡时使用。
Teable Assistant Ops
16teableio/agent-skills
Operate Teable projects — tables, fields, views, records, SQL queries, automations, headless routines, apps, image generation, and web scraping. Trigger when user mentions Cuppy, Teable, teable CLI, or Teable-style IDs (bseXXX, tblXXX, fldXXX, recXXX, viwXXX), or wants to manage tables/fields/records, build dashboards/apps, generate images or charts, create automations, import/export data, trigger AI fill, or scrape websites (LinkedIn, Amazon, YouTube, etc.) — even if they don't explicitly say "Teable" but are clearly working with a Teable project (called base in the API).
Taxue Creative Style
17taxueseek/taxue-creative-style
踏雪影像风格引擎。四种能力:①按开放风格库出图(笔意水墨、留白海报、城市建筑、治愈插画、东方古典、氛围实验、写实摄影、概念海报、照片转艺术,以及独立语法:剪纸纸艺、皮影偶戏、釉面器物、纸本档案、美术片媒介;金融隐喻走 F8-V8 或纪念碑参考模板)②优化任意已有提示词(七维诊断打分+修复+注入踏雪DNA)③元提示词创作(任意需求从零构建精确提示词,按主题路由到独立语法,不锁死在 9 个家族)④学习用户偏好。子技能路由:个人 IP 插画、民国漫画杂志、面向领导生图、图片反推、节气档案全书、正宗艺术门类(见正文 §0)。触发:踏雪风格、taxue style、签名风格、文人水墨、上美影、剪纸、染色剪纸、窗花、皮影、木偶、青花瓷、年画、折纸、赛璐璐、纸本档案、节气海报、纸雕、水墨城市、概念海报、踏雪寻仙、层叠城市、3D书法、金石印象、篆刻、器物禅意、赛博东方、提示词优化、帮我写提示词、元提示词、出图、生成图片、帮我画、人物锁定卡、陶瓷素材图、中式纹样素材、错视、破框、物件拼脸、空间缝合、图底互生、凹凸、钢印、按压、压印。
Reference Led Ugc Product Video
18TuolaGe/reference-led-ugc-product-video
制作、返工或创意验收以参考视频的注意力节奏、证据顺序和镜头功能为骨架的 9:16 UGC 商品视频或 Fashion Reels。适用于包含人物表现、穿搭/上脚、精确商品多角度或多类动态证据的复杂任务,也适用于诊断成片不像参考、商品生成变形、人物站桩、静态广告感或嘴型表情过大的问题。不用于单镜头 talking head、简单字幕/转码、普通拼接或无需参考节奏重建的简单单一 B-roll。
Bumblebee
20solyanviktor-star/Bumblebee
Surgical phrase splicing from real movies and TV shows via yarn.co. Takes any English phrase and slices it into the longest possible runs of words actually spoken on screen, then assembles a final reel where every word is delivered by a real actor. Triggers — "splice a line from movies", "make a fragmovie", "build a video from someone else's words", "bumblebee". Runs fully local with faster-whisper — no API keys. Mix mode (--variants N) generates several distinct cuts of one phrase without reusing clips.
Whiteboard Video
19Matteoikarieth96/whiteboard-video-skill
Make hand-drawn whiteboard explainer videos (animated marker drawings, voice-over, burned-in captions, MP4) on any topic. Use this whenever the user wants an explainer video, a whiteboard or "drawn" animation, an animated explainer for a talk, a short video for X/LinkedIn/YouTube that explains a concept, or asks to turn a script, article, slide deck or topic into a narrated video, even if they don't say "whiteboard". It interviews the user for context, writes and fact-checks a scene-by-scene script for approval, offers voice-over options with audio samples (free macOS voices, ElevenLabs, OpenA
Browse the most popular Claude skills, all images, video & audio skills, or write your own with the skills generator.