02 / WorkWebGL product · brand identity2026

Horisont

A field guide to a black hole for a Copenhagen observatory, drawn live in the browser, and the identity built from the ring of light round it.

Client
Self-initiated
Sector
Culture and science
Role
Product design, WebGL development, brand identity
Deliverables
Field guide (live WebGL), Identity, Specimen cards, Tickets, Wayfinding
Tech
WebGL · GLSL · three.js · React · GSAP · SVG
Year
2026

The brief

A new observatory in Copenhagen needs an identity, and a way for visitors to understand what they came to see before the dome goes dark.

The approach

The flagship product is a field guide to a black hole that runs live in any browser: twelve things you'll see in the show, marked on a black hole whose light is bent by gravity for every pixel. It is on this page. The identity comes from the one thing a black hole can't hide, the ring of light round it, which became the mark, the ticket and the signs.

01 · The product

A field guide to a black hole.

Visitors meet the show before they come: twelve things they'll see, marked on a black hole drawn live in the browser, light bent by gravity for every pixel. Scroll to fall past them all.

02 · How it runs

One shader. No video.

03 · The mark

The one thing a black hole can't hide.

A black hole gives off no light, but the light round it gives it away: a thin ring, brighter on the side that turns towards you, crossed by the glowing disk seen edge-on. That is the mark, drawn in two strokes.

  1. The photon ringLight that has circled the hole once before it escapes.
  2. Brighter on the leftThe disk turns towards you on that side, so its light is boosted. The stroke fades as it goes round.
  3. The disk, edge-onA single line, slightly bent, the way the render bends it.

04 · Colour and type

Space, starlight and the two shifts.

HorisontInstrument Serif for names and headlines: the calm of an old observatory.

Beyond the horizonInstrument Sans for everything you read in the dark: times, directions, seats.

05 · Specimen cards

Twelve cards to take home.

One card for each specimen in the guide, printed on black stock, the image cut from the same render.

Light04 / 12

Photon ring

Light that has circled the hole once before escaping to you.

Light02 / 12

Gravitational lensing

The far side of the disk, behind the hole, is bent over the top and under the bottom by gravity.

Matter09 / 12

Jets

Magnetic fields can launch narrow jets of plasma from the poles at nearly the speed of light, reaching far beyond the galaxy..

06 · In the building

Tickets and signs for the dark.

Beyond the horizon

Show
20:00
Row
7
Seat
12
Kuplen · 07 · 12

Kuplen ↑

Teleskopet →

Garderobe ←

Under the hood

Measured 18 October 2026, Chrome on a MacBook Pro

Triangles a frame
13
None of it is modelled: the black hole is ray-traced per pixel, in 13 passes of one triangle each. WebGL2.
Download
2.0 MB
0.8 MB before the first frame, 1.0 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.
If 3D can't run
A still of the black hole behind the page. The field guide reads the same.

Outtakes

What I tried and dropped, and why.

  1. Until 28 Sep

    The black hole as the homepage

    It was the most striking thing on the site and said nothing about work for a client. It became a product with one: an observatory's field guide.

Index 15 projects