Live site 01Website · Live 3D · WebGPU2026

BodernesStrandcafé

A beach café on Bornholm. The shore runs live under the whole page, and the menu comes in as a wave of colour per course.

Open the site (opens in a new tab)bodernesstrandcafe.dk

Client
Bodernes Strandcafé, Boderne, Bornholm
Sector
Food and drink
Role
Design, 3D and development
Year
2026
Deliverables
Website in Danish, German and English, Live sea simulation, Opening hours and season, Menu from the kiosk boards, An editor the owners can use themselves, Cut-out product photos, Map and directions
Tech
three.js · WebGPU · TSL · WebGL2 · Blender · SAM 2.1 · LaMa · MET Norway · OpenStreetMap · Next.js · Sanity

The brief

I'm from Bornholm, and I've been on that beach and in that water myself a few times. The café is about 30 metres from the beach at Boderne, on the south coast. Two friends have run it since 2022, and until now you could only find it on Instagram and Facebook. A lot of their guests are German, so the site had to answer three things straight away, in three languages: are you open today, what do you serve, and how do we get there?

The approach

I wanted the site to be the beach itself, as close as I could get it to the real one at Boderne: the fine sand, the shallow clear water, and the way the waves run up and drain back. The sea on the first screen is simulated on the GPU, so it behaves like water, and you can draw in the sand. After that it's practical. Opening hours come first, worked out for today. The menu is copied from the chalkboards on the kiosk with their own photos cut out, and every word is in Danish, German and English. The owners can keep it up to date themselves, from their phones: whether they're open today, the season, the hours and the menu sit in Sanity, a headless CMS, with the editor in Danish. The page reads them when it loads, with no rebuild, and falls back to its own copy if Sanity is slow.

  1. The café's site on a phone: the beach from above, the sea running up the sand, the name in a serif.

    01 / 03

    The beach

    The shallow-water equations, solved on the GPU about 250 times a second: waves steepen over a sandbar, break, run up the sand and drain back, leaving foam. Draw a channel and the next wave fills it.

  2. Opening hours 11–18 on deep blue water, with the season and today's weather.

    02 / 03

    Open today?

    The first answer on the page: open now, opening at 11, or back on 1 July. On a windy day the owners can switch it to closed from their phones. Below it the sun's path over Boderne today with the opening hours on it, and the weather from MET Norway.

  3. The menu's crêpes course: a galette on yellow water, with its fillings listed below.

    03 / 03

    The menu

    Copied from the chalkboards on the kiosk, without prices. Their own photos, cut out; the iced latte rebuilt in Blender from a photo too small to cut. Each course comes in as a wave of its own colour.

This went way beyond what we expected. The guy’s crazy. We really just thought we needed a simple website showing where we are and when we’re open, but once we saw the first drafts, we found out how beautiful ‘simple’ can be.

Original »Det her var langt over forventning, manden er jo crazy. Vi tænkte egentlig bare vi skulle have en simpel hjemmeside som viste lokation og åbningstider, men da vi så de første udkast, fandt vi ud af, hvor smukt ‘simpel’ kan være.«

Pauk and Gab, owners of Bodernes Strandcafé
Open the sitebodernesstrandcafe.dk (opens in a new tab)

Under the hood

Measured 18 October 2026, Chrome on a MacBook Pro

Triangles a frame
99,122
The heaviest frame, every pass counted, in 10 draw calls. WebGPU, then WebGL2.
Download
4.9 MB
4.7 MB before the first frame, 2.8 MB on a phone.
Slow phone
60 fps
95 % of frames under 16.7 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 site steps down to WebGL2, then to bands of sand and sea. The case phone shows a frame of it.

Index 15 projects