Skip to content
CREDITS

Credit where credit is due.

This site is one person + a stack of tools + a small library of people I learn from. Naming them here so the receipts are public.

01 · FRAMEWORKS & TOOLS

What it's built on.

  • Next.js — App router, server components, the whole site sits on it.
  • React
  • TypeScript — Strict mode. Worth every red squiggle.
  • Vite — Both sibling apps (Snoek & Partners, AI-ftershow) build on Vite.
  • Tailwind CSS — Used inside the iframe games. The main site is plain CSS + tokens.
  • lucide-react — Icons, including the ones inside Snoek & Partners.
  • ffmpeg — The mastering chain on every podcast episode.
02 · MODELS & APIS

What it talks to.

  • Google Gemini — Gemini 2.5 Flash powers the Prompt Scribe exhibit and the in-game chaos engine.
  • Nano Banana (gemini-2.5-flash-image) — Image generation for the article 9:16 illustrations and the Win95 character portraits across both games.
  • gemini-3.1-flash-image — Photoreal podcast cast — the 8 episode group comps and the 6 solo cast portraits. Reference-conditioned on photographic character sheets; needs a 'fictional cast' instruction or the safety guard blocks photoreal faces.
  • Veo 2, Veo 3, Veo 3.1, Omni — Every clip in the video-models article. Subject of its own piece.
  • NotebookLM — Featured in the Interactivity article; the audio-overview pattern inspired the podcast format.
  • ElevenLabs (eleven_v3 Text-to-Dialogue) — Every synthetic voice on this site is from ElevenLabs Voice Design + the Text-to-Dialogue API. Seven recurring voices: Rutger (a clone of his own voice), Frits, Dino, Oracle, Angela, Marie, Saar.
  • Whisk — Reference-conditioned image generation. Used in the Character Sheet tutorial.
03 · THE SYNTHETIC CAST

Who you hear on the podcasts.

The recurring podcast guests are invented characters — voice, face, and personality all generated. None of them are real people. Rutger is the only real voice on the show (a clone of his own), so he's not in this list. You can meet them on the podcasts page.

  • Frits — The Nestor — A weary, brilliant Dutch creative-director archetype. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
  • Dino — The Creative Dinosaur — A senior art director who has outlasted every trend on purpose. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
  • Oracle — The Strategist — A framework-for-everything brand strategist. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
  • Angela — The Chief of Staff — The unflappable adult who keeps the operation running. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
  • Marie — The Brand Authority — The absolute authority on brand-building (Binet/Field, Ehrenberg-Bass, Ritson, Nelson-Field, BrandZ); settles brand arguments in one surgical line. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
  • Saar — The Actress — A famous screen actress following roughly none of it — wholly invented, any resemblance to a real star is coincidental. Voice: ElevenLabs Voice Design. Portrait: gemini-3.1-flash-image.
04 · BY ASSET CLASS

What you see, by what made it.

