A gaming club site that finally looks like something
Zero Station is a concept landing page for a Berlin gaming club. I built it around one idea: checking in should feel like docking at a space station.
In 60 seconds
A Berlin gaming club, designed as a space station
Task. Design a landing page for a gaming club in Berlin with its own character, story and visual language, so it stops looking like every other club site.
Problem. Gaming-club sites are nearly interchangeable: a template layout, neon gradients, no identity. The place itself has atmosphere. The site doesn't pass it on.
Solution. One idea that runs through the whole page: the club is a space station. Zones are its decks, membership plans are access passes, and one typeface, one palette and one shape language hold it together.
Project at a glance
The challenge
Most of these sites solve the wrong problem.
The booking flow is usually fine. What's missing is a reason to remember the site five minutes after closing the tab.
Key design challenges
One story from hero to footer
It's easy to nail a landing screen and lose the thread by the pricing table. I tested this by jumping straight to the footer: if it didn't feel like the same product, the page wasn't done.
Pricing nobody wants to read
Standard three-column pricing asks people to compare features line by line. I wanted tiers you understand from the icon alone.
A game shelf with live status
Cover art tells you nothing about whether a game is actually free to play right now.
One layout, two very different screens
The desktop version leans on side-by-side panels. At 375px they needed a real rework, since simply squeezing them would break the layout.
References
What other club sites do, and what they miss
Before drawing anything I went through gaming-club sites in Berlin and elsewhere. The same pattern kept coming up, so I wrote down what each part usually does and what I wanted instead.
Typical gaming-club site
Zero Station
Concept & identity
One type, one palette, one shape language
Typography, color and geometry: the three systems the rest of the page is built from.
Monospace type reads like a terminal on an onboard computer. I used one typeface across the whole site on purpose, so the station concept holds from the headline down to the smallest technical label.
The palette is built on restraint. The deep navy background gives a sense of space, the accent blue directs attention and green signals status.
Sharp corners with one clipped edge, bottom right, reference technical drawings and industrial design.
Design decisions
Once the concept was set, most decisions made themselves.
I didn't design the pricing table and the booking flow as separate problems. Treating the club as a station gave both an obvious shape.
Membership tiers became access levels, shown as a physical pass.
Access as a passBooking became a 3-step docking sequence: scan, pick a zone, confirm.
Booking flowZones became decks, each with its own card, so the VR deck doesn't get lost in a floor plan.
Zones as decksGames got live status tags, the way a game client shows its servers.
Live statusMost gaming-club sites treat pricing, booking and the games list as three unrelated modules, as if three different people built them at three different times. Here they come from one decision, applied three times.
Access levels
Three tiers, shown as levels you unlock. The difference is clear without comparing plans line by line.
This screen has barely changed since the first sketch in the original deck. The pass-card layout worked from the start.
Three steps, one scroll
Scan, pick a zone, confirm. There's no separate checkout page: the whole flow stays in the same section as everything else.
Not every desk is the same desk
Each zone, including the new VR deck, gets its own card, so none of them gets lost in one shared floor plan.
Status tags for every game
Active, queued, in maintenance: the same status language a game client uses for its own servers. Cover art alone doesn't tell you whether a game is free to play right now.
Screens
The page, top to bottom
The hero opens with station coordinates. The facility comes before prices: you should know what you're walking into before anyone asks you to pay.
What you'd actually see walking in
A floor plan and real stats about the space, so the club reads as a real place.
A lot of club sites jump straight to pricing. I put the facility tour first on purpose: you should know what you're walking into before anyone asks you to pay.
Proof the room is real
Photos of the actual space next to the events strip. This part keeps the page from reading like a one-off mockup.
Mobile version
Same system, stacked for one hand
Side-by-side console panels don't survive a narrow viewport. The mobile version keeps the same seven-part structure (enter, facility, zones, games, access, gallery, community), full-width and trimmed to what still reads at a glance.
Mobile adaptation notes
One panel at a time
Side-by-side console panels become full-width stacked cards, same reading order as desktop.
Zones stay scannable
Zone cards, VR deck included, keep their status tags and icons, resized for one column.
Access levels condense
Pass-style tier cards drop secondary detail but keep the level number and headline perk visible without a tap.
Typography holds the identity
Mono type and bracketed section labels carry over unchanged, so mobile still reads as the same product.
Result
One idea, carried from hero to footer in 12 hours.
Zero Station is a concept, so there are no conversion numbers. What it shows is how far one clear idea can carry a page: pricing, booking and the game list all come from the same decision.
What I'd do next
Test the access passes
Five-second tests with club regulars: can they tell the plans apart from the pass alone?
Prototype the booking
Click through the three docking steps on a phone and time how long a booking takes.
Real content
Swap placeholder photos and the game list for the club's own, with live seat availability.
Motion
A short docking animation between steps, kept under a second and off for reduced motion.
