Agent skill

Render Mosaic Grid Reveal

by gooseworks-ai in gooseworks-ai/goose-skills

Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears…

MITAuto-check passedMedia & Creative

Install Render Mosaic Grid Reveal

skills CLI
$ npx skills add gooseworks-ai/goose-skills --skill render-mosaic-grid-reveal -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install gooseworks-ai/goose-skills render-mosaic-grid-reveal --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/gooseworks-ai/goose-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/ads/capabilities/render-mosaic-grid-reveal .claude/skills/render-mosaic-grid-reveal && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
render-mosaic-grid-reveal
GitHub stars
1.2k
Token cost
~1.1k tokens
SKILL.md length
516 words
Files
7 (incl. scripts)
Skills in repo
273
Repo updated
First seen
Licence
MIT

At a glance

Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears…

  • The mosaic-grid-reveal format
  • SKILL.md covers Inputs (config.json), Choices, Run and Rules
  • Runs Python and JavaScript scripts from its folder; calls python3 and ffmpeg
  • Tasks that involve Logo and visual identity

What it does

Render Mosaic Grid Reveal is an agent skill from gooseworks-ai/goose-skills. Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears, then the brand wordmark builds line-by-line followed by a sub-label, tagline, and CTA; frame-stepped via Playwright and encoded with FFmpeg — deterministic assembly, FREE (the music bed comes from create-music-elevenlabs), so the wordmark, tile captions, and CTA stay pixel-crisp. Use for the mosaic-grid-reveal format.

Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 8 other files, including scripts (for example `scripts/_shared.js`, `scripts/build_html.py` and `scripts/config.example.json`).

It sits in Media & Creative, covering Logo and visual identity, Positioning and messaging and Video production. It works with ElevenLabs, FFmpeg and Playwright. The repository describes itself as: Library of Growth & GTM skills + data APIs for Claude Code, Codex, Cursor to run ads, social, content, lead gen, seo and data scraping. The licence is MIT.

When your agent uses it

  • The mosaic-grid-reveal format
  • Tasks that involve Logo and visual identity
  • Tasks that involve Positioning and messaging

Example prompts

  • “mosaic-grid-reveal”
  • “/render-mosaic-grid-reveal”

Requirements

  • Python 3
  • Node.js

What it can do on your machine

Read from SKILL.md and the folder at commit c650c6d. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 4 files in scripts/ (Python and JavaScript), which the agent can run.

    Shell commands in SKILL.md call:

    • python3
    • ffmpeg

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Render Mosaic Grid Reveal loads about 1.1k tokens when it runs. Until then it costs about 136 tokens; SKILL.md has 516 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~136
When it runs · the whole SKILL.md, loaded when a task matches
~1.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from gooseworks-ai/goose-skills at commit c650c6d, republished under its MIT licence (© gooseworks-ai). 516 words, ~1,130 tokens.

