render-search-grid
Render a 'search-grid' (Pinterest search-moodboard) video from a config — a real-DOM page with four continuous beats (masonry search grid + typing hook with counter-drift columns → 3 cards slide in from the right and stack → the top card box-grows to fullscreen then swipe-left ×2 through captioned feature shots → warm end card), frame-stepped via Chromium and encoded with FFmpeg — deterministic assembly, FREE (real brand photos + logo; the optional music bed comes from create-music-elevenlabs), so type/logo/photos stay pixel-crisp. Use for the search-grid format.
npx skills add gooseworks-ai/goose-skills --skill render-search-grid --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# render-search-grid Render the 'search-grid' format from a config. It is a **deterministic** assembler — no generative image/video, no AI-rendered text. Everything on screen is the brand's REAL product/lifestyle photography + logo, so the typed hook, feature captions, wordmark, and photos stay pixel-crisp. The **only** paid input is an optional music bed, produced upstream by `create-music-elevenlabs` and passed to `render.py --music`. ## The format (four beats, one continuous ~18s motion piece, 1080×1920) 1. **Search** (0–5s) — a 3-column masonry grid of the brand's catalog behind a Pinterest search bar; a believable phrase types in letter-by-letter. Side columns drift DOWN, the middle column drifts UP (counter-parallax). 2. **Cards** (5–7s) — 3 room/product cards slide in from the RIGHT and stack over a warm blurred backdrop. 3. **Features** (7–14.5s) — the TOP card **physically expands** (its box grows from the stacked rect to full-screen, animating width/height — NOT `transform:scale`, which would stretch the image), then **swipe-left → swipe-left** through the SAME 3 rooms, each now full-bleed with a caption. The 3 cards ARE the 3 features. 4. **End card** (14.5–18s) — hero +
- The format (four beats, one continuous ~18s motion piece, 1080×1920)
- Scripts (all free / deterministic)
- Config contract (bound by the recipe/orchestrator at remix time)
- Prereqs
What does the render-search-grid skill do?
Render a 'search-grid' (Pinterest search-moodboard) video from a config — a real-DOM page with four continuous beats (masonry search grid + typing hook with counter-drift columns → 3 cards slide in from the right and stack → the top card box-grows to fullscreen then swipe-left ×2 through captioned feature shots → warm end card), frame-stepped via Chromium and encoded with FFmpeg — deterministic assembly, FREE (real brand photos + logo; the optional music bed comes from create-music-elevenlabs), so type/logo/photos stay pixel-crisp. Use for the search-grid format.
How do I install it?
Run `npx skills add gooseworks-ai/goose-skills --skill render-search-grid --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From gooseworks-ai/goose-skills, a repository with 1,091 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.
