Kavaliero Systems is our line for digital protection and remote oversight. Its website opens on three steel rings turning around a plate that never moves. This is the same instrument as a line drawing.
- Project type
- Kavaliero's own line
- What we did
- Design, build and 3D in code
- Scope
- Six solutions in two languages
- Status
- Live since October 2026
It keeps what you recognise and changes what it is made of.
Systems sells something else to a different reader: digital protection and remote oversight, where this site sells websites, platforms and automation. So it has a site of its own, not a section of this one. From here it keeps three colours, the knight, the red full stop and the clock of the page transition.
What stays.
The three colours are the same, value for value: bone, ink and a single red. The knight is still in the header, and every title closes on a red full stop larger than its type. Between pages the screen is covered in 0.42 seconds and uncovered in 0.54, as it is here, but what crosses it is a slanted sheet of glass, not a curtain of pixels.
Steel, chrome, glass and paper.
Where this site uses ice and pixels, Systems uses the stuff of a workshop: a wing of jointed steel, chrome objects, a glass header and a paper ground. The grid stays on show, each dashed rule strung between two red squares six pixels wide. The typeface is different too, a single family with a width axis.
The plate does not move.
The instrument on its first screen is drawn in WebGL 2 with no library, from geometry generated in code. A mouse can roll the rings and they keep the spin; the plate does not answer. On the way down the rings come level and pass out of sight, and the plate is set down as the dark panel of the next section.
One object per solution.
Each of the six solutions is explained by a single object that stays on screen for the whole page. On the audit page a pick works along a padlock's pins and the weak ones turn red. On the resilient-website page a hanging bulb puts the whole page out, and the saved catalogue stays lit. None of them is a downloaded model: they are built in code when the page opens.
The same three colours, value for value
A glass transition on this site's clock
The instrument in WebGL 2, no library
Six 3D objects modelled in code
The phone screen is the page's own text
Words are triggered, never tied to the scroll
Language lives in the address, no cookie
Every example screen is labelled as one