Een video zonder camera? Zo begin je.

Geen camera, geen filmset, geen montageprogramma. Claude Code schrijft de wereld en de poppetjes, HyperFrames zet ze op een tijdlijn, en één commando maakt er een mp4 van. Hieronder: wat je installeert, hoe je een project start, een eerste prompt om te kopiëren en de vijf stappen uit de reel.

InstallerenClaude Code, Node.js, FFmpeg
Project startenéén commando, een lege compositie
Prompt plakkenClaude bouwt de 3D-scène
Renderennaar een mp4

01Wat je nodig hebt

Drie programma's op je computer. Met het commando rechts zie je of ze er al zijn: krijg je een versienummer terug, dan staat het erop.

Programma	Waarvoor	Controleren
Claude Code	Schrijft alle code: de wereld, de poppetjes, de tijdlijn.	`claude --version`
Node.js 22 of nieuwer	Draait HyperFrames, het programma dat de video bouwt en rendert.	`node -v`
FFmpeg	Maakt van de losse beelden en het geluid één videobestand.	`ffmpeg -version`

Claude Code werkt met een betaald Claude-abonnement (Pro of hoger) of een Anthropic Console-account. Het gratis plan van claude.ai heeft geen Claude Code. Wat Claude Code verbruikt, gaat van dat account af. HyperFrames zelf is open source en rendert op je eigen computer.

02Installeren

Open een terminal (op de Mac: Terminal, via Spotlight) en plak de regels één voor één.

# Claude Code (macOS, Linux, WSL)
curl -fsSL https://claude.ai/install.sh | bash

# FFmpeg op de Mac, als je Homebrew hebt
brew install ffmpeg

Node.js download je op nodejs.org/en/download. Kies een versie van 22 of hoger.

Windows? Installeer Claude Code in PowerShell met irm https://claude.ai/install.ps1 | iex. FFmpeg vind je op ffmpeg.org/download.html.

Open daarna een nieuw terminalvenster en typ claude. De eerste keer log je in via je browser.

03Leer Claude Code HyperFrames

HyperFrames heeft een plug-in voor Claude Code. Daarin staat hoe een geldige compositie eruitziet, zodat Claude niet hoeft te gokken. Installeer hem met deze twee regels:

claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

Start daarna een nieuwe sessie van Claude Code. Controleer met npx hyperframes doctor of alles klaarstaat: Node.js, FFmpeg en de browser waarmee HyperFrames rendert.

04Start je project

Maak een nieuw project. --resolution=portrait maakt het staand (1080 × 1920), het formaat van een reel.

npx -y hyperframes@0.8.145 init eerste-scene --resolution=portrait --non-interactive
cd eerste-scene
claude

Je krijgt een map met onder meer index.html (de compositie: een startversie van 10 seconden) en package.json. In die package.json staat het versienummer van HyperFrames vast. Daardoor rendert je project over een maand nog precies hetzelfde.

Wij maakten de reel met versie 0.8.145. Op 2 november 2026 is 0.9.2 de nieuwste. Laat je het versienummer weg, dan krijg je de nieuwste.

05Je eerste prompt

Plak dit in Claude Code, in de map van je project. Pas de scène gerust aan; laat de regels staan.

Kopieer dit

Gebruik /hyperframes:hyperframes. Maak in dit project een 3D-scène
van 8 seconden, staand (1080 × 1920), met Three.js.

DE SCÈNE
Een simpel poppetje van blokken en bollen loopt over een kade,
langs het water en drie smalle grachtenpanden.
De camera rijdt langzaam met hem mee en eindigt dicht bij zijn gezicht.
Onderin staat één ondertitel: "Dit is geschreven, niet gefilmd."

REGELS
- Maak alle vormen met Three.js zelf. Geen modellen of plaatjes van internet.
- Laat alle beweging de tijd van HyperFrames volgen (het hf-seek-event),
  nooit de klok van de computer. Dan klopt elk frame van de render.
- Zet een vast versienummer van Three.js in de import.
- Draai npm run check en los op wat het meldt, voordat je zegt dat het klaar is.
- Render nog niet. Zeg me wanneer ik de preview kan bekijken.

Installeerde je HyperFrames als losse skills in plaats van als plug-in? Schrijf dan /hyperframes in plaats van /hyperframes:hyperframes.

06Bekijken en renderen

In de map van je project, in een tweede terminalvenster:

