Product reel generator
Generates Instagram-ready product reels from any e-commerce product page URL.
How to use it
- Hit Copy SKILL.md — or use the Claude Code line below to get every file.
- Claude: ⋯ → Download .md, then Customize → Skills → Add → Upload skill.
ChatGPT: make a Project and paste it into Instructions.
Neither? Paste it at the top of a new chat — it works for that chat. - Describe your job in plain words. The AI follows the skill from there.
npx degit gooseworks-ai/goose-skills/skills/design/packs/video-production/product-reel-generator#main ~/.claude/skills/product-reel-generatorFor one project only, change the path to .claude/skills/product-reel-generator. This skill also uses concat.txt — copying SKILL.md alone won't be enough. See the folder on GitHub.
Not working?
- Check which app you pasted it into — the steps above name the right one.
- Some skills need the paid tier of Claude or ChatGPT.
Paste into Claude, ChatGPT or Cursor.
Show the full text206 lines
Product Reel Generator
You are a video production skill that takes an e-commerce product page URL and produces an Instagram-ready reel. The reel features AI-animated model clips (or Ken Burns product showcases), text overlays, and background music.
Requirements
- FFmpeg installed and available in PATH (
brew install ffmpegon macOS,apt install ffmpegon Linux) - Python 3 with
Pillowandpython-dotenvpackages (pip install Pillow python-dotenv) - Higgsfield API credentials —
HIGGSFIELD_API_KEY_IDandHIGGSFIELD_API_KEY_SECRETin a.envfile (project root or any parent directory)
Before starting: Verify dependencies are available. If FFmpeg or Python packages are missing, instruct the user to install them before proceeding.
Input
The user provides:
- Product page URL (required) — any e-commerce product page (Shopify, Zara, DaMENSCH, etc.)
- Music file (optional) — path to an MP3. If not provided, use a royalty-free track.
- Style preset (optional) — one of:
minimal,luxury,bold,editorial,clean. Defaults to auto-detect based on brand. - Brand name (optional) — for watermark. If not provided, extract from the page.
Pipeline
Step 1: Scrape Product Images
Try these methods in order until one works:
- Shopify JSON — append
.jsonto the product URL and extract images from the response - HTML scraping with referrer —
curlwith-H "Referer: <site-domain>"and a browser user-agent - Chrome DevTools — navigate to page, extract image URLs via JavaScript, download
For each image, download at the highest available resolution.
Step 2: Classify Images (Heuristic)
Use image position on the product page as the primary signal:
| Position | Likely Type | Use In Reel |
|---|---|---|
| Image 1 (first on page) | Hero / front-facing model | Walk forward (AI) |
| Image 2 | Alternate angle (side/back) | Turn or side walk (AI) |
| Image 3-4 | Close-up or detail | Detail insert (Ken Burns) |
| Last image | Size guide or back view | Back turn (AI) or product card |
Model detection heuristic: If image height > 1.5× width AND file size > 100KB → likely a model photo → use AI animation pipeline. Otherwise → product-only → use Ken Burns pipeline.
Step 3: Generate AI Video Clips
Use the Higgsfield API via this skill's scripts/higgsfield_video.py script or direct curl calls.
API details:
- Base URL:
https://platform.higgsfield.ai - Auth header:
Authorization: Key {HIGGSFIELD_API_KEY_ID}:{HIGGSFIELD_API_KEY_SECRET} - Always set
"aspect_ratio": "9:16"for Instagram Reels
Model selection:
- Seedance (
bytedance/seedance/v1/pro/image-to-video) — for hero/walk scenes. Higher quality, ~45 credits. Use for the most important clip. - Kling (
kling-video/v2.1/pro/image-to-video) — for secondary scenes. Good quality, ~6 credits. Use for turns, side angles.
Prompt guidelines:
- Always mention the clothing color and type in the prompt
- Specify direction of motion ("walks forward", "turns from front to side")
- Add "clean studio background" or describe the actual background
- Add "smooth cinematic motion" at the end
- For walk prompts, add "does not stop or turn around" to prevent reversal
Duration: Use "duration": 5 for each clip. Kling only supports 5 or 10.
Polling: After submission, poll GET /requests/{request_id}/status every 15 seconds until status: "completed". Then download the video from response.video.url.
Step 4: Create Ken Burns Scenes
For detail/texture shots where AI animation adds no value, use FFmpeg Ken Burns:
ffmpeg -y -loop 1 -i "detail.jpg" \
-vf "scale=2160:3840,zoompan=z='1+0.06*in/75':x='iw/2-(iw/zoom/2)':y='ih/2-(ih/zoom/2)':d=75:s=1080x1920:fps=25" \
-t 3 -c:v libx264 -pix_fmt yuv420p -r 25 "scene-detail.mp4"
Vary the zoom type: zoom-in, zoom-out, pan-left, pan-right, pan-up, pan-down.
Step 5: Create Text Overlays
Use Python Pillow to generate transparent PNG overlays, then composite with FFmpeg.
IMPORTANT: Many FFmpeg installations do NOT have the drawtext filter. Always use Pillow to create PNG text images, then overlay with:
ffmpeg -y -i video.mp4 -loop 1 -t <duration> -i overlay.png \
-filter_complex "[1:v]format=rgba[txt];[0:v][txt]overlay=0:0" \
-t <duration> -c:v libx264 -pix_fmt yuv420p -r 25 output.mp4
Style Presets
Fonts are provided as shared files in the pack's fonts/ directory (copied into each skill on install). Fall back to system fonts if custom fonts are not found.
| Preset | Title Font | Body Font | Text Color | Treatment |
|---|---|---|---|---|
| minimal | Montserrat-Light.ttf | Montserrat-Light.ttf | White (255,255,255) | No background, subtle shadow |
| luxury | System Didot (/System/Library/Fonts/Supplemental/Didot.ttc) | Cormorant-Regular.ttf | Cream (245,235,210) | Thin gold stroke |
| bold | System Futura (/System/Library/Fonts/Supplemental/Futura.ttc) | Montserrat-Bold.ttf | White | Dark backdrop bar, uppercase |
| editorial | Cormorant-Italic.ttf | Cormorant-Regular.ttf | White | Minimal, italic titles |
| clean | System Helvetica (/System/Library/Fonts/Helvetica.ttc) | System Helvetica | White | Simple shadow, professional |
Overlays to create:
- Brand watermark — small text, top-right corner, persistent on all video scenes
- Product info card — product name, price, CTA ("Shop now → website"), placed on the final scene with gradient background
Step 6: Compose the Reel
Model Reel Structure (when model photos detected)
| Time | Scene | Type | Duration |
|---|---|---|---|
| 0-5s | Hero — walk forward or full body | AI (Seedance) | 5s |
| 5-10s | Alternate angle — side/back | AI (Kling) or Ken Burns | 5s |
| 10-13s | Detail — texture, fabric, accessories | Ken Burns | 3s |
| 13-16s | Third angle — back turn or close-up | AI (Kling) | 3s |
| 16-20s | Product card + CTA | Static + text overlay | 4s |
Target: 80% video, 20% static. The product card at the end is fine as static.
If a generated AI clip looks bad (distortion, wrong face, backward motion), replace with Ken Burns from the same source image.
Product-Only Reel Structure (no model photos)
| Time | Scene | Type | Duration |
|---|---|---|---|
| 0-3s | Hero reveal | Ken Burns zoom-out | 3s |
| 3-6s | Detail 1 | Ken Burns zoom-in | 3s |
| 6-9s | Alternate angle | Ken Burns pan | 3s |
| 9-12s | Detail 2 | Ken Burns zoom | 3s |
| 12-15s | Product card + CTA | Static + text | 3s |
Stitching
Concatenate all scenes with FFmpeg:
cat > concat.txt << EOF
file 'scene1.mp4'
file 'scene2.mp4'
...
EOF
ffmpeg -y -f concat -safe 0 -i concat.txt -c:v libx264 -pix_fmt yuv420p -r 25 reel-silent.mp4
Step 7: Add Audio
Mix background music with the silent reel:
ffmpeg -y -i reel-silent.mp4 -i music.mp3 \
-filter_complex "[1:a]atrim=<start>:<end>,asetpts=PTS-STARTPTS,afade=t=in:st=0:d=1.5,afade=t=out:st=<fade_start>:d=2,volume=0.5[aud]" \
-map 0:v -map "[aud]" -c:v copy -c:a aac -shortest output.mp4
If no music file is provided, ask the user to supply one or search for a royalty-free track (e.g., Kevin MacLeod's library at incompetech.com). The user should provide a local file path or URL.
Output
Save the final reel to a user-specified directory (or the current working directory).
Output specs:
- Format: MP4 (H.264)
- Resolution: 1080×1920 (9:16 portrait)
- Frame rate: 25fps
- Duration: 15-20 seconds
- Audio: AAC
Known Limitations
- Multi-clip cohesion — independently generated AI clips may have slightly different faces or clothing details. Mitigate by using different source images (not same image with different prompts) and keeping clips short (3-5s each).
- AI motion reversal — Kling sometimes reverses motion (walk forward then backward). Seedance handles this better. Use Seedance for walk scenes.
- Enterprise CDN blocking — sites like Zara require
Refererheader. Always include-H "Referer: <site-domain>"in curl downloads. - Flat-lay animation — AI animation adds no visible value to flat-lay/product-on-surface photos. Use Ken Burns instead (free, equally effective).
- No
drawtextin FFmpeg — many FFmpeg installations lack the drawtext filter. Always use Pillow for text → PNG → overlay.
Cost Estimate Per Reel
| Component | Credits | Approx Cost |
|---|---|---|
| 1× Seedance clip (hero) | ~45 | ~$2.50 |
| 1-2× Kling clips (secondary) | ~6-12 | ~$0.60-1.20 |
| Ken Burns + text overlays | 0 | Free |
| Total per reel | ~51-57 | ~$3-4 |
| 1 | |
| 2 | name product-reel-generator |
| 3 | description Generates Instagram-ready product reels from any e-commerce product page URL. Scrapes product images, classifies by type, generates AI-animated clips via Higgsfield API, creates text overlays with style presets, and composes a 15-20 second reel with music. Supports model-based and product-only reels. |
| 4 | user-invocable true |
| 5 | allowed-tools Bash, Read, Write, Edit, Grep, Glob, WebSearch |
| 6 | argument-hint [product-page-url] |
| 7 | |
| 8 | |
| 9 | # Product Reel Generator |
| 10 | |
| 11 | You are a video production skill that takes an e-commerce product page URL and produces an Instagram-ready reel. The reel features AI-animated model clips (or Ken Burns product showcases), text overlays, and background music. |
| 12 | |
| 13 | |
| 14 | |
| 15 | ## Requirements |
| 16 | |
| 17 | **FFmpeg** installed and available in PATH (`brew install ffmpeg` on macOS, `apt install ffmpeg` on Linux) |
| 18 | **Python 3** with `Pillow` and `python-dotenv` packages (`pip install Pillow python-dotenv`) |
| 19 | **Higgsfield API credentials** — `HIGGSFIELD_API_KEY_ID` and `HIGGSFIELD_API_KEY_SECRET` in a `.env` file (project root or any parent directory) |
| 20 | |
| 21 | **Before starting:** Verify dependencies are available. If FFmpeg or Python packages are missing, instruct the user to install them before proceeding. |
| 22 | |
| 23 | |
| 24 | |
| 25 | ## Input |
| 26 | |
| 27 | The user provides: |
| 28 | **Product page URL** (required) — any e-commerce product page (Shopify, Zara, DaMENSCH, etc.) |
| 29 | **Music file** (optional) — path to an MP3. If not provided, use a royalty-free track. |
| 30 | **Style preset** (optional) — one of: `minimal`, `luxury`, `bold`, `editorial`, `clean`. Defaults to auto-detect based on brand. |
| 31 | **Brand name** (optional) — for watermark. If not provided, extract from the page. |
| 32 | |
| 33 | |
| 34 | |
| 35 | ## Pipeline |
| 36 | |
| 37 | ### Step 1: Scrape Product Images |
| 38 | |
| 39 | Try these methods in order until one works: |
| 40 | |
| 41 | **Shopify JSON** — append `.json` to the product URL and extract images from the response |
| 42 | **HTML scraping with referrer** — `curl` with `-H "Referer: <site-domain>"` and a browser user-agent |
| 43 | **Chrome DevTools** — navigate to page, extract image URLs via JavaScript, download |
| 44 | |
| 45 | For each image, download at the highest available resolution. |
| 46 | |
| 47 | ### Step 2: Classify Images (Heuristic) |
| 48 | |
| 49 | Use image position on the product page as the primary signal: |
| 50 | |
| 51 | | Position | Likely Type | Use In Reel | |
| 52 | |----------|-------------|------------| |
| 53 | | Image 1 (first on page) | Hero / front-facing model | Walk forward (AI) | |
| 54 | | Image 2 | Alternate angle (side/back) | Turn or side walk (AI) | |
| 55 | | Image 3-4 | Close-up or detail | Detail insert (Ken Burns) | |
| 56 | | Last image | Size guide or back view | Back turn (AI) or product card | |
| 57 | |
| 58 | **Model detection heuristic:** If image height > 1.5× width AND file size > 100KB → likely a model photo → use AI animation pipeline. Otherwise → product-only → use Ken Burns pipeline. |
| 59 | |
| 60 | ### Step 3: Generate AI Video Clips |
| 61 | |
| 62 | Use the Higgsfield API via this skill's `scripts/higgsfield_video.py` script or direct `curl` calls. |
| 63 | |
| 64 | **API details:** |
| 65 | Base URL: `https://platform.higgsfield.ai` |
| 66 | Auth header: `Authorization: Key {HIGGSFIELD_API_KEY_ID}:{HIGGSFIELD_API_KEY_SECRET}` |
| 67 | Always set `"aspect_ratio": "9:16"` for Instagram Reels |
| 68 | |
| 69 | **Model selection:** |
| 70 | **Seedance** (`bytedance/seedance/v1/pro/image-to-video`) — for hero/walk scenes. Higher quality, ~45 credits. Use for the most important clip. |
| 71 | **Kling** (`kling-video/v2.1/pro/image-to-video`) — for secondary scenes. Good quality, ~6 credits. Use for turns, side angles. |
| 72 | |
| 73 | **Prompt guidelines:** |
| 74 | Always mention the clothing color and type in the prompt |
| 75 | Specify direction of motion ("walks forward", "turns from front to side") |
| 76 | Add "clean studio background" or describe the actual background |
| 77 | Add "smooth cinematic motion" at the end |
| 78 | For walk prompts, add "does not stop or turn around" to prevent reversal |
| 79 | |
| 80 | **Duration:** Use `"duration": 5` for each clip. Kling only supports 5 or 10. |
| 81 | |
| 82 | **Polling:** After submission, poll `GET /requests/{request_id}/status` every 15 seconds until `status: "completed"`. Then download the video from `response.video.url`. |
| 83 | |
| 84 | ### Step 4: Create Ken Burns Scenes |
| 85 | |
| 86 | For detail/texture shots where AI animation adds no value, use FFmpeg Ken Burns: |
| 87 | |
| 88 | |
| 89 | ffmpeg -y -loop 1 -i "detail.jpg" \ |
| 90 | -vf "scale=2160:3840,zoompan=z='1+0.06*in/75':x='iw/2-(iw/zoom/2)':y='ih/2-(ih/zoom/2)':d=75:s=1080x1920:fps=25" \ |
| 91 | -t 3 -c:v libx264 -pix_fmt yuv420p -r 25 "scene-detail.mp4" |
| 92 | |
| 93 | |
| 94 | Vary the zoom type: zoom-in, zoom-out, pan-left, pan-right, pan-up, pan-down. |
| 95 | |
| 96 | ### Step 5: Create Text Overlays |
| 97 | |
| 98 | Use Python Pillow to generate transparent PNG overlays, then composite with FFmpeg. |
| 99 | |
| 100 | **IMPORTANT:** Many FFmpeg installations do NOT have the `drawtext` filter. Always use Pillow to create PNG text images, then overlay with: |
| 101 | |
| 102 | ffmpeg -y -i video.mp4 -loop 1 -t <duration> -i overlay.png \ |
| 103 | -filter_complex "[1:v]format=rgba[txt];[0:v][txt]overlay=0:0" \ |
| 104 | -t <duration> -c:v libx264 -pix_fmt yuv420p -r 25 output.mp4 |
| 105 | |
| 106 | |
| 107 | #### Style Presets |
| 108 | |
| 109 | Fonts are provided as shared files in the pack's `fonts/` directory (copied into each skill on install). Fall back to system fonts if custom fonts are not found. |
| 110 | |
| 111 | | Preset | Title Font | Body Font | Text Color | Treatment | |
| 112 | |--------|-----------|-----------|------------|-----------| |
| 113 | | **minimal** | Montserrat-Light.ttf | Montserrat-Light.ttf | White (255,255,255) | No background, subtle shadow | |
| 114 | | **luxury** | System Didot (/System/Library/Fonts/Supplemental/Didot.ttc) | Cormorant-Regular.ttf | Cream (245,235,210) | Thin gold stroke | |
| 115 | | **bold** | System Futura (/System/Library/Fonts/Supplemental/Futura.ttc) | Montserrat-Bold.ttf | White | Dark backdrop bar, uppercase | |
| 116 | | **editorial** | Cormorant-Italic.ttf | Cormorant-Regular.ttf | White | Minimal, italic titles | |
| 117 | | **clean** | System Helvetica (/System/Library/Fonts/Helvetica.ttc) | System Helvetica | White | Simple shadow, professional | |
| 118 | |
| 119 | **Overlays to create:** |
| 120 | **Brand watermark** — small text, top-right corner, persistent on all video scenes |
| 121 | **Product info card** — product name, price, CTA ("Shop now → website"), placed on the final scene with gradient background |
| 122 | |
| 123 | ### Step 6: Compose the Reel |
| 124 | |
| 125 | #### Model Reel Structure (when model photos detected) |
| 126 | |
| 127 | | Time | Scene | Type | Duration | |
| 128 | |------|-------|------|----------| |
| 129 | | 0-5s | Hero — walk forward or full body | AI (Seedance) | 5s | |
| 130 | | 5-10s | Alternate angle — side/back | AI (Kling) or Ken Burns | 5s | |
| 131 | | 10-13s | Detail — texture, fabric, accessories | Ken Burns | 3s | |
| 132 | | 13-16s | Third angle — back turn or close-up | AI (Kling) | 3s | |
| 133 | | 16-20s | Product card + CTA | Static + text overlay | 4s | |
| 134 | |
| 135 | **Target: 80% video, 20% static.** The product card at the end is fine as static. |
| 136 | |
| 137 | If a generated AI clip looks bad (distortion, wrong face, backward motion), replace with Ken Burns from the same source image. |
| 138 | |
| 139 | #### Product-Only Reel Structure (no model photos) |
| 140 | |
| 141 | | Time | Scene | Type | Duration | |
| 142 | |------|-------|------|----------| |
| 143 | | 0-3s | Hero reveal | Ken Burns zoom-out | 3s | |
| 144 | | 3-6s | Detail 1 | Ken Burns zoom-in | 3s | |
| 145 | | 6-9s | Alternate angle | Ken Burns pan | 3s | |
| 146 | | 9-12s | Detail 2 | Ken Burns zoom | 3s | |
| 147 | | 12-15s | Product card + CTA | Static + text | 3s | |
| 148 | |
| 149 | #### Stitching |
| 150 | |
| 151 | Concatenate all scenes with FFmpeg: |
| 152 | |
| 153 | cat > concat.txt << EOF |
| 154 | file 'scene1.mp4' |
| 155 | file 'scene2.mp4' |
| 156 | ... |
| 157 | EOF |
| 158 | ffmpeg -y -f concat -safe 0 -i concat.txt -c:v libx264 -pix_fmt yuv420p -r 25 reel-silent.mp4 |
| 159 | |
| 160 | |
| 161 | ### Step 7: Add Audio |
| 162 | |
| 163 | Mix background music with the silent reel: |
| 164 | |
| 165 | ffmpeg -y -i reel-silent.mp4 -i music.mp3 \ |
| 166 | -filter_complex "[1:a]atrim=<start>:<end>,asetpts=PTS-STARTPTS,afade=t=in:st=0:d=1.5,afade=t=out:st=<fade_start>:d=2,volume=0.5[aud]" \ |
| 167 | -map 0:v -map "[aud]" -c:v copy -c:a aac -shortest output.mp4 |
| 168 | |
| 169 | |
| 170 | If no music file is provided, ask the user to supply one or search for a royalty-free track (e.g., Kevin MacLeod's library at incompetech.com). The user should provide a local file path or URL. |
| 171 | |
| 172 | |
| 173 | |
| 174 | ## Output |
| 175 | |
| 176 | Save the final reel to a user-specified directory (or the current working directory). |
| 177 | |
| 178 | **Output specs:** |
| 179 | Format: MP4 (H.264) |
| 180 | Resolution: 1080×1920 (9:16 portrait) |
| 181 | Frame rate: 25fps |
| 182 | Duration: 15-20 seconds |
| 183 | Audio: AAC |
| 184 | |
| 185 | |
| 186 | |
| 187 | ## Known Limitations |
| 188 | |
| 189 | **Multi-clip cohesion** — independently generated AI clips may have slightly different faces or clothing details. Mitigate by using different source images (not same image with different prompts) and keeping clips short (3-5s each). |
| 190 | **AI motion reversal** — Kling sometimes reverses motion (walk forward then backward). Seedance handles this better. Use Seedance for walk scenes. |
| 191 | **Enterprise CDN blocking** — sites like Zara require `Referer` header. Always include `-H "Referer: <site-domain>"` in curl downloads. |
| 192 | **Flat-lay animation** — AI animation adds no visible value to flat-lay/product-on-surface photos. Use Ken Burns instead (free, equally effective). |
| 193 | **No `drawtext` in FFmpeg** — many FFmpeg installations lack the drawtext filter. Always use Pillow for text → PNG → overlay. |
| 194 | |
| 195 | |
| 196 | |
| 197 | ## Cost Estimate Per Reel |
| 198 | |
| 199 | | Component | Credits | Approx Cost | |
| 200 | |-----------|---------|-------------| |
| 201 | | 1× Seedance clip (hero) | ~45 | ~$2.50 | |
| 202 | | 1-2× Kling clips (secondary) | ~6-12 | ~$0.60-1.20 | |
| 203 | | Ken Burns + text overlays | 0 | Free | |
| 204 | | **Total per reel** | **~51-57** | **~$3-4** | |
| 205 | |
| 206 |