Field 404
A 404 on a sheet of lost steel filings. As the visitor moves, a field-strength readout climbs and the iron slowly finds 404. The copy owns the joke; two plain links lead out.
Built with Filings
What it is for
Turn a dead end into a small experiment: the missing page is admitted plainly, the way home is one click away, and the visitor who lingers is rewarded with a field that comes up under their hand and a number written in iron.
Everything you set here is what the Code and Prompt tabs give you.
Seats open in 11 days. Want one email that morning?
Datasheet
- Mechanism
- Pattern found by movement, Field strength readout, Polite threshold announcements, Scrim framing, Layout aware word placement, Container query recomposition
- Stack
- Vanilla ES modules, CSS, WebGL2, Canvas 2D
- Needs
- Filings
- States
- 8 documented
- Version
- 0.1.0
- Licence
- With a Pass
States
- LostOn arrival the iron is an even scatter, the magnet is off, the readout reads 0.00 T and asks the visitor to move across the sheet.
- FindingThe level rises with the pointer's travel (two section widths find it) and, from two seconds on screen, slowly on its own; it only ever rises, in twenty-fifths; the iron swings and drifts toward the number; the pointer is a magnet too.
- Find it for meA text button runs the same climb in about a second and a half and taps the middle of the sheet.
- Found404 stands in iron; the readout shows the full field, the note says the found line, the status dot turns pale, the button and the timer go, the sheet sleeps.
- PaletteNight: steel filings on black with a vermilion mark. Brass: brass filings on warm black.
- Tablet and phoneUnder 900px the sheet becomes a band of its own under the masthead with the number centred in it, the readout becomes its caption, and the copy and the ways out follow on solid ground; under 560px the masthead stacks and the home button goes full width.
- Reduced motionFound on the first paint; nothing moves, no timer, no button. Every word is present.
- Off screenThe timer and the sheet pause.
Notes
Original composition, deliberately unlike Pin 404 (a light page and a framed board): here the sheet is the whole dark ground and the number is found, not pressed. Coilhouse and its copy are invented. Faces: Young Serif and Red Hat Mono (SIL OFL 1.1) as WOFF2, licences beside them.
Anatomy
Pattern found by movement, Field strength readout, Polite threshold announcements, Scrim framing, Layout aware word placement, Container query recomposition
Usage notes
Turn a dead end into a small experiment: the missing page is admitted plainly, the way home is one click away, and the visitor who lingers is rewarded with a field that comes up under their hand and a number written in iron.
Options
| Option | Type | Description |
|---|---|---|
| site | text | The small wordmark, linking home. |
| code | text | Label |
| title | text | Headline |
| wit | text | The explanation |
| path | text | Empty shows the real address the visitor asked for. |
| home | text | Button |
| homeHref | text | Button link |
| alt | text | Second link |
| altHref | text | Second link, address |
| found | text | When the pattern is found |
| palette | enum | Night: steel filings on black, a vermilion mark. Brass: brass filings on warm black. |
| tesla | number | What the readout shows once the pattern is found. |
| light | number | Light from (degrees) |
Methods
- update
- level
- sheet
- root
- destroy
How it works
Original composition, deliberately unlike Pin 404 (a light page and a framed board): here the sheet is the whole dark ground and the number is found, not pressed. Coilhouse and its copy are invented.