# controleert de compositie: fouten, ontbrekende bestanden, contrast van tekst
npm run check

# opent de preview in je browser; stoppen met Ctrl+C
npm run dev

# rendert naar een mp4
npx -y hyperframes@0.8.145 render . -o export/eerste-scene.mp4

Klopt iets niet in de preview, zeg dan in Claude Code wat er anders moet: "de camera moet lager", "het water is te donker". Render pas als het goed is.

Uit onze proef. Een draaiend blok van 3 seconden, staand, op een MacBook met M2: de render duurde 48,8 seconden. Daarvan was 46,4 seconden wachten, omdat het kenmerk data-no-timeline ontbrak. HyperFrames wacht dan 45 seconden op een tijdlijn die er niet komt. npm run check meldt dat vooraf, met de oplossing erbij.

07De vijf stappen uit de reel

Eén idee in Claude Code. Eén zin met wie, waar en wat er gebeurt, zoals "een poppetje vliegt in een rode sportauto over de gracht". Hoe concreter de zin, hoe minder Claude invult.
Claude schrijft de wereld en de poppetjes in Three.js. Three.js is een bibliotheek voor 3D in de browser. Een gracht is een vlak met een blauw materiaal, een huis is een blok, een hoofd is een bol. Er wordt niets gefilmd of getekend: elke vorm is een regel code.
Camera, animatie en ondertitels in een HyperFrames-compositie. Dat is een gewoon HTML-bestand met een tijdlijn. Elk onderdeel krijgt een begin en een duur (data-start, data-duration). HyperFrames geeft de 3D-scène bij elk frame de tijd door, en de scène zet de camera en de poppetjes op de plek die bij die tijd hoort.
Stem, geluid en montage in code. De stem is een audiobestand van een AI-stem. Stem, muziek en geluidseffecten staan als <audio>-clips op dezelfde tijdlijn, elk met een eigen id en starttijd. Voor ondertitels per woord maakt npx -y hyperframes@0.8.145 transcribe stem.wav een tijdcode voor elk woord. Het standaardmodel is alleen Engels; voor Nederlands zet je er --model large-v3 --language nl achter.
Eén commando rendert alles naar een mp4. HyperFrames speelt de compositie frame voor frame af in een browser zonder venster, en FFmpeg plakt de beelden en het geluid aan elkaar. Bij ons is dat npx -y hyperframes@0.8.145 render . -o export/x.mp4.

08Goed om te weten

Een 3D-scène die op de klok van de computer draait (requestAnimationFrame, Date.now()) ziet er in de preview goed uit, maar verspringt in de render. Laat Claude daarom altijd de tijd van HyperFrames gebruiken, zoals in de prompt hierboven.
HyperFrames heeft een ingebouwde stem (npx hyperframes tts, met het lokale model Kokoro-82M). Die spreekt onder meer Engels, Spaans en Frans, maar geen Nederlands. Voor een Nederlandse stem heb je een andere stemdienst nodig.
HyperFrames is gemaakt door HeyGen en staat open source op GitHub (Apache-2.0). Voor deze werkwijze heb je geen account bij HeyGen nodig: alles rendert op je eigen computer.
Gebruikt je scène toch modellen of plaatjes, zet ze dan in je projectmap. HyperFrames raadt af ze tijdens de render van internet te halen.

Ondernemer? Laat het voor je bouwen.

Webry bouwt systemen en AI-agents die werk uit je bedrijf overnemen, van leads opvolgen tot offertes klaarzetten. In een half uur aan de telefoon kijken we waar je bedrijf vastloopt en wat een werkbare volgende stap is.

Plan een gesprek

Meer van dit?

Op Instagram laten we zien wat AI nu al kan in het echte werk: tools, workflows en de links erbij.

Volg @webry.nl

Bronnen: code.claude.com/docs/en/setup (installatie en accounts van Claude Code), hyperframes.heygen.com/guides/with-claude-code (plug-in, eisen en commando's van HyperFrames), npmjs.com/package/hyperframes en github.com/heygen-com/hyperframes (versies en licentie), threejs.org/docs en threejs.org/manual, nodejs.org/en/download en ffmpeg.org/download.html. De commando's van HyperFrames 0.8.145 hebben we zelf gedraaid op 2 november 2026; de cijfers onder stap 06 komen uit die proef. Webry is niet verbonden aan Anthropic of HeyGen.