Hoe ik promotievideo's maak met code, niet met editors

Hoe ik promotievideo's maak met code, niet met editors

Ik staarde drie uur lang naar mijn Adobe Premiere-tijdlijn en sleepte tekstlagen pixel voor pixel, en een gedachte sloeg me die alles veranderde: ik ben een developer. Waarom bewerk ik video's zoals een YouTuber uit 2015?

Dat was zes maanden geleden. Sindsdien heb ik meer dan een dozijn promotievideo's uitgebracht — AI-schoolpromos, portfoliodemo's, client-showcasereels — en ik heb niet één keer een traditionele video-editor geopend. Niet Premiere. Niet Final Cut. Zelfs niet CapCut. Elke video is geschreven als React-code, gerenderd vanuit mijn terminal, en in de meeste gevallen was het initiële component door Claude Code gescaffold voordat ik ook maar iets had aangeraakt.

De tool die dit mogelijk maakte is Remotion. En de workflowversneller die een steile leercurve omzette in een soepele middag is het skill-systeem van Claude Code.

Hier is het deel dat mensen nog steeds verrast wanneer ik het vertel: de video's zien er goed uit. Niet "goed voor code-gegenereerd." Echt goed. Vloeiende animaties, gebrandmerkte kleurenschema's, getimede audio, professionele overgangen.

Waarom traditionele videobewerking mijn hersens brak

Ik kan full-stack applicaties bouwen, Kubernetes-clusters configureren en security-auditrapportages schrijven. Maar vraag me een tekstanimatie te keyframen in After Effects? Mijn ogen glazen over.

Het probleem is niet complexiteit — ik ga dagelijks om met complexe systemen. Het probleem is dat traditionele videobewerking fundamenteel handmatig is. Elke wijziging is een muissleep. Elke revisie betekent werk opnieuw doen. Wil je de merkkleur wijzigen in 47 tekstelementen? Dat zijn 47 individuele klikken.

Voor een developer is dit waanzinnig. We hebben variabelen. We hebben loops. We hebben componenten die props accepteren en anders renderen op basis van data. En dan is er het versieprobleem: probeer een Adobe Premiere-projectbestand in Git te stoppen. Je kunt het niet diffen. Je kunt het niet branchen. Het is een binaire blob.

Remotion lost al deze problemen op.

Wat Remotion eigenlijk is

Remotion is een React-framework voor het programmatisch aanmaken van video's. Je schrijft React-componenten. Die componenten renderen als videoframes. Je rendert de frames naar een MP4.

De mentale omschakeling is: een video is gewoon een component die in de tijd verandert. Elke "scene" is een React-component. "Animatie" is interpolate() die frame-getallen omzet in CSS-waarden. "Timing" is de Sequence-component die bepaalt wanneer elk element verschijnt.

Als je React weet, weet je al 80% van wat je nodig hebt om met Remotion te werken.

De gotcha die me bijna deed stoppen

Hier is het deel dat niemand je waarschuwt: Remotion heeft een previewserver en een renderingsproces. De previewserver is snel. Het werkelijke renderingsproces is traag.

Mijn eerste Remotion-video was 30 seconden. De render duurde 23 minuten op mijn laptop. 23 minuten voor 30 seconden video.

Ik was klaar om het hele idee op te geven totdat ik erachter kwam: het rendert standaard op volle resolutie, volle kwaliteit, op elke kern van je machine. Je kunt de renderinstellingen aanpassen.

# Renderen met snellere instellingen voor testen
npx remotion render --scale=0.5 --jpeg-quality=50

# Volledige kwaliteitsrender voor productie
npx remotion render --scale=1 --jpeg-quality=80

Na het aanpassen van de instellingen duurden testrendering 2-3 minuten. Productierendering: 8-12 minuten voor een 60-secondenvideo op mijn machine. Acceptabel.

Hoe Claude Code dit workflow superkrachten geeft

Nieuwe videocomponenten scaffolden

Wanneer ik een nieuwe promotievideo nodig heb, begin ik niet vanaf nul. Ik beschrijf wat ik wil aan Claude Code:

Maak een Remotion-component voor een 30-seconden AI-schoolpromotievideo
met 4 secties: intro met logo-animatie, 3 feature-highlights met
slide-in-tekst, een testimonialssectie en een CTA met pulserend knopeffect.
Gebruik donker thema (#0a0a0a achtergrond) met elektrisch blauw (#00d4ff) accenten.

Claude Code genereert het volledige component — imports, animaties, sequences, timing, styling. De eerste versie is zelden perfect. Maar het is 80% daar, wat betekent dat ik mijn tijd besteed aan verfijnen in plaats van bouwen vanaf nul.

Itereren op animaties

In plaats van interpolatiewaarden handmatig aan te passen, beschrijf ik wat ik wil:

Laat de titel inschuiven van links in plaats van fade-in,
en voeg een subtiel schaaleffect toe aan de feature-iconen.
De overgang tussen secties moet een wipe-effect gebruiken.

Claude Code past het component aan, stelt de interpolate()-aanroepen bij, voegt transform-eigenschappen toe en herstructureert de Sequence-timing.

Merkspecifieke theming

Pas het kleurenschema aan voor [klantnaam] branding:
- Primaire achtergrond: #1a1a2e
- Accent: #e94560
- Tekst: #eaeaea
Vervang ook het logo-placeholder door het echte Figma-exportpad.

Claude Code doet de globale zoek-en-vervang, werkt CSS-variabelen bij en zorgt voor consistentie.

De cijfers die dit de moeite waard maken

Hier is de realistische tijdvergelijking voor een 60-secondenpromotievideo:

De toekomst van code-gedreven video

Ik heb geautomatiseerde videopijplijnen gebouwd — een blogpost invoeren, een script genereren, de Remotion-componenten scaffolden, de video renderen — allemaal geactiveerd door één commando.

Wat ik aan mijn verleden-zelf zou vertellen

Als ik terug kon gaan naar die nacht dat ik tekstlagen in Premiere sleepte, zou ik dit zeggen: je weet al hoe je video's moet maken. Je weet het alleen nog niet.

Elk React-concept dat je hebt geleerd — componenten, props, state, compositie, interpolatie — komt direct overeen met videoproductie. Het enige verschil is het uitvoerformaat: in plaats van pixels op een scherm, krijg je frames in een videobestand.

Mijn uitdaging: kies één ding waarvoor je een video nodig hebt. Stel een Remotion-project in, beschrijf wat je wilt aan Claude Code en render het. Het hele proces — setup tot definitieve MP4 — duurt minder dan een middag.

En ik garandeer dat je Premiere Pro nooit meer hetzelfde zal bekijken.