How the river
was made to move.

01 / CONCEPT

A documentary found in the fog

Thames Mudlark treats the webpage as a licensed field record rather than a heritage brochure. The emotional spine is the moment a working river reluctantly reveals an object. Everything supports that idea: mist obscures the opening view, measurements interrupt lyrical headlines, and recovered things move from wet brown riverbed to warm museum linen. The visual language borrows from foreshore notebooks, conservation labels, tide tables and contact sheets without imitating any one historical period.

Six movements carry the record: river, working foreshore, object ledger, tide book, Mara Venn’s notebook and a finder’s promise that closes with responsibility rather than possession.

02 / SIGNATURE MECHANIC

Water that obeys a clock

In main.js, tideLoop() advances a compressed ebb and flood while updateTide() converts distance from low water into a non-linear exposure value. That value becomes --water-scale on .water-sheet, so the river withdraws with a transform instead of repeated layout. The range control is the same tide clock; dragging it interrupts the automatic cycle for six and a half seconds. At the safe middle window, the stage receives .workable, the gate opens and its finds accept input.

Each find carries a real canvas grime layer. paintMud() draws a distinct silt mound; eraseStroke() uses destination-out to turn a mouse, finger or keyboard brush into removed pixels. measureCleared() samples actual alpha coverage, so empty scribbling cannot uncover a find. The object can only be lifted after most mud over its footprint has gone.

Pass 3 makes the pointer an oblique survey lamp: the stage writes --light-x and --light-y, and .raking-light turns them into a radial sheen beneath the water. Lifting no longer erases context. The object rises away, its code stays as a grid ghost, and the matching .contact-register cell “develops.” Completing all four fixes the sheet at 06:42.

03 / ATMOSPHERE & OBJECTS

No photographs were used

The fog is layered CSS: blurred translucent ellipses drift across a desaturated gradient, while the far bank, bridge and water traces are geometric spans. A tiny inline turbulence SVG supplies paper grain without making a network request. The pipe, pin, tessera and penny are also CSS constructions using borders, pseudo-elements, nested grids and restrained drop shadows. Repeating gradients become ripples, silt, boot-mark ground and linen weave. These abstracted forms keep the site between evidence diagram and river documentary.

Motion is concentrated. One staggered load reveals the coordinates, title and invitation; chapter observers then lift only the next field record into view. The tide is the sole continuous narrative animation and stops when the document is hidden. Reduced-motion users receive an immediately workable tide, keyboard-operable brushes, a static raking light and no fog, glint or water-lap animation.