Skip to content
cccskills
FreePublished on GitHub

render-photo-grid-card

Render a 'photo-grid promo card' video from a config — a real-DOM card with a FIXED header/footer and a CONTINUOUSLY SCROLLING 2-row grid of MIXED tiles (video clips, product/lifestyle stills, big-serif %-OFF, dark promo-code or CTA) + feature chips, frame-stepped via Playwright with real-time <video> playback and encoded with FFmpeg — deterministic assembly, FREE (the clips + music come from create-video-fal + create-music-elevenlabs), text stays pixel-crisp. Use for the photo-grid-promo-card format.

The English summary is being prepared. Showing the original description.

Run score Not tested

See how to install

Files included (6)

  • SKILL.md2.6 KB
  • scripts/_shared.js950 B
  • scripts/build_card.py10.7 KB
  • scripts/render.py4.6 KB
  • skill.meta.json343 B
  • tests/smoke-test.md641 B

SKILL.md (original)

Review the instructions the agent will receive before you install.

render-photo-grid-card

Render the 'photo-grid promo card' format from a config. The signature of this format is a continuously scrolling 2-row grid (NOT a static card) under a fixed header (brand wordmark + big headline + sub) and fixed feature chips. The grid-viewport scrolls left across the whole ~10s, edge-faded with a CSS mask, and its tiles are mixed media: video clips playing inside tiles, band-product/photo stills, big-serif pct/off type tiles, and a dark code (promo code) or cta tile.

The renderer itself is FREE/deterministic (Playwright frame-step + FFmpeg). The paid inputs are separate capabilities: the tile clips come from create-video-fal (i2v of the product heroes, or clips extracted from the brand's own ad corpus) and the music from create-music-elevenlabs. Text (wordmark, %, code) is real DOM — never AI-rendered.

Run

build_card.py --config config.json --out hyperframe.html ; render.py --config config.json --html hyperframe.html --out master-silent.mp4 — 1080x1920, scrolling grid, deterministic, $0.

Clip tiles are driven by FRAME-SWAP, not <video>: render.py pre-extracts each clip to PNG frames with ffmpeg, preloads them, and swaps each <img class="vidframe">'s src per output frame. This is because Playwright's bundled Chromium can't decode <video> H.264 over file:// (open-source build, no proprietary codecs) — it hangs on canplay. Letting ffmpeg decode makes it codec-independent AND deterministic. Provide clips longer than the master (or the swap just loops them); a subtle setpts-slow reads as cinematic.

Contract

  • Deterministic + FREE (Playwright frame-step + FFmpeg); no paid calls in this capability.
  • Tiles-per-row = grid columns (cols), NOT total tiles; the grid fills row-major.
  • The template recipe (DB) supplies the config; clips + music are separate capabilities.
  • palette is a brand fact — pass the brand kit's colors; build_card.py only falls back to neutral greys. The occasion copy, clip moments and music feel are the recipe's user choices, never defaulted.

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Research supported advertising promises from a specific buyer's context, current product facts, customer language and observed ads. Turn them into static, video or copy ideas; match video ideas to actual recipes and save a product-scoped angle bank for write-video-ad-script. Product-led discovery can use verified facts without reviews. Reference persistence and reach are observations, not proof of performance.

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

Analyze ad campaign performance data (Google, Meta, LinkedIn) to identify what's working, what's wasting budget, and specific cut/scale/test recommendations. Runs statistical analysis, funnel diagnostics, and multi-channel budget reallocation with specific dollar-amount shift recommendations and scenario modeling.

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

For paid lead-gen and participant-recruitment ads, replaces vanity CPA with true CAC per qualified lead by joining ad-platform data with downstream funnel events, surfaces tracking gaps, and classifies every creative into Scale / Keep / Investigate / Cut.

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

The intake stage of a Meta ad harness. Researches the brand first, states what it assumes, and asks only what it cannot infer and what would change money, claims or legal exposure if guessed wrong — at most four questions a turn, in plain business language. Writes the brand's stable facts (ads/brand.md), the campaign brief, and a log of what was asked vs assumed. Use it when someone wants to run Meta ads and the brand's ad facts are not yet recorded.

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

Checks paid ads against the ad platform's rules (Meta, TikTok, Google, LinkedIn and others) and the brand's category rules: the copy, on-image or on-screen text, pictures and people. Rewrites what can be fixed honestly, adds the disclosures that are needed, and flags anything that needs a human or legal review, with one pass, fixed or flag line per ad and platform. Use alone when you already have the ad text or images and know where they will run; otherwise run the playbook for the job (e.g. make-static-ads, make-content, email-lifecycle).

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

Analyze the message match between your ads and landing pages. Checks if the promise in the ad copy carries through to the landing page headline, body, and CTA. Flags disconnects that kill conversion rates. Works with Google, Meta, and LinkedIn ads.

The English summary is being prepared. Showing the original description.

gooseworks-ai/goose-skills1.3KUpdated Oct 24, 2026

See all skills by gooseworks-ai

Report a problem with this skill