Download SKILL.mdSave it as .claude/skills/render-mosaic-grid-reveal/SKILL.md (or your agent's skills folder). This skill also uses 6 other files; get the full folder from GitHub.
name
render-mosaic-grid-reveal
description
Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears, then the brand wordmark builds line-by-line followed by a sub-label, tagline, and CTA; frame-stepped via Playwright and encoded with FFmpeg — deterministic assembly, FREE (the music bed comes from create-music-elevenlabs), so the wordmark, tile captions, and CTA stay pixel-crisp. Use for the mosaic-grid-reveal format.
status
active

render-mosaic-grid-reveal

Render the mosaic-grid-reveal format from a config. The signature of this format is a full-bleed N×N mosaic (default 3×3) of the brand's real product stills that pops in one tile at a time (scatter order, ease-out-back "pop"), building the whole grid; the grid then clears (scale-up + fade) and a clean end card builds line-by-line — the brand's real wordmark, then a small sub-label, then the tagline, then a CTA. Silent by design (a light music bed is muxed separately via create-music-elevenlabs). The hook is RANGE — nine maximally-distinct variants show how much choice the brand offers.

Everything is a real-DOM HTML scene frame-stepped to PNG via Playwright and encoded with FFmpeg, so the wordmark, tile captions, and CTA stay pixel-crisp (a video model would smear them). No generative video, no i2v, no AI-rendered text. This capability is FREE and deterministic — the only paid step of the format (the music bed) is a separate media cap.

Inputs (config.json)

  • width, height, fps — canvas + frame rate (default 1080×1920, 30).
  • wordmark — brand logo SVG (full <svg> or bare <path> markup) or PNG path. Real DOM, recolored via palette.ink. Never AI-render it. wordmark_viewbox, wordmark_width tune it.
  • palette — bg (page colour; the demo used a warm off-white), accent + accent_deep (brand color), ink, cap.
  • grid — cols/rows (default 3×3), inset (outer margin), gap.
  • tiles — one per cell (length must equal cols*rows): image (real variant still), name (caption), bg (tile colour, from choices.tile_look — the demo used a soft pastel echoing each variant), ink (deep caption color).
  • pop_order — scatter order across cells (default corners → center → edges).
  • timing — grid_in0, cadence, pop, hold, clear (seconds).
  • end_card — sub, tagline_top, tagline_bottom (bold), cta, url. Brand's own approved copy only.
  • eyebrow — optional top kicker held during the grid.

scripts/config.example.json is a filled example (the Pair Eyewear "RANGE" worked example); the tile image/wordmark paths are brand inputs bound by the orchestrator at remix time. Its tiles, tile colours, end-card copy and music prompt are Pair's answers, not defaults.

Show full SKILL.md (195 more words)Show less

Choices

The recipe asks the user these before any paid step; the renderer draws whatever the config says.

  • range — which 9 products/variants fill the grid → tiles[].image, tiles[].name. Asked of the user; the demo used 9 eyewear colourways.
  • tile_look — tile backgrounds → tiles[].bg, tiles[].ink, palette.bg. Asked of the user; the demo used a soft pastel per variant.
  • music — the bed's genre/mood → music.prompt (consumed by create-music-elevenlabs). Asked of the user; the demo used light upbeat marimba.

Run

bash
python3 scripts/build_html.py --config config.json --out hyperframe.html   # emits scene, writes duration_sec back
python3 scripts/render.py --config config.json --html hyperframe.html --out master-silent.mp4

build_html.py computes the full timeline and writes duration_sec back into the config so render.py (which reads dims/fps/duration from the config) frame-steps window.renderAt(t) at fps and FFmpeg-encodes the silent master. Then mux the create-music-elevenlabs bed: ffmpeg -i master-silent.mp4 -i bed.wav -map 0:v:0 -map 1:a:0 -c:v copy -c:a aac -shortest out.mp4.

Rules

  • FILL the frame — tiles are full-bleed and edge-to-edge, NOT small cards floating in an empty margin. Tiles pop in one at a time (scatter order), never all-at-once or static.
  • Real wordmark + real product stills only. Never AI-render the logo or text.
  • Copy slots are the brand's own approved lines — never invent claims, customers, results, prices, or shipping speed.
  • Pick the 9 most DISTINCT variants (color-wheel spread) — that IS the RANGE hook.

© gooseworks-ai, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 6 other files (scripts) in skills/ads/capabilities/render-mosaic-grid-reveal of gooseworks-ai/goose-skills.

  • SKILL.md
  • scripts/_shared.js
  • scripts/build_html.py
  • scripts/config.example.json
  • scripts/render.py
  • skill.meta.json
  • tests/smoke-test.md

Open the folder on GitHubat commit c650c6d

Compare with similar skills

Render Mosaic Grid Reveal next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Render Mosaic Grid Reveal compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Render Mosaic Grid Reveal this skillgooseworks-ai/goose-skills1.2k—~1.1kAutomated safety check: PassMIT
Whiteboard Videotrustfuture/simon-skills382—~1.8kAutomated safety check: NotesMIT
Motion Adfabricioctelles/skills106—~4.1kAutomated safety check: PassApache-2.0
Whiteboard Video Factorywwwzhouhui/skills_collection283—~4.9kAutomated safety check: NotesNone
Explain Videolimin112/min-skill454—~2.4kAutomated safety check: PassNone
Video Productionspeechlab0210/video-production-skill105—~4.1kAutomated safety check: NotesMIT

Similar skills

  • Whiteboard Video

    trustfuture/simon-skills

    手绘白板风"边画边讲"讲解视频出片 skill(Excalidraw 风格逐笔动画 + 火山引擎配音 + 烧录字幕 + 品牌水印与片尾卡 + 横竖两张封面 + 各平台发布文案)。当用户说"做一期白板视频 / 边画边讲 / 手绘讲解视频 / 用 excalidraw 做视频 / whiteboard video",或要在本仓库里新建一期、改场景、换贴纸或真实…

    382 GitHub stars~1.8k tokensUpdated 17 days ago
    Media & CreativeAuto-check: notes
  • Motion Ad

    fabricioctelles/skills

    Produce a short motion-graphics video ad — a 15s Facebook/Instagram/TikTok spot — as a rendered MP4.

    106 GitHub stars~4.1k tokensUpdated today
    Media & CreativeAuto-check passed
  • Whiteboard Video Factory

    wwwzhouhui/skills_collection

    手绘白板风"边画边讲"讲解视频出片 skill(Excalidraw 逐笔动画 + 火山/小米/edge-tts 配音 + 烧录字幕并逐段跟读高亮 + 品牌水印与片尾卡 + 三张封面 4:3 / 3:4 / 9:16 + 各平台发布文案:视频号 / 小红书 / 抖音 / B 站 /…

    283 GitHub stars~4.9k tokensUpdated 5 days ago
    Media & CreativeAuto-check: notes
  • Explain Video

    limin112/min-skill

    Build a narrated explainer video from a concept — discussion → structure → HTML slide deck → narration script → TTS voice → subtitles → background music → Playwright screen recording → ffmpeg…

    454 GitHub stars~2.4k tokensUpdated 2 days ago
    Media & CreativeAuto-check passed
  • Video Production

    speechlab0210/video-production-skill

    AI educational video production pipeline. An agent skill from speechlab0210/video-production-skill.

    105 GitHub stars~4.1k tokensUpdated 3 mo ago
    Media & CreativeAuto-check: notes
  • Super Video Maker

    Bomx/super-video-maker-skill

    End-to-end AI video production skill for agentic frameworks.

    310 GitHub stars~11k tokensUpdated 2 mo ago
    Media & CreativeAuto-check: notes

More from gooseworks-ai/goose-skills

All 273 skills in this repo
  • Reddit Post Finder

    gooseworks-ai/goose-skills

    Scrape and search Reddit posts using Apify. An agent skill from gooseworks-ai/goose-skills.

    1.2k GitHub starsUsed in 1 repo~1.2k tokens
    Auto-check passed
  • Create Image Fal

    gooseworks-ai/goose-skills

    Generate or edit an image via any FAL image model (nano-banana edit, gpt-image, flux, ...), ROUTED THROUGH THE fal-proxy so it bills the Ads agent.

    1.2k GitHub stars~1.3k tokensUpdated today
    Auto-check passed
  • Render Hook Replacement

    gooseworks-ai/goose-skills

    Replace an existing video's opening with a supplied clip or free kinetic text hook while retaining and verifying every original body frame, audio, captions and ending.

    1.2k GitHub stars~2.3k tokensUpdated today
    Auto-check passed
  • Blog Feed Monitor

    gooseworks-ai/goose-skills

    Scrape blog posts via RSS feeds (free, no API key) with Apify fallback for JS-heavy sites.

    1.2k GitHub starsUsed in 1 repo~578 tokens
    Auto-check passed
  • Competitor Post Engagers

    gooseworks-ai/goose-skills

    Find leads by scraping engagers from a competitor's top LinkedIn posts.

    1.2k GitHub starsUsed in 1 repo~1.8k tokens
    Auto-check: notes
  • Render Chatgpt Chat

    gooseworks-ai/goose-skills

    Assemble a ChatGPT chat-reveal video ad from a thread + timeline JSON — one continuous Playwright recording of a ChatGPT mobile chat (user types with the iOS keyboard up → taps send → keyboard…

    1.2k GitHub stars~2.3k tokensUpdated today
    Auto-check passed

Questions about Render Mosaic Grid Reveal

What does Render Mosaic Grid Reveal do?

Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears…. Render Mosaic Grid Reveal is an agent skill from gooseworks-ai/goose-skills. Render a 'mosaic-grid-reveal' video from a config — a real-DOM FULL-BLEED N×N mosaic of real product tiles that pops in one tile at a time (scatter order, ease-out-back overshoot), the grid clears, then the brand wordmark builds line-by-line followed by a sub-label, tagline, and CTA; frame-stepped via Playwright and encoded with FFmpeg — deterministic assembly, FREE (the music bed comes from create-music-elevenlabs), so the wordmark, tile captions, and CTA stay pixel-crisp.

When should I use Render Mosaic Grid Reveal?

Render Mosaic Grid Reveal fits situations like: the mosaic-grid-reveal format; tasks that involve Logo and visual identity; tasks that involve Positioning and messaging.

How do I install Render Mosaic Grid Reveal in Claude Code?

Run `npx skills add gooseworks-ai/goose-skills --skill render-mosaic-grid-reveal -a claude-code`. Or copy the skill folder (skills/ads/capabilities/render-mosaic-grid-reveal in gooseworks-ai/goose-skills) into .claude/skills/render-mosaic-grid-reveal in your project. Claude Code loads it when a task matches its description.

How do I install Render Mosaic Grid Reveal in Codex?

Run `npx skills add gooseworks-ai/goose-skills --skill render-mosaic-grid-reveal -a codex`. Or copy the skill folder (skills/ads/capabilities/render-mosaic-grid-reveal in gooseworks-ai/goose-skills) into .agents/skills/render-mosaic-grid-reveal in your project. Codex loads it when a task matches its description.

Can I use Render Mosaic Grid Reveal in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add gooseworks-ai/goose-skills --skill render-mosaic-grid-reveal -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/render-mosaic-grid-reveal, .gemini/skills/render-mosaic-grid-reveal, .github/skills/render-mosaic-grid-reveal and .opencode/skills/render-mosaic-grid-reveal in your project.

What does Render Mosaic Grid Reveal need to run?

Going by SKILL.md and its folder, Render Mosaic Grid Reveal needs Python and JavaScript for the scripts in its folder and the command-line tools its instructions call (python3 and ffmpeg). Our summary lists: Python 3; Node.js.

Does Render Mosaic Grid Reveal access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Render Mosaic Grid Reveal safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Render Mosaic Grid Reveal use?

Render Mosaic Grid Reveal is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Render Mosaic Grid Reveal use?

About 1.1k tokens (SKILL.md is roughly 4.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Render Mosaic Grid Reveal?

Skills that share tags, products or a category with Render Mosaic Grid Reveal: Whiteboard Video (trustfuture/simon-skills, 382 stars), Motion Ad (fabricioctelles/skills, 106 stars), Whiteboard Video Factory (wwwzhouhui/skills_collection, 283 stars) and Explain Video (limin112/min-skill, 454 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Render Mosaic Grid Reveal?

gooseworks-ai (a GitHub organization) maintains it in gooseworks-ai/goose-skills, which has 1,240 GitHub stars. The repository holds 273 skills in this directory. The repository was last updated on October 8, 2026.

Source: gooseworks-ai/goose-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.