Construction
A cinematic construction-group template with a scroll-built 3D tower.
- Client
- Atelier templates
- Sector
- Monolith · construction template
- Year
- 2026
- Reference
- No. 10
Scope
- Template product design
- WebGL scroll cinema
- Interactive 3D district
- Drawing-set motion
Stack
Ref 10 · interface preview
Overview
Monolith is the construction/engineering template: a dark site that reads like a set of construction documents coming to life — DIN-condensed headlines, mono spec readouts, and colour that encodes state (blueprint blue for the unbuilt, safety orange for work in progress, warm light for the delivered).
Its signature is a procedural WebGL tower that erects itself across a 500vh scroll — blueprint ghost to structural steel to slip-form core to curtain-wall glass, delivered at dusk with windows waking floor by floor — plus an interactive city-model portfolio you can orbit and enter.
The challenge
Conveying the scale and rigour of a construction group on the web without stock site photos, while keeping a heavy 3D experience performant and reduced-motion friendly.
The approach
- 01
A crane-dolly WebGL build sequence over 500vh and an interactive district — drag to orbit, toggle day/night, enter any building for its dossier — every canvas sleeping when offscreen.
- 02
A drawing-set motion language: state-encoded colour, a pinned cross-section that draws itself through eight delivery phases, and velocity-reactive discipline marquees.
- 03
Config-driven content and the shared @atelier/core foundation, with reduced-motion and offscreen-sleep budgets on every effect.
Outcomes
500vh
scroll erects the tower, dawn to dusk
0
3D model files — every mesh is procedural
8
delivery phases in the method section
Next case · Ref 01
Light Edition