Blame game
Design systems sometimes get blamed for making products feel flat. Same buttons. Same cards. Same safe blue. But a system doesn’t remove character. It removes accidental character.
When you have the time and the opportunity you have a choice: put deliberate character back in, or release something dull.
Every simple decision the system takes care of is energy freed up for a hard one. This site’s 404 page is what I did with mine.
Alla Kholmatova calls these deliberate expressions of character signature patterns: the things that make a product recognisable even when you take away its logo. Spotify’s green and black. Transport for London’s red roundel and blue bar. Strip everything else away and you still know what you’re looking at. Signature patterns are part of the system. They can be named, agreed and built like any other pattern.
The industry often talks about “moments of delight” when discussing the little details that make an experience feel good. I have an irrational dislike of the phrase, but I believe in the idea behind it. Good design needs moments where the product has room to express a bit of personality.
So I’ve borrowed Kholmatova’s language rather than inventing another term. I’m calling these signature moments: places where good design has the room to develop a bit of personality.
The example
This site’s 404 page is a page nobody should want to visit. Which makes it a good place for a signature moment. Before I explain it, click the link if you haven’t seen it.
The numbers start as a solid 404. Move your cursor across them, they smear and distort. A spotlight appears. It reveals the outline underneath.
Click and the glyphs pull apart into an outline. Behind them, scattered dots fade in. The same dots that resolve into a neat grid on the homepage. Except here they don’t resolve. This is a page the system doesn’t recognise.
Press and hold. A black hole opens at your cursor. It starts swallowing the dots. The page explains it: “This page doesn’t exist. I think a black hole was involved!”
None of this helps you find what you were looking for and that’s fine. The link home is right there. The moment exists to be found, smiled at and maybe mentioned to someone else.
One honest caveat: I couldn’t have built this on my own. The WebGL is well beyond my skill set, so I designed the moment and used AI to get it working. The interesting part was never the code. It was deciding what the page should do, and which rules it still had to follow.
The rules underneath
Here’s the important part: the whole thing still follows the system. Almost every colour on the page comes directly from the token layer. Change the theme and the black hole changes with it. The disc at its centre uses the page-surface token, so it reads as a hole punched back into the page.
The dots are the deliberate exception. They use token-fed accents and neutrals, plus a handful of raw colours from the homepage hero’s chaos state. That’s intentional. Chaos rendered entirely in system colours wouldn’t feel like chaos.
If you’ve asked for reduced motion, either at the OS level or with the site’s own toggle, there’s no smearing, no black hole, no drifting. You get a static page that still works.
The interactive glyphs are decoration, not interface. They’re hidden from assistive technology and removed from the tab order. A screen reader gets a plain “404: page not found” heading and a link home.
No WebGL? Plain text glyphs take over. The dots also fade out around the text, so the playful layer never gets in the way of reading it. That’s the point, this doesn’t need to sit outside the system.
Where they belong
Not everywhere. This is a design decision like any other. Error pages. Empty states. Moments where the product has little else to say. These are good places for a signature moment. A registration form is not the place for a black hole.
The test I use is simple: does this feel like us? A signature moment that could be bolted onto any product is decoration. One built from your own tokens, metaphors, and visual language becomes part of the brand.
Go and get lost for a minute and see if the black hole feels like whatwhatdesign. And if you want to “make it pop” (another phrase I love to hate), go to the About page and press P.