# ruler-progress-render

Clones ruler-progress-animator and renders a ruler progress animation video using Remotion presets. Helps generate transparent motion assets directly from the terminal.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 958 installs · ★ 1395
- Author: vibe-motion
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/vibe-motion/skills/tree/HEAD/ruler-progress-render/SKILL.md
- Updated: 2026-10-05
- HTML: https://affpapa.org/en/nevibecode/skills/ruler-progress-render

## What it does

The skill invokes `scripts/render_ruler_progress.sh` with workspace directory and output target arguments. If `workspace_dir/ruler-progress-animator` is not detected locally, it fetches the repository from GitHub and tracks `origin/HEAD`. Output defaults to `out/scaffold-demo-defaults-transparent.mov`.

Package dependencies are installed using npm. When `bunx` is installed, the runner triggers the scaffold flow, reusing the shared Chrome Headless Shell cache to prevent repeated downloads. In environments without `bunx`, it falls back directly to `npx remotion render`.

Network access, `git`, `node`, and `npm` are required environment prerequisites. If any of these command-line tools are missing, the execution fails during repository preparation.

## Requirements
- Works with: GitHub

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add vibe-motion/skills --skill ruler-progress-render -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/ruler-progress-render/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/ruler-progress-render/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add vibe-motion/skills --skill ruler-progress-render -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/ruler-progress-render/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add vibe-motion/skills --skill ruler-progress-render -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/ruler-progress-render/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install vibe-motion/skills ruler-progress-render
```

2. **Manually: put the files in place**
- File: `.github/skills/ruler-progress-render/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add vibe-motion/skills --skill ruler-progress-render -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/vibe-motion/skills --path ruler-progress-render
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/ruler-progress-render/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add vibe-motion/skills --skill ruler-progress-render -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/vibe-motion/skills/tree/HEAD/ruler-progress-render/SKILL.md

## When to use it
- render a transparent ruler progress animation video
- clone or update the ruler-progress-animator repository
- export the default motion demo without manual Remotion setup
- reuse Chrome Headless Shell cache across video renders

## Example prompts
- Render a ruler progress video to out/demo.mov
- Export the default ruler progress animation
- Clone ruler-progress-animator and generate the demo video

## Similar
- [remotion-render](https://affpapa.org/en/nevibecode/skills/remotion-render.md) — skill · 3 installs
- [scroll-progress-timeline](https://affpapa.org/en/nevibecode/skills/scroll-progress-timeline.md) — skill · 1400 installs
- [remotion-video](https://affpapa.org/en/nevibecode/skills/remotion-video.md) — skill · 2600 installs
- [remotion-markup](https://affpapa.org/en/nevibecode/skills/remotion-dev-remotion-markup.md) — skill · 207700 installs
- [cinetic](https://affpapa.org/en/nevibecode/skills/cinetic.md) — skill · 1000 installs
- [remotion-video-toolkit](https://affpapa.org/en/nevibecode/skills/remotion-video-toolkit.md) — skill · 779 installs

From the same set: [vibe-motion/skills](https://affpapa.org/en/nevibecode/by/vibe-motion/skills.md) — 7 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md