Rohx24

Framewise — Design skill for Claude Code

Design community

Claude Code skills that let coding agents read screen recordings — find what broke, or measure a UI to rebuild it.

How to install Framewise

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Rohx24/Framewise and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Framewise does

Claude Code skills that let coding agents read screen recordings — find what broke, or measure a UI to rebuild it.

Alternatives in Design

  • Doc — Read, create, and edit .docx documents with formatting and layout fidelity 14.6k ★
  • Hn Rewrite — Read {{arg1}} (either a file path or GitHub issue URL) and rewrite it in a technical, matter-of-fact style sui 570 ★
  • Clipify — Claude Code skill: turn long videos into social-ready clips 549 ★

README

Framewise

Two skills that let your coding agent watch a video.

**Turn a screen recording into the story of a bug: what happened, what it led to, and where it broke.**

Framewise reads every frame and gives your coding agent a timestamped sequence of events, so it can trace a bug from the first click to the final failure instead of guessing from one screenshot.

/watch Find what broke in a screen recording, with timestamps.
/replicate Take an interface apart so it can be rebuilt — layouts, plus motion measured frame by frame.

Runs locally. No API key, no upload.

Why

Sampling screenshots every second loses the thing you needed. A screenshot shows a spinner exists; it can't show that it never stopped, which is the bug. Duration is the finding.

Rebuilding has the same problem in reverse. A still frame can't contain motion, so screenshots leave duration, distance and easing to guesswork.

Install

git clone https://github.com/Rohx24/framewise
cd framewise && pip install -r requirements.txt && ./install.sh

Needs Python 3, `ffmpeg` on PATH, `numpy` and `opencv-python`. Installs `/watch` into `~/.claude/skills/watch` and `/replicate` into `~/.claude/skills/replicate`; pass a directory to `./install.sh` to install somewhere else. To update, `git pull && ./install.sh`.

Narration in a recording is transcribed if `openai-whisper` is installed (`pip install openai-whisper`). Without it everything else still runs.

Try it without a recording — the sample is already in the repo, and `examples/expected/` holds the output it should produce:

python3 scripts/analyze.py examples/sample_bug.mp4 -o /tmp/demo --no-audio

/watch

python3 scripts/analyze.py recording.mov -o repro/
flag why
--frames N more or fewer key frames (default 12)
--max-seconds N only analyse the first N seconds of a long recording
--no-audio skip transcription (faster; avoid