ChanMeng666

A11y Loop Promo Film — Productivity skill for Claude Code

Productivity community

The 64-second launch film for a11y-loop, written as code: one HTML file, a simulated agent workflow, and a score played by sampled instruments.

How to install A11y Loop Promo Film

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

What A11y Loop Promo Film does

The 64-second launch film for a11y-loop, written as code: one HTML file, a simulated agent workflow, and a score played by sampled instruments.

Alternatives in Productivity

Launch A Product — Workflow recipe — go from competitive landscape to a fully checklisted launch and press release by chaining 5 1.3k ★
Chief — CLI that wraps Claude Code in a loop 396 ★
Lasso Claude-hooks — Prompt injection defense hooks: scans files, web fetches, and command output in real-time 160 ★

README

a11y-loop · launch film

**A 64-second launch film for [a11y-loop](https://github.com/ChanMeng666/a11y-loop), written as code.**

One HTML file is the whole film: a rebuilt agent window, terminal, keyboard and cursor walk through a11y-loop's full workflow, cut on the beat to a score played by sampled instruments.

https://github.com/user-attachments/assets/117274d5-ca7b-4d12-bd75-aea07845cc07

**Watch on YouTube:** [youtu.be/Qg5QCE_V0Pg](https://youtu.be/Qg5QCE_V0Pg) · **Download:** [release v1.0.0](https://github.com/ChanMeng666/a11y-loop-promo-film/releases/tag/v1.0.0)

What the film shows

The stage tracker at the top of the frame (PLAN · WRITE · AUDIT · FIX · REPORT) carries the viewer through one complete loop:

Time	Scene	What happens on screen
0:00	Hook	Keys press on a simulated keyboard and a prompt types into an agent's composer. The cursor clicks Send.
0:04	Install	`npx skills add`, `npm i -g a11y-loop`, `a11y-loop install-browser` and `a11y-loop doctor` in a terminal, plus the agents the skill runs in.
0:10	Plan	The cursor clicks Approve. The plan gate answers "Plan items answered: 0 of 7". The agent writes an accessibility section and the same card turns green, 7 of 7.
0:18	Write	Markup streams into an editor while the page assembles in a browser. This is the repo's seeded demo page, labelled as such.
0:22	Audit gate	The agent says "Done". A Claude Code Stop hook asks for the audit first.
0:24	Audit	`a11y-loop audit` runs. The browser cycles the five rendering passes (default, dark, forced colors, reduced motion, 320 px reflow) and an open-dialog state, one per beat, while violations pour in to 159. Half a bar of silence follows.
0:32	Fix	On the drop: `a11y-loop contrast --fix` turns `#8fa0ab` (2.69:1) into `#697983` (4.50:1). The re-audit against `demo/after` flips every row to FIXED.
0:38	Converged	`a11y-l