agentleFS
Sign inStart free
harshil-1411harshil-1411/claude_plugin_video_studio/skills/demo/SKILL.md

demo

Skill0 starsChanged 48 days agoApache-2.0View on GitHub

Record a product demo of the user's own running app (a URL they started, e.g. http://localhost:3000) with a scripted browser walk - clicks, typing, scrolling, zooms - with inputs blurred, then use the recording in screen_capture scenes. Use when the user runs /video-studio:demo, or wants a product-demo or product-ui reel that shows their real app.

26 other projects use a version of this.

Adopted by

Most recently taken up by

Used with

Projects with it also use spec, implement and 2 more.

Other files people use alongside this one.

Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
  • SentrySkill

    spec

    Produce a verified spec — problem, desired outcome, and acceptance criteria — before building. Use when given a GitHub/Linear issue link, when starting from a fuzzy in-conversation idea, or asked to "figure out what to do" / "scope this" / "what should I build" — whenever the *what* isn't yet pinned down. Grills the ambiguities, checks the premise against the code, and produces acceptance criteria you sign off on — then hands to design-first.

    Also in 4 projects that use this

  • Hugging FaceSkill

    implement

    Make tests pass. Invoke after /write-tests produces failing tests.

    Also in 4 projects that use this

  • AWSSkill

    ship

    Finalize dev work on an issue branch — update docs, push, and open a PR.

    Also in 3 projects that use this

  • NVIDIASkill

    research

    Before designing a feature, research how comparable libraries solve the problem, check best practices, known pitfalls, and upstream changes. Use when starting a new feature, investigating an unfamiliar area, or the user asks to research something.

    Also in 3 projects that use this

The file

We split this skill into the rules it gives an agent

4 rules. 0 are common, 1 is distinctive, and 3 are very specific to this project.

  • 0

    Common

    Most of the 24 edited versions we read keep these.

  • 1

    Distinctive

    This author's own choices. Worth a look.

  • 3

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Distinctive:

    Ask for the URL of the running app (and which flow to show) if the user did not say.

    line 13
  2. Very specific:

    Write project/demo.json (schema_get demo-script): id, url, viewport (1080×1920 for a vertical reel: the page lays out at phone width, 390 …

    line 15
  3. Very specific:

    Never pass confirm: true without that yes, and never record a URL that is not the user's own running app.

    line 30
  4. Very specific:

    If it fails: a missing selector → fix the step.

    line 32

“Common” is measured: kept by at least 6 in 10 of the 24 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Record a demo of the user's app

The plugin never starts an app. The user starts it and gives you the URL.

  1. Ask for the URL of the running app (and which flow to show) if the user did not say. Never guess a URL; never record a site the user did not name.
  2. Write project/demo.json (schema_get demo-script): id, url, viewport (1080×1920 for a vertical reel: the page lays out at phone width, 390 CSS px, and records at full resolution; 1920×1080 for a desktop layout; set device_scale_factor only to override), and steps using stable selectors (ids, data-testid, roles). Keep it short: one flow, 5–15 steps, max_duration_sec ≤ 60. Add mask_selectors for anything sensitive on screen (API keys, emails, account names); inputs are always blurred. Use dummy data for anything typed.
  3. Show the user the URL, the steps and the masked selectors. Then call demo {project_dir}: when the client supports approval dialogs, the engine shows the user the URL and steps itself and records their answer in project/consent.json (an unchanged script is not asked again). A REFUSED result with asked_user: true means they declined: stop. With consent_required: true (no dialog available), ask the user to confirm in chat and only after a clear yes call demo {project_dir, confirm: true}. Never pass confirm: true without that yes, and never record a URL that is not the user's own running app.
  4. If it fails: a missing selector → fix the step; no puppeteer-core → the HyperFrames install from doctor; no Chrome → install Google Chrome.
  5. Report the recording and its step timestamps. In the plan, use screen_capture scenes with footage: {asset: "demo-<id>", in_sec, out_sec} spanning the steps they show, and cite those steps' refs (video:demo-<id>.mp4#step-N) in claim_refs. Scenes may only show what was recorded ("actual UI only"): never describe screens that are not in the recording.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free