Individual skill
motion-ad
Produce a short motion-graphics video ad — a 15s Facebook/Instagram/TikTok spot — as a rendered MP4. Researches the destination landing page so every on-screen claim matches it, pulls real product imagery off the live site, animates one paused GSAP timeline in a single HTML page, and renders it frame-accurately through Playwright and ffmpeg. Use this whenever the user wants a video ad, promo video, animated ad, "an ad for my product", Meta/TikTok/Reels creative in video form, a 9:16 or 1:1 cut of an existing spot, or a re-render of an earlier ad with a different hook, hero or CTA — including when they never say the words "motion graphics". Not for animating UI inside an app, not for static image ads, and not for long-form or voiceover-led video.
skills/motion-ad/SKILL.md
Source commit ec4099f92fdeadcf1771c2a3f64efa4970733c89
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- No
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Not checked yet
- Last checked
- Nov 5, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 133
- Repository last updated
- Nov 1, 2026
- License
- Apache-2.0
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- agentic-ai Repository topic
- agentic-skills Repository topic
- skills Repository topic
- steering Repository topic
- claude-code Repository topic
- claude-skills Repository topic
- codex Repository topic
- codex-skill Repository topic
- codex-skills Repository topic
- hermes-agent Repository topic
- design Derived category
- testing Derived category
- testing-browser Derived category
- design-interface Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
SKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesSKILL.mdcore · 16,425 bytesassets/template.htmlasset · 27,314 bytesreferences/template-map.mddoc · 18,384 bytesscripts/.gitignoreruns · 14 bytesscripts/contact-sheet.pyruns · 1,936 bytesscripts/fetch-images.cjsruns · 2,841 bytesscripts/package-lock.jsonasset · 1,036 bytesscripts/package.jsonruns · 291 bytesscripts/render.cjsruns · 2,667 bytes
Read excerpt
# Motion Ad
Builds a sound-off-friendly ad as one HTML page driven by a paused GSAP timeline, then
renders it frame by frame into an H.264 MP4. Every frame is produced by seeking the
timeline, not by recording playback, so the output is deterministic and re-renders
identically.
`assets/template.html` is a finished 15s 4:5 ad, not a blank scaffold: hook + phone →
before/after scan reveal → 3D wall of outputs → showcase carousel + social proof →
brand-color CTA end card. All brand and product content lives in one `CONFIG` object
at the top of its script. **Start from that CONFIG and rewrite the beats** — building a
timeline from zero is slower and produces a worse spot.
**Read `references/template-map.md` before your first edit of `index.html`.** It maps