Smerghain
A website for an absurd day rave: for visitors who need to feel what it is within seconds, and for the client who adds new editions herself without touching a single line of code.
Berghain, but a little bit filthier.
Smerghain is a day rave where perfection, productivity and your phone simply don't exist for a while.
The first edition sold out in no time, so the client wanted to turn it into a recurring event. That called for a website of its own: one that shows at a glance what Smerghain is and gets visitors to the next edition and the tickets as fast as possible. And one the client can keep up to date herself, without a single line of code.
Until then, Smerghain only existed on Instagram. Someone who gets a story forwarded has just a few seconds to understand: what is this, when is it, and how do I get in?
Four jobs for one website.
Show what Smerghain is
The feel of the event had to live in the imagery, colours, typography and copy, not just in an explanation.
List all upcoming editions
The next edition and the ones after it.
Make contact easy
With the organisers, by email and Instagram.
Be self-manageable
The client isn't a web designer and doesn't work with code, but still needs to add new editions herself.
Ticket sales didn't need to be on the site (yet): they run through the venue. The ticket buttons link straight there.
Two users, very different needs.
I designed for two users: the visitor on the front end, and the client behind the scenes.
Partygoers aged roughly 20 to 35 who discover Smerghain through Instagram or friends. They don't want a long story; they want to feel the vibe and decide whether they want to be there.
- understand within seconds what kind of party this is
- see when and where the next edition is
- get to the tickets in one tap
- find the house rules (costumes mandatory, phone in your pocket)
She organises the events and runs the socials, but has no experience with websites or code.
- add a new edition herself, without having to call the designer
- trust that it will look right on the site straight away
- only need a designer for bigger changes
Capturing the vibe.
Together with the client, I started by defining the atmosphere. The moodboard revolves around two themes: Chaotic Barbie and Absurd Imagery.
Famous figures and icons in places they don't belong, like the Pope behind the decks or Darth Vader on the toilet. That became the basis for the visual language: recognisable, absurd and a little bit wrong.
From feeling to system.
I translated the moodboard into a style guide, so everything made afterwards (website, posts, posters) feels the same.
Colour
A warm palette of Smerghain red, rust, orange and amber on ink black and anthracite grey. One colour is deliberately reserved for action: CTA orange is used only for buttons, so you always know where to click.
Typography
Coolvetica for headings (heavy, tight, loud) against Special Elite, a typewriter face, for body copy. The contrast between poster and "dirty typed note" matches Smerghain's character.
Logo and buttons.
Logo
Four logo variants: horizontal and stacked, both also with depth. That way the logo works in a narrow menu bar as well as large in the hero. Plus a profile picture for Instagram, so socials and site feel like one.
Buttons
A filled button for the main action and an outline variant for secondary actions. The copy sets the tone straight away: "KLIK OP DIE KNOP DAN" ("just click the button, then"). On the site, that became for example "Haal kaartje dan" ("go get a ticket, then").
What comes first?
The order of the homepage follows the questions a new visitor has.
- HeroVideo and the headline "Absurde raves": instant atmosphere, with a single button to view the agenda.
- Next edition and Why SmerghainRight below the hero: the next event with date, time and status (such as "sold out"), next to a short explanation of why your phone stays in your pocket.
- Events and event pageAll upcoming editions at a glance. Every event page has one clear button to the venue's ticket sales: "Haal kaartje dan".
- ContactEmail and Instagram, with honest expectations: "no phone calls, emails get answered within a few days".
Deeper content lives on separate pages: About us (the manifesto) and the house rules. That keeps the homepage short for people who just want the date, while anyone curious can click through.
Building with Claude.
I built the website with Claude Design and Claude Code. I used the style guide and structure as the starting point and refined the result step by step: spacing, buttons, mobile behaviour. That let me see right away on a real phone what worked and what didn't.
Another advantage: we fully own the code. That meant I could host the site myself via GitHub and Cloudflare, which is a lot cheaper than a platform like Framer or Squarespace.
Adding events via Sanity.
A website only I can update makes the client dependent on me for every new date. So I built in a Sanity integration: a user-friendly dashboard where she logs in and adds an event by filling in a simple form. Each field has a short explanation, for example that the date also determines which event shows up as "next" on the homepage.
As soon as she publishes, the event appears on the site automatically, in the right style and in the right place. The design of the event card is fixed, so however she fills it in, it always fits the brand.
Feedback and iteration.
The client's most important feedback was about the tone of voice: it had to be just as direct, absurd and crude as on her socials. The first version was still too polite.
So I rewrote all the copy, from buttons to error messages: "Boeie" ("whatever"), a kiss from Jeroen as punishment in the house rules, "Follow us on Instagram, that's where we say it first". That tone now runs through the whole site.
When I then tested the site on my phone, I noticed the navigation didn't work well there. So on mobile I replaced it with a hamburger menu, keeping the screen free for the vibe and the agenda.