kumarsashank/motiscope — explained in plain English
Analysis updated 2026-05-18
Recreate a web animation you liked by recording it and generating matching GSAP or CSS code.
Rebuild a whole landing page's layout, copy, and animations from a screen-recorded walkthrough.
Extract precise easing curves and timing from an existing animation for reuse in a new design.
Add animation-recreation as a skill to Claude Code, Cursor, or Codex workflows.
| kumarsashank/motiscope | huey1in/claudex | jiaran-king/re-zero---starting-llm- | |
|---|---|---|---|
| Stars | 91 | 91 | 91 |
| Language | Python | Python | Python |
| Setup difficulty | moderate | moderate | easy |
| Complexity | 3/5 | 3/5 | 1/5 |
| Audience | developer | developer | researcher |
Figures from each repo's GitHub metadata at analysis time.
Requires ffmpeg, ffprobe, and Python 3 installed locally to process video recordings.
Motiscope is a tool that takes a screen recording of a web animation and turns it back into working code, such as GSAP, CSS, Framer Motion, or Lottie. It is built as a plugin for Claude Code, and also ships as portable skills that work with other coding agents like Codex and Cursor, or anything that reads an AGENTS.md file. It is written in pure Python using only the standard library plus ffmpeg, and does not require the cloud, npm, or any account signups. The core idea is that a still screenshot has no sense of time, so motiscope focuses specifically on measuring timing precisely: it analyzes the video frame by frame to build a motion-energy curve, then uses ffmpeg's signal analysis tools to work out exact durations, easing curves fitted as real cubic-bezier values, when staggered elements start, and how long a loop takes to repeat. It then hands a curated set of the most meaningful frames to an AI model, which uses its vision capabilities to identify what is actually happening visually, like a fade, slide, scale, or shape morph. The measured timing plus the model's read of the visuals together produce the final animation code. Installing it inside Claude Code is done through the plugin marketplace with two commands. For other coding agents, you clone the repository, run an install script that creates a symlink with no admin rights needed, and then run a command to add the skill to your chosen tool's configuration. It requires ffmpeg, ffprobe, and Python 3 to be available, and includes a doctor command that checks for and can install missing dependencies with your permission. Once set up, the main workflow is dropping a video file into an animations folder in your project, then running an analyze command followed by a recreate command targeting the framework you want. It also includes a command that can rebuild an entire landing page, including layout, text, and animations, from a walkthrough recording of an existing site. The project is MIT licensed.
Motiscope turns a screen recording of a web animation into runnable GSAP, CSS, Framer Motion, or Lottie code by measuring exact timing and handing curated frames to an AI model.
Mainly Python. The stack also includes Python, ffmpeg, Claude Code.
Permissive open-source license, free to use, modify, and distribute including for commercial purposes.
Setup difficulty is rated moderate, with roughly 30min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
double-check against the repo, no cap.