Workshop

Not a portfolio. A workbench.

What was built to build this site.

1. 

   

   001/ 2026WebGL2 · shaderbuilt

   Light field

   Three bands of light on one axis, one hard edge, grain against banding — computed instead of loaded: no third-party code, no texture, no file.

   The same surface in two versions, light and dark; on the start page it stands in the title image, under two guiding lines and behind the contact card. It is drawn only while in view; with reduced motion a single frame stands still.

   

   Evidencescratchpad/hero_shader/hero.frag · public/hero.js
2. 01 Build passed 02 Completeness passed 03 Nothing private in the upload passed 04 No third-party call passed 05 No embedded style block passed 06 Markers and legal texts passed 07 No inline script in the built output passed 08 No unsafe-inline in script-src passed

   002/ 2026Build checkbuilt

   The build stops

   Eight steps on the built output, not on the source: completeness, nothing private, no third-party call, no style block, no markers, no inline script, no unsafe-inline. If one fails, nothing goes online.

   In addition, scripts/messwerte.mjs recomputes the six figures of the start page from their sources after every build. If one no longer matches, the build aborts — a wrong number cannot go live, it can only stop the build.

   Evidencescripts/pruefen.sh · scripts/messwerte.mjs
3. Content-Security-Policy: default-src 'none' script-src 'self' style-src 'self' 'unsafe-inline' style-src-elem 'self' style-src-attr 'unsafe-inline' img-src 'self' media-src 'self' font-src 'self' connect-src 'none' base-uri 'none' form-action 'none' frame-ancestors 'none'

   003/ 2026Buildbuilt

   Shipping Next without React

   This site is built with Next and arrives without React: entkernen.mjs removes the bundle, the flight stream and every inline block from out/ after the build. What remains is HTML, CSS, one typeface and three scripts of our own.

   That is why the content security policy stays at script-src 'self' — no hashes, no unsafe-inline — and the browser enforces what the privacy policy promises. The step aborts as soon as a “use client” appears anywhere.

   Evidencescripts/entkernen.mjs · scripts/csp-hashes.mjs · public/.htaccess
4. 

   004/ 2026Filmbuilt

   A trailer made of HTML

   The Amtsorakel trailer is an HTML page that computes every frame from its second. Chrome delivers the frames over the DevTools protocol, AVFoundation assembles them into H.264 — no Puppeteer, no ffmpeg.

   The letters are DIN 5008 documents drawn from bars, the phone a device made of gradients with real Amtsorakel screens; Knicks, the letter sheet, is the Amtsorakel character. On the start page the cut runs silently in the project card.

   Evidencescratchpad/trailer-li/film_bauen.py · cdp.mjs · bilder.mjs · video.swift
5. waiting

   005/ 2026Brandwaiting

   The mark

   What was discarded on the way to “Versatz”, and why: a broken ring reads as a loading indicator, a dot grid as an app launcher. To follow.

   Evidencehexese-brand/CI.md · hexese-brand/auswahl-09-2026/LIESMICH.md
6. waiting

   006/ 2026SVG · filmwaiting

   An explainer without a video file

   The explainer on amtsorakel.de is an SVG stage with a timeline: eleven scenes, subtitles in ten languages, no video file. To follow.

   Evidenceamtsorakel/next-website/src/components/Erklaerfilm.tsx · public/film.js
7. waiting

   007/ 2026Soundwaiting

   The voice chain

   How a recording is split at its pauses and laid sentence by sentence onto the cuts. To follow once the track is in place.

   Evidencescratchpad/trailer-li/vorschau.py