MurermesterMagnus
A Copenhagen mason. The whole page is a white-painted brick wall at real size in low sun, and every block of text gets troweled on as you reach it.
Open the site (opens in a new tab)murermester-magnus.dk
- Client
- Murermester Magnus ApS, Copenhagen
- Sector
- Construction
- Role
- Design, 3D and development
- Year
- 2026
- Deliverables
- Website, Live brick wall, Service details, Wet-room cutaway, Quote request form, An editor the owner can use themselves
- Tech
- three.js · WebGL2 · GLSL · Next.js · Sanity
The brief
Murermester Magnus is a Copenhagen mason with more than fifteen years in the trade. Most of the good work is stuff a customer never gets to check: the joints in a wall, the layers under a bathroom floor. The old site ran on stock photos, so none of that came across. The new one had to show the craft and get people to call or ask for a quote.
The approach
Their own tagline is Danish masonry with a focus on detail, so I took it literally. The whole page is a brick wall at real size, painted white like the city's old brick houses and standing in low sun behind a street tree, and every block of text is a patch of lime render that gets troweled on when you scroll to it. The cursor is a work lamp that rakes light across the joints, the way a mason checks them. The old site had a page for each service; here each one opens in place with what it covers and how a job runs, and bathrooms and facades keep the old site's stock photos. Further down, a bathroom floor comes apart into its five layers, and three customers say what it was like. The firm can keep it all up to date from a phone: the number, email and address, the five services and their photos, and the customers' words sit in Sanity, a headless CMS, with the editor in Danish. The page reads them when it loads, with no rebuild, and keeps its own copy if Sanity is slow.

01 / 05
The wall
Bricks of 228 × 108 × 54 mm with 12 mm joints in running bond, painted white, at their real size on your screen, so a phone shows about a metre of wall. The first screen gets laid course by course, then each block of text is troweled on in render as you reach it. The lamp follows the pointer, a hand's breadth off the wall.

02 / 05
Every service, in full
Five services, the way the old site had five pages, without leaving this one. Point at one, or tap it on a phone, and it opens with what it covers and how a job runs, in their own words, with the old site's stock photos for bathrooms and facades. Bathrooms are their speciality, so that one leads on to the floor below.

03 / 05
What you pay for
Tiles, adhesive, membrane, a screed laid to fall and the concrete deck. Lift out any layer, or look at how the clamping ring holds the membrane in the drain and which way the water runs.

04 / 05
In their customers' words
A bathroom, a facade and a doorway closed up, each customer's words on a patch of render of its own, first names only.

05 / 05
Get a quote
The form asks what the job is and when it should start, promises an answer within 24 hours and opens as an email to them.
- Copy and facts: Murermester Magnus
- Stock photos in the service details: Pexels and Pixabay
Under the hood
Measured 18 October 2026, Chrome on a MacBook Pro
- Triangles a frame
- 454,146
- The heaviest frame, every pass counted, in 97 draw calls. WebGL2.
- Download
- 2.0 MB
- 1.6 MB before the first frame, 2.4 MB on a phone.
- Slow phone
- 60 fps
- 95 % of frames under 16.8 ms, on a phone screen with the CPU slowed four times. There the case shows a film of the site.
- If 3D can't run
- The wall drawn in CSS, with the services as plain cards. The phone number works the same.