---
name: Og Assets
slug: og-assets
category: Automation
description: Og Assets creates OG images, social-card exports, animated OG loops, and README GIFs for a product. Use it when you need shareable preview media or branded image assets.
github: "https://github.com/ucsandman/marketing-studio/tree/main/skills/og-assets"
language: JavaScript
stars: 225
forks: 31
install: "npx degit https://github.com/ucsandman/marketing-studio/tree/main/skills/og-assets ~/.claude/skills/og-assets"
installs_to: ~/.claude/skills/og-assets
source_path: skills/og-assets/SKILL.md
collection_size: 15
category_size: 1754
collection_url: "https://dirskills.com/collections/ucsandman/marketing-studio"
added: 2026-09-03T06:05:19.913Z
last_synced: 2026-09-03T06:05:19.913Z
canonical_url: "https://dirskills.com/skills/og-assets"
---

# Og Assets

Og Assets creates OG images, social-card exports, animated OG loops, and README GIFs for a product. Use it when you need shareable preview media or branded image assets.

**Install:**

```bash
npx degit https://github.com/ucsandman/marketing-studio/tree/main/skills/og-assets ~/.claude/skills/og-assets
```

## README

# OG Assets

**REQUIRED BACKGROUND:** marketing-studio skill. Work in `${CLAUDE_SKILL_DIR}/../..`.

Produces: `out/<brand>/og.mp4` (8s seamless 1200x630 loop), `og.gif`, `readme.gif`
(600x315), optionally backed by a ComfyUI AI hero texture.

## Recipe

1. Toolchain + brand check per marketing-studio. Background loop staged for the brand
   (Blender `background_loop` scene; PLAYBOOK seam rules) — or run with it null.
2. Optional AI hero: `node feeders/comfy/client.mjs hero [--seed N]` (needs ComfyUI
   Desktop up + a checkpoint; exit 2 = fine, procedural fallback is spec-compliant).
   Read the hero PNG: dark, on-brand hue, no text/people/off-brand colors; re-roll
   seeds until it passes. Prompt lives in the client; adapt per brand.
3. `node scripts/render-statics.mjs` (extend per brand: props tagline/CTA + hero path).
   The AnimatedOG loop is SEAMLESS by construction — if you touch the template, every
   animated value must stay periodic over the full duration (PLAYBOOK loop rules).
4. Verify one still (lockup sharp, CTA in the brand's positive color) + readme.gif
   legibility (extract frame 0 via ffmpeg if the gif exceeds Read limits).
5. Size check: GIFs are heavy; prefer og.mp4 for social embeds. For READMEs going to
   GitHub keep the gif under ~10MB (`--every-nth-frame=3`, lower `--scale`).
6. Deliver per marketing-studio.