The same cut as above, organised by output instead of by tool. Per asset class: the model, the locked prompt template in the repo, and the script that owns it. Re-runnable — point a fresh checkout at the same prompts and the same outputs come back out.

  • Hero portrait cycle (6 photographic)
    Where
    / (homepage hero), /#media-kit
    Model
    Photographic — not AI-generated. Studio session.

    The site has three visual registers. This is the only one that's a real camera. Everywhere else is prompted, then chosen.

  • Article illustrations (12 × 9:16 dark)
    Where
    /business/multiplier-myth, /business/thirty-minute-kitchen, /business/agent-inclusive (4 per article, alternating sides per stage)
    Model
    Nano Banana (gemini-2.5-flash-image)
    Prompt template
    drop/article-image-prompts.md

    12 paste-ready 9:16 prompts, one per article stage.

  • Win95 character portraits (15 — 8 boardroom + 7 agent-game)
    Where
    /creative/boardroom-game (iframe), /technical/agent-game
    Model
    Nano Banana (gemini-2.5-flash-image)
    Prompt template
    scripts/generate-win95-portraits.py · STYLE_PRELUDE
    Script
    scripts/generate-win95-portraits.py

    Microsoft Bob / Encarta '95 register. Real-figure caricatures get the satirical-rename + IMAGE_OTHER guard workaround.

  • Podcast cast portraits (8 group comps + 6 solo, 1:1, photoreal)
    Where
    /podcasts
    Model
    gemini-3.1-flash-image, reference-conditioned via photographic 6-angle character sheets
    Prompt template
    scripts/generate-podcast-portraits.py · STYLE_PRELUDE + COMP_FRAMING_TEMPLATE
    Script
    scripts/generate-podcast-portraits.py

    Dark editorial photoreal register. The 6-angle sheets in drop/podcast-character-sheets/ are passed as multi-image refs at render time; --cast renders the solo tiles, --comps the group scenes (several with topical backdrops — a kitchen, an agent diagram, a slide-vs-live screen).

  • Video clips (Veo lineage — 8 in section 1 + 5 across other sections)
    Where
    /creative/video-models
    Model
    Veo 2, Veo 3, Veo 3.1 (Fast + Lite), Omni
    Prompt template
    drop/Model_Explainer/structured/ (per-section locked prompts)
    Script
    scripts/render-clip.py

    Locked prompts for each comparison clip — re-runnable end-to-end.

  • Podcast audio (11 episodes, all article companions)
    Where
    /podcasts and each article's PodcastTab
    Model
    ElevenLabs eleven_v3 Text-to-Dialogue, 6 voices
    Prompt template
    scripts/podcasts/<slug>/script.md + voices.json
    Script
    scripts/render-podcast.mjs

    Sequential dialogue from the Text-to-Dialogue API. Marie Furie's voice is used only for short interjections (locked: never solo guest, never monologue).

  • Podcast overlap layer (backchannels + laughs over the dialogue base)
    Where
    Kitchen episode (others on the roadmap)
    Model
    ffmpeg adelay + amix
    Script
    scripts/overlay-reactions.mjs

    Layered on top of the eleven_v3 base. Lesson from the first pass: laughs need a real punchline, backchannels read naturally everywhere — start with backchannels.

  • Site code (Next.js app + React server components + TypeScript)
    Where
    Every page on rutgertuit.nl
    Model
    Claude (Sonnet + Opus 4.6/4.7) via Claude Code

    Pair-programming session by session. The visible craft is in the small things — accessible breadcrumbs, OG cards per route, the 'height: auto !important' next/image fix, JSON-LD per route. Prompted, then chosen.

  • Prose (articles, FAQ answers, bios, /how-i-think entries)
    Where
    Everywhere there is text
    Model
    Drafted with Claude · edited by Rutger
    Prompt template
    docs/brand-voice-guideline.md (the Audience Test + Tuit Post structure)

    Every paragraph passes the Audience Test (Dutch CMO / Agency CEO) or gets cut. No 'AI Thought Leader' language. Personal-views disclaimer governs every page.

05 · INFRASTRUCTURE

Where it lives.

  • Google Cloud Run — Hosts the Next.js container in europe-west4.
  • Google Cloud Build — Pushes to main fire RTNLPUSH; one-step deploy.
  • Google Secret Manager — Holds the Gemini API key, bound cross-project from rutger-dml.
  • Umami (self-hosted, EU) — Cookieless, anonymous analytics — no personal data, no cross-site tracking, no consent banner. Served first-party; honors Do Not Track; aggregate data kept 12 months.
06 · OPEN-SOURCE REPOS USED

Code I pulled from.

The external GitHub repos this site was built on top of. The examples in google-gemini/cookbook in particular saved hours on the render scripts.

  • google-gemini/cookbook — Reference examples for the Veo + Nano Banana render scripts. The polling-and-download pattern in render-clip.py came straight from here.
  • googleapis/python-genai — The Python Gemini SDK used in render-clip.py and the Win95 portrait generator.
  • googleapis/js-genai (@google/genai) — JS SDK conventions for the /api/gemini server route powering the Prompt Scribe exhibit. Replaces the now-deprecated google-gemini/generative-ai-js.
  • vercel/next.js — The framework. Everything from app-router conventions to next/image lives downstream of this repo.
  • vitejs/vite — Build tool for both sibling apps (Snoek & Partners, AI-ftershow). The base-URL trick that makes the iframe game resolve under /boardroom-game/ is a Vite feature.
07 · SIBLING REPOS

Mine.

  • github.com/rutgertuit/RTNL — This site.
  • Snoek & Partners (Boardroom_Game) — Sibling repo. The Dutch ad-agency roguelite, embedded via iframe at /creative/boardroom-game.
  • AI-ftershow (DML) — Sibling app. The Prompt Scribe live exhibit was ported from here.
  • rutgertuit/Luminary — Voice-first deep-research agent. Referenced in the Interactivity article.
08 · PEOPLE I LEARN FROM

Permanent open tabs.

Four channels I keep coming back to. None of them sponsored anything here; they just kept showing up in my feed and in my thinking.

  • Two Minute Papers — What a time to be alive — Károly's been my AI-research weather report since 2017.
  • David Ondrej — Sharp on what the agentic-AI build stack actually looks like week to week.
  • Colin and Samir — Best ongoing read of the creator economy and the YouTube platform.
  • Yaro / yaroflasher — Editing craft + creator-life from someone who actually does the work.
CLOSING THANKS

And finally — to everyone using AI to do more rather than to do the same thing with fewer people. That's the part that makes this worth building.

— Rutger