The RiteReal-time WebGL spellcraft
01THE VOID
Nothing issummoned from nothing.
Embers first. Every rite begins by proving the air can hold a spark at all.
02THE CIRCLE
Draw thebinding.
A circle is not decoration. It is the boundary that tells the working where to stop.
03THE CALLING
Pull itinward.
Ten thousand motes fall toward one point, and the closer they get, the faster they turn.
04THE CORE
Give ita world.
The heart of it is the real one: today's satellite imagery, lit from wherever the sun actually is.
05THE ORRERY
Set the ringsturning.
Three bands lock onto three axes. The arcs between them are the engine talking to itself.
06IGNITION
The SigilEngine.
Drawn live in the browser: eleven shaders, one scroll position, and a planet that knows what time it is.
WHAT YOU JUST SCROLLED THROUGH
One number, six acts,and no video anywhere.
Every frame of that is drawn live on your GPU. There is no clip playing behind the text — the embers, the binding circle, the six thousand motes falling inward, the shell of shards, the three bands and the discharge between them are all computed from a single value: how far down the page you are.
The planet inside it is the only thing that is not maths. That is a real global mosaic assembled from the last day of satellite passes — today's weather, today's ice — and it is lit from the direction the sun is actually in, computed from the clock. The daylight you can see falling across it is falling on the countries where it is currently daytime.
The blue marker pulsing on it is you — or near enough. That position comes from the coarse, city-level location the CDN worked out from your connection while it was routing this page to you, so nothing was asked for and nothing new was collected. The browser can give a far more precise answer, but only behind a permission prompt, and a decoration is not a good reason to ask anyone for their exact coordinates. It is read, drawn, and forgotten.
That is the reason it scrubs. Drag the bar back up and the rite runs in reverse, exactly, because nothing in the scene remembers anything. State is a function of scroll position, not a pile of things that happened.
- RENDERERthree.js r183 · WebGL2
- SHADINGhand-written GLSL, 11 programs
- PARTICLES6,900 GPU-positioned points
- EARTHNASA VIIRS daily mosaic, refreshed every 6h
- SUNsubsolar point from UTC, ±0.2° accurate
- COLOURfitted visible spectrum, not a hue wheel
- POST4× MSAA, HDR bloom, spectral grade
- INPUTscroll position — that is all