showheyohtaki/motion-prompt

Media & Design

A named catalogue of motion, camera and web-effect moves that lets you describe the look you want to an AI in precise terms.

685
83
JavaScript
MIT
10 days old

A vocabulary aid, not a renderer: you consult it when you can picture a movement but cannot phrase it for a model or a collaborator.

The problem

You want a title to slide in from below, or the camera to push slowly toward a face, and you open a video model or a coding AI. The result comes back close but not right, and you cannot say why. What is missing is the name of the move. The workflow change is small but early: instead of describing the effect in vague adjectives, you look up the term, then use it in the prompt along with duration, strength and what moves. The AI gets a sharper target, and you spend less time re-rolling.

What's different

The library pairs each name with a looping animated sample, a one-line meaning and a sample request. Seven packs of 24 names each cover motion-graphics moves, camera moves, UI components, landing-page effects and photo looks, with two packs apiece for motion and landing pages. That sample-first structure is the main idea: you identify the effect by sight, then copy the phrasing, rather than reading a glossary.

The mechanics are also worth noting. Each element is a single Canvas 2D function whose output depends only on elapsed time, so live preview and frame-by-frame rendering produce the same frames, and there are no external libraries. The skill's small Node script does lookup, search and spec printing, and the README describes a path for porting an element into a video project. The trade-off is scope: this is a reference and prompt aid, not an editor or a generator. The code is starter material you still adapt, and the 168 names are one author's selection rather than a standard taxonomy.

Who should try it

Good fit: a designer or editor who works between creative tools and generative models and keeps failing to articulate a transition; also a developer building landing pages who wants a concrete label for a scroll or reveal effect before writing the CSS. The no-install path matters here — you can open a pack list or the gallery and just read the names, with no Node or agent involved.

Poor fit: someone who wants finished components or polished video clips dropped into a project, or who needs motion for a field outside the five covered areas. Those users would get more from a component library or an actual editing tool.

Requirements and limitations

The optional skill requires Node.js 18 or later plus a compatible agent such as Claude Code or Codex; installing via npx skills add or the plugin marketplace assumes network access, and the README notes that an unreachable data source causes exit code 3. None of that applies to the manual route: copying the skill folder, or simply reading the lists, avoids the installer. On going upkeep, the element code is MIT-licensed for commercial use, but reusing an element means keeping its first-line attribution comment, and the sample frames depend on the pack's shared "kit" helpers.

Two practical boundaries: name lists are currently English and Japanese only, though the repository ships a translation prompt for producing other languages, and the catalogue is actively open to new packs via CONTRIBUTING.md.

HotRepo's take

HotRepo first recorded the repository on 2026-10-24; a 2026-10-25 snapshot of the NEW-REPOSITORY board (新项目榜, not the overall Trending board) shows 685 total stars at #16 in the JavaScript filter. That is a snapshot, not a growth series, and 10 days of age is not enough to judge staying power. Worth a look as a prompt vocabulary if motion phrasing is your bottleneck; before installing, check whether the pack names actually match the effects you keep reaching for.

Written by AI from the project's README, updated October 25, 2026. The project's own docs are the source of truth.