wireframe-portal-title

Extruded wireframe letterforms are built from the bundled Geist face with a TTF loader and polygon offsetting, then revealed through a portal burst whose chaos is a variable. … A second beat swaps the letters into a replacement phrase with whole-word wrapping and auto type size, staggered with a tunable easing curve and settle glitch, with optional depth fog.

["wpt-three", "wpt-warp"].forEach(function (id) { var canvas = document.createElement("canvas"); canvas.id = id; canvas.width = 1920; canvas.height = 1080;

const measure = document.createElement("canvas").getContext("2d"); measure.font = "700 176px Geist"; const tracking = 176 * 0.03; const advance = (char) => measure.measureText(char).width + tracking;

const ttfBuffer = await fetch(assetUrl("assets/fonts/Geist-Bold.ttf")).then((r) => r.arrayBuffer(), ); const font = new FontLoader().parse(new TTFLoader().parse(ttfBuffer));

// ---------- seeded PRNG (replaces the experiment's Math.random) ---------- … const rand = mulberry32(20260824); const phraseRand = mulberry32(20260831);

The portal is closed at t=0 and draws nothing, so the first real draw would link every shader mid-playback. Draw across the timeline and flush the GPU

One paused GSAP timeline registered as `window.__timelines["wireframe-portal-title"]`. … Re-syncs on the `hf-seek` CustomEvent; every frame is a closed-form function of time (seeded PRNG only, no rAF loops, no Date.now).