render-model-comparison-grid

Featured

Render a 'model comparison grid' video from a config — a fal-style "same prompt, N contenders" showcase — a dark real-DOM stage where per beat a monospace prompt fades in centered, docks to a small top strip, then a labeled 2-4 panel grid (static images OR muted video clips, mixable per cell) staggers in and holds for comparison, plus a minimal end card — frame-stepped via Playwright (video cells are frame-seeked deterministically) and encoded with FFmpeg. Deterministic assembly, FREE (cell media comes from create-image-fal / create-video-fal, music from create-music-elevenlabs), text stays pixel-crisp. Use for the model-comparison-grid format.

AI & Automation 1,055 stars 194 forks Updated 3 days ago MIT

Install

View on GitHub

Quality Score: 95/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# render-model-comparison-grid Render the 'model comparison grid' format from a config. The signature of this format is a **"Same prompt. N models."** gauntlet: a dark stage where, per beat, a `PROMPT` eyebrow + the (condensed) prompt **fades in** centered in monospace and holds readable ~0.8s, then docks to a small top strip while a **grid of 2-4 labeled panels** staggers in (0.15s apart) and holds for side-by-side comparison. A persistent model/variant label sits under each panel; column order is identical on every beat. Ends on a minimal end card (headline + column names only — **no meta-stats line**). The grid is **media-agnostic per cell**: any cell is a static image or a **muted video clip** (i2v outputs, screen recordings), mixable within one beat. Video cells loop during the hold and are **frame-seeked deterministically** (the renderer awaits each seek), so the render never depends on wall-clock playback timing. The renderer itself is FREE/deterministic (Playwright frame-step + FFmpeg). The paid inputs are separate capabilities: the cell **images** come from `create-image-fal`, the cell **clips** from `create-video-fal`, and the **music bed** from `create-music-elevenlabs`. Prompt text and labels are real DOM — never AI-rendered. Default shape: 5 beats × 4.5s + 2.5s end card = 25.0s @ 1280×720/30fps, all configurable from one `config.json`. ## Run build_composition.py --config config.json --output hyperframe.html ; render_seekable_hyperframe.py hyperframe.html ma...

Details

Author
gooseworks-ai
Repository
gooseworks-ai/goose-skills
Created
4 months ago
Last Updated
3 days ago
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

Code & Development Featured

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.

1,055 Updated 3 days ago
gooseworks-ai
Code & Development Featured

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.

1,055 Updated 3 days ago
gooseworks-ai
AI & Automation Featured

render-mosaic-grid-reveal

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.

1,055 Updated 3 days ago
gooseworks-ai