Agent-Skills.md

Agent Skills: Motion Assets

Use when a film needs product visuals — capturing real screenshots at a fixed DPR, the real OS pointer, masking sensitive data with labeled example data, avoiding third-party brand look-alikes, and recording provenance in .motion/assets.json.

UncategorizedID: fusengine/agents/motion-assets

Repository

fusengine/agents
FusengineLicense: MIT
345

Install this agent skill to your local

pnpm dlx add-skill https://github.com/Fusengine/claude-plugins/tree/HEAD/plugins/motion-expert/skills/motion-assets

Skill Files

Browse the full folder contents for motion-assets.

Download Skill

Loading file tree…

plugins/motion-expert/skills/motion-assets/SKILL.md

Skill Metadata

Name
motion-assets
Description
"Use when a film needs product visuals — capturing real screenshots at a fixed DPR, the real OS pointer, masking sensitive data with labeled example data, avoiding third-party brand look-alikes, and recording provenance in .motion/assets.json."
<objective> Stage 3 of the `motion-method` pipeline: every product visual in a film is a real capture of the real product, taken at a fixed device pixel ratio, with sensitive data masked before capture and an "Example data" label wherever placeholder data replaces real values. Each asset is recorded in `.motion/assets.json` with its source URL, capture settings, masking applied, and sha256, so the critic's truth-safety criterion can be checked against a file rather than a promise.

It does not draw UI. A screen the product does not have is "invented UI" — a hard-fail in motion-review. </objective>

Motion Assets

Agent Workflow (MANDATORY)

| Step | Who / Tool | What | |------|-----------|------| | Before capturing | read fuse-ai-pilot:fuse-browser-usage | Tool routing and batching rules for mcp__fuse-browser__* | | Capture N screens | browser_shots_batch (one call, N URLs) | Real screenshots — never a per-URL loop | | DPR must be pinned | CDP Emulation.setDeviceMetricsOverride (deviceScaleFactor) | Same approach as docs/demo/statusline-mod/motion-capture.js | | After capture | write .motion/assets.json, run the check script | Provenance + hash | | Draft review | motion-critic via motion-review | Truth-safety criterion uses assets.json |

Overview

| Concern | Rule | Reference | |---------|------|-----------| | Real screenshots | Captured from the running product, fixed DPR, fixed viewport | real-screenshots.md | | Pointer & brands | Real OS pointer (hotspot, scaled with camera); no third-party brand look-alikes | pointer-and-brands.md | | Masking | Replace sensitive values before capture; label "Example data" | data-masking.md | | Provenance | Every asset in .motion/assets.json with source, settings, masking, sha256 | provenance.md |

Critical Rules

  1. Real screenshots only — no redrawn, mocked, or generated UI standing in for the product.
  2. Fixed DPR and viewport per film — mixed DPRs give mismatched sharpness between beats.
  3. Mask before capture, not after — replace values in the page; blur and pixelation are not masking.
  4. Label placeholder data "Example data" — on screen, wherever real values were replaced.
  5. Sensitive-data list comes from the brief — plus the user-level banned list; never write literal sensitive values into the repo.
  6. No asset without a provenance entry — an unlisted file in the scene is treated as invented.
  7. Never client names, never real spend amounts — in assets, labels, filenames, or examples.
  8. Real OS pointer, never a drawn arrow — hotspot respected, scaled with the camera, recorded as kind: pointer.
  9. No third-party brand look-alikes — another company's signature color, logo, or app chrome is a trademark risk; use the owner's brand or neutral placeholders.

Architecture

<project>/.motion/
├── brief.md            # sensitive-data list (categories)
├── assets/
│   ├── raw/            # NOT committed — pre-mask captures, if any were needed
│   └── <name>@<dpr>x.png  # masked, labeled captures used by the scene
└── assets.json         # provenance (template: assets-json.md)

Reference Guide

Concepts

| Topic | Reference | When to Consult | |-------|-----------|-----------------| | Real screenshots | real-screenshots.md | Capturing product screens; DPR, viewport, state setup | | Pointer & brands | pointer-and-brands.md | A beat shows a cursor; anything borrowed from another company | | Data masking | data-masking.md | Anything from the sensitive-data list could appear | | Provenance | provenance.md | Recording and checking where each asset came from |

Templates

| Template | When to Use | |----------|-------------| | assets-json.md | Writing .motion/assets.json and its check script |

Best Practices

DO

  • Seed the product with neutral example data before capturing — it removes most masking work.
  • Capture all screens of one film in one batch, same DPR, same theme.
  • Crop/zoom real captures for legibility instead of redrawing them.
  • Re-hash and re-check after any edit to an asset.

DON'T

  • Recreate a screen in HTML because capture was inconvenient.
  • Blur a customer name and call it masked.
  • Commit pre-mask captures.
  • Reuse an asset from another film without its own provenance entry.
  • Keep a template's borrowed accent hex or "default logo" from another brand.