Build a cinematic sizzle reel that showcases AI video generation capabilities — from raw Seedance 2.0 clips to a polished Remotion composition with animated text overlays, transitions, and branded typography.
Final result: A 48-second showcase video with:
- Rapid-fire hook sequence over a Seedance clip
- "Meet Seedance 2.0 API" intro card
- Feature showcase with labeled clips (e-commerce, UGC, storytelling, impossible scenes)
- Animated orange Aeonik Black titles with glow effects
- Blur backgrounds for vertical clips in a 16:9 composition
- Professional end card
- Bun (for package management)
- FFmpeg (for image preprocessing)
- curl + jq (for API calls)
- A varg API key with ~1800 credits ($18) for clip generation
# Clone and install
git clone https://github.com/vargHQ/seedance-sizzle-tutorial.git
cd seedance-sizzle-tutorial
bun install
# Generate source clips via varg API (~$18, ~60 minutes)
export VARG_API_KEY=varg_live_xxx
bash scripts/generate-clips.sh
# Preview in browser
bun run start
# Render final video
npx remotion render src/index.ts SizzleReel out/seedance-sizzle-reel.mp4seedance-sizzle-tutorial/
├── scripts/
│ └── generate-clips.sh # Generates all 8 source clips via varg API
├── src/
│ ├── index.ts # Remotion entry point
│ ├── Root.tsx # Composition registration (1440 frames, 30fps)
│ ├── SizzleReel.tsx # Main composition — timeline & clip layout
│ └── components/
│ ├── HookCard.tsx # Rapid-fire text card (unused in v2, kept for reference)
│ ├── IntroCard.tsx # "Meet Seedance 2.0 API" intro
│ ├── ImpactTitle.tsx # Animated title overlay for feature clips
│ └── EndCard.tsx # "varg.ai" end card with CTA
├── public/
│ ├── fonts/
│ │ └── aeonik-black.otf # Aeonik Black font
│ └── clips/ # Generated video clips (gitignored)
│ ├── silicon-valley.mp4 # Hook background
│ ├── ronin-storm.mp4 # "Hollywood Level Videos"
│ ├── medieval-tavern.mp4 # "Tell Stories"
│ ├── night-market.mp4 # Beauty shot
│ ├── cheetah-chase.mp4 # "Create Impossible Scenes"
│ ├── hyperspeed-earth.mp4 # "API That Speeds Your Creativity"
│ ├── ag1-weightloss.mp4 # "Great For E-Commerce" (9:16)
│ └── planner-broll.mp4 # "UGC" (9:16)
├── package.json
├── tsconfig.json
└── remotion.config.ts
The sizzle reel is composed of 8 AI-generated video clips. Each is a single 15-second Seedance 2.0 generation — no stitching, no multi-clip editing. One prompt, one API call, one clip.
export VARG_API_KEY=varg_live_xxx
bash scripts/generate-clips.shThis script:
- Calls
POST https://api.varg.ai/v1/videowithmodel: "seedance-2-preview"for each clip - Polls
GET https://api.varg.ai/v1/jobs/:iduntil complete - Downloads the result to
public/clips/
Cost: ~250 credits ($2.50) per clip, ~1800 total ($18) Time: ~8-12 minutes per clip (generation + watermark removal)
| Clip | Type | Reference | Prompt Style |
|---|---|---|---|
| Silicon Valley | text-to-video | None | Single paragraph, impossible camera move |
| Ronin Storm | text-to-video | None | Single paragraph, action scene |
| Medieval Tavern | text-to-video | None | Single paragraph, impossible camera move |
| Night Market | text-to-video | None | Timestamped 0:00-0:02 format |
| Cheetah Chase | text-to-video | None | Technical camera specs (angles, speeds) |
| Hyperspeed Earth | text-to-video | None | Timestamped with location changes |
| AG1 E-Commerce | image-to-video | Product image | @image1 reference + timestamped scenes |
| Planner B-Roll | image-to-video | Character image | @image1 reference + UGC style |
Key insight: For image-to-video clips, the reference image is pre-processed to 9:16 using blur-extend (ffmpeg) to work around a known PiAPI aspect ratio bug where the output matches the input image dimensions.
The video is structured in 4 parts:
The full Silicon Valley Seedance clip plays as background. Animated text overlays appear synced to specific timestamps (from an ASS subtitle file). Each line slams in with a spring animation — alternating white and orange (accent) text.
// SizzleReel.tsx — Hook subtitles with exact timing
const HOOK_SUBS = [
{ start: 3.0, end: 3.22, text: "You idiot!", accent: true },
{ start: 3.22, end: 3.78, text: "You activated" },
// ... 17 lines total
];The HookSubtitles component uses useCurrentFrame() to find which subtitle is active at the current time, then renders it with spring scale + fade animation.
"Meet Seedance 2.0 API" with spring-animated scale, orange divider line, and staggered "Designed for Agents." subtitle.
Each clip gets an ImpactTitle overlay — orange Aeonik Black text with glow pulse. Vertical (9:16) clips use BlurBgClip which renders two <OffthreadVideo> layers:
- Blurred + darkened background (stretched to fill 16:9)
- Sharp foreground (contained at center)
// Blur background for 9:16 clips in a 16:9 composition
<OffthreadVideo src={src} style={{ objectFit: "cover", filter: "blur(30px) brightness(0.4)", transform: "scale(1.2)" }} />
<OffthreadVideo src={src} style={{ objectFit: "contain" }} />"varg.ai" logo with spring entrance + pulsing "Try Seedance 2.0" CTA button.
bun run startOpens Remotion Studio in your browser. You get:
- Frame-by-frame scrubbing
- Real-time preview of all animations
- Hot reload when you edit any
.tsxfile
This is the key advantage of Remotion over FFmpeg-only pipelines — you can see exactly how text animations look before spending time on a full render.
npx remotion render src/index.ts SizzleReel out/seedance-sizzle-reel.mp4 --concurrency=4Renders 1440 frames at 1920x1080, 30fps. Takes ~2-3 minutes on a modern machine.
Edit the title prop in SizzleReel.tsx:
<WideClip src={CLIPS.ronin} startFrom={fps * 3} title="YOUR TITLE HERE" />Edit the HOOK_SUBS array in SizzleReel.tsx. Each entry has start/end (seconds), text, and optional accent (orange vs white).
The orange accent color #ff6b00 is used throughout all components. Search and replace to rebrand.
- Place
.mp4files inpublic/clips/ - Reference with
staticFile("clips/your-clip.mp4") - Use
<WideClip>for 16:9 or<BlurBgClip>for 9:16
Replace public/fonts/aeonik-black.otf with your font. Update the fontFace declaration in SizzleReel.tsx.
- Remotion — React-based video composition
- Seedance 2.0 via varg API — AI video generation (ByteDance model via PiAPI)
- Aeonik — Typography
- FFmpeg — Image preprocessing (blur-extend for aspect ratio workaround)
Based on extensive testing, these patterns produce the best results:
- Timestamped scene breakdowns:
0:00-0:02: Description...gives Seedance clear temporal structure - "Impossible camera move" format: "Continuous single take, camera tilting, rolling, spinning, flying through..." triggers Seedance's best single-take capabilities
- Technical camera specs: Exact angles ("banks 28 degrees"), distances ("locked 2.5 meters behind"), heights ("camera height 40cm") improve motion quality
@image1character anchoring: For image-to-video, reference the character in every scene: "Strictly maintain this exact person's face throughout every shot"- Physical detail keywords: "glass shards", "motion blur", "volumetric god-rays", "shallow DOF" improve visual quality
- Quality suffix: Always end with "8K, photorealistic, cinematic, no text overlays, no watermarks"
MIT
Built with varg — AI video generation platform. Prompts inspired by awesome-seedance-2-prompts.