A Bauhaus machine poster that actually runs
A Bauhaus machine poster that actually runs: the advisory career as a gear train — four meshing gears, one drive, cranked by scroll. Geometry, flat primaries and mechanical truth: every ratio on the page is real gear maths from visible tooth counts, and every number engraved on a rim is a real product number.
Warm poster paper, black structure, pure primaries used flat. Red is owned by structure — rules, kickers, the start switch. Blue and yellow serve as poster blocks. The four product colours appear only as small hub dots on the gears.
#2dd4bf
Pick a Time #7aa2ff
ActivityTracker #ff6b3d
FourLens #b79bff
Four products, one per function of an advisory business, meshed in the order a career runs.
3,684 questions · 9 papers · 104 chapters
The gear train. Four SVG gears — Z 24, 32, 20, 28, one per product — generated parametrically in code with involute-ish tooth flanks, placed so pitch circles are exactly tangent, and phase-solved so teeth genuinely mesh. Scroll drives the first gear; the rest follow by the coupling law, so all motion on the page is mechanically true, not choreographed to look true.
Why: Advisor OS sells sequence — get licensed, fill the calendar, do the work, read the room. A gear train is the one image where order, coupling and honest ratios are the same thing. Each product's real numbers are engraved on its rim; its price is stamped on the static hub cap; its colour appears only as hub dots.
Tooth outlines built in code from module and tooth count: quadratic Bézier flanks through the pitch circle, arc tips and roots. No drawn assets anywhere on the site — every image is SVG or CSS.
ω₂ = −ω₁·z₁/z₂ chained across the train, plus a mesh-phase solver that aligns each follower's tooth gap to its driver's nearest tooth along the centre line.
Scroll position cranks the master angle; scroll velocity charges a flywheel that decays over a second or two to a slow constant idle, so the machine never quite stops.
A sticky full-viewport stage over a 540vh track, with GSAP ScrollTrigger progress scrubbing the framing: each product's gear is translated and scaled to the visual centre while its spec panel holds, on straight tracks with mechanical timing.
Archivo Black at clamp(58px, 10.4vw, 152px) against 11px tracked caps; ruled bars, index numerals and a colophon as poster furniture; one 12° rotated baseline moment in the hero.
Each gear's real product numbers repeat around a circular text path inside the rotating group, so the facts physically turn with the machine.
prefers-reduced-motion (or a failed library load) swaps the whole mechanism for a static pose: full train at a handsome angle, panels laid out in flow, drift off. overflow-x: clip on html and body keeps transient transforms from widening phones.