Documentation
Everything needed to turn this build into a live product: assets, providers, and configuration.
The gallery is driven by src/data/showcase-videos.ts. Each sample expects a video at /videos/<id>.mp4 and a poster at /posters/<id>.webp. Files are detected on the server when a page renders, so dropping them into public/ is the whole integration.
Status right now: 13 / 13 clips present
| Sample | Video | Poster | Status |
|---|---|---|---|
| Cosmic Ocean | /videos/cosmic-ocean.mp4?v=mvy07ozh | /posters/cosmic-ocean.webp?v=mvy07oym | ready |
| Liquid Gold | /videos/liquid-gold.mp4?v=mvy07p4x | /posters/liquid-gold.webp?v=mvy07oyp | ready |
| Future Tokyo | /videos/future-tokyo.mp4?v=mvy07p2u | /posters/future-tokyo.webp?v=mvy07oyo | ready |
| Dream Architecture | /videos/dream-architecture.mp4?v=mvy07p07 | /posters/dream-architecture.webp?v=mvy07oym | ready |
| The Last Astronaut | /videos/the-last-astronaut.mp4?v=mvy07p6r | /posters/the-last-astronaut.webp?v=mvy07oyr | ready |
| Nature Reimagined | /videos/nature-reimagined.mp4?v=mvy07p5o | /posters/nature-reimagined.webp?v=mvy07oyp | ready |
| Fashion From Tomorrow | /videos/fashion-from-tomorrow.mp4?v=mvy07p0w | /posters/fashion-from-tomorrow.webp?v=mvy07oym | ready |
| Impossible Worlds | /videos/impossible-worlds.mp4?v=mvy07p3r | /posters/impossible-worlds.webp?v=mvy07oyp | ready |
| Obsidian Perfume | /videos/obsidian-perfume.mp4?v=mvy07p62 | /posters/obsidian-perfume.webp?v=mvy07oyp | ready |
| Frequency | /videos/frequency.mp4?v=mvy07p2p | /posters/frequency.webp?v=mvy07oym | ready |
| Glass Cathedral | /videos/glass-cathedral.mp4?v=mvy07p35 | /posters/glass-cathedral.webp?v=mvy07oyo | ready |
| Velvet Dunes | /videos/velvet-dunes.mp4?v=mvy07p7p | /posters/velvet-dunes.webp?v=mvy07oyr | ready |
| Ink Bloom | /videos/ink-bloom.mp4?v=mvy07p4b | /posters/ink-bloom.webp?v=mvy07oyp | ready |
Full naming rules and ffmpeg encoding commands live in docs/ADDING_VIDEOS.md.
docs/GEMINI_VIDEO_PROMPTS.md contains 13 production prompts, one per sample, with camera direction, lighting, motion, negative prompts, loop guidance, specs and the exact filenames to use. Paste them into Gemini's video generation interface as-is.
The website does not call Gemini or any other model itself. Generation inside the studio goes through the provider abstraction described below.
The studio makes two kinds of film. Explainers are narrated motion graphics: Claude plans each scene, ElevenLabs records the voice with word timestamps, Remotion renders charts, ledgers and captions from code, and ffmpeg muxes. No video model is needed. Cinematic footage chains four services. Claude is the director: it writes the scene-by-scene plan, narration and sound cues as structured data. It does not render video. Higgsfield (Seedance, pay-as-you-go platform API) or ElevenLabs (Veo 3.1, Pro plan) renders each scene. ElevenLabs records the narration, sound effects and music. ffmpeg assembles the scenes and mixes the audio into the final MP4.
POST /api/account/credits and ADMIN_API_KEY. Payments are not wired up.ELEVENLABS_MOCK=1 in development exercises the whole pipeline with placeholder media.Full reference, endpoints and file layout: docs/BACKEND.md.
Active provider: …
Two providers ship: studio (the real backend above, selected automatically when ANTHROPIC_API_KEY is set) and demo, which replays local sample clips and flags every result as a demo. To add another backend, implement the VideoProvider interface in src/lib/video-providers/, register it with an environment-gated factory, and set VIDEO_PROVIDER.
server-only.Step-by-step instructions: docs/PROVIDER_INTEGRATION.md.
Copy .env.example to .env.local.
NEXT_PUBLIC_SITE_URL: canonical URL for Open Graph tags.NEXT_PUBLIC_CONTACT_EMAIL: shown in the footer when set.VIDEO_PROVIDER: studio or demo.ANTHROPIC_API_KEY, ELEVENLABS_API_KEY, APP_SECRET, ADMIN_API_KEY, SIGNUP_CREDITS: see .env.example.Pages are prerendered, so restart the dev server or rebuild after changing environment variables or adding asset files.
Accounts use email and password sessions; new accounts start with SIGNUP_CREDITS credits and one free 5-second cinematic clip. The sign-in page is the way in.
Set NEXT_PUBLIC_CONTACT_EMAIL to publish a contact address in the footer. No social profiles are listed until real ones exist.