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, not filling out a booking form.

ProjectZero Station
Year2026
Concept Project Landing Page UI Design

Project at a glance

A solo concept, built to portfolio quality.

32hConcept to final screens
7Sections carrying one visual system
8Desktop screens, hero to footer
2026Desktop and mobile in Figma

Overview

TypeLanding Page
ToolFigma
Year2026

Why this exists

I kept opening gaming-club websites that all looked the same — dark theme, one neon accent, a "Book Now" button, done. None of them said anything about the actual place. So I picked a real kind of venue, a Berlin gaming club, and designed the site I'd want it to have.

It's not a client job — a solo concept, built end to end in Figma. But I treated the brief seriously: one idea has to survive the whole page, not just the hero. The floor plan reads like a deck layout. Membership tiers read like access levels. Even the footer keeps the same system-readout type as the header.

Color does most of the identity work: deep navy background, one electric blue for anything active or clickable, green reserved only for "live" status. Three colors, used consistently, instead of five accents fighting each other.

Zero Station landing page hero — dark space-station themed header with primary booking call to action

Design language

One type, one palette, one shape language

Typography, color, and geometry — the three systems everything else on the page is built from.

Zero Station UI kit — IBM Plex Mono type scale, the full color system, and core screen components (hero block, pricing access, gallery security)
Typography

Monospace type reads like a terminal, an onboard computer. One typeface across the whole site is a deliberate choice — it holds the station concept together from the headline down to the smallest technical label.

Color

The palette is built on restraint: a deep navy background creates a sense of space, accent blue directs attention, green signals status. Every color has exactly one job.

Shape

Sharp corners with one clipped edge, bottom right, reference technical drawings and industrial design.

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, not just a hero

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 shelf, not a poster wall

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. None of that survives at 375px without an actual rework, not just a squeeze.

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 already.

Membership tiers became access levels — a physical pass, not a checklist of features.

Access as a pass

Booking became a 3-step docking sequence: scan, pick a zone, confirm.

Booking flow

Bracketed labels — // 01, // 02 — and mono type carry the system-readout feeling all the way to the footer.

Typography
Why it matters

Most gaming-club sites treat pricing, booking, and the games list as three unrelated modules built by three different people at three different times. Here they're one decision, applied three times.

The facility

What you'd actually see walking in

Floor plan, real stats about the space — enough to prove this isn't a stock photo pretending to be a gaming club.

Why it's here

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 for it.

Zero Station facility section — welcome copy, key stats, and floor plan of the physical club

Zones

Not every desk is the same desk

Each zone — including the new VR deck — gets its own card instead of getting buried inside one shared floor plan.

Zero Station zone selection — cards for each gaming zone including the VR deck

Game library

Status tags instead of a poster wall

Active, queued, in maintenance — the same status language a game client uses to describe its own servers.

Zero Station game library — grid of titles with live status tags and genre labels
01

Access, not a price list

Three tiers, shown as levels you unlock instead of plans you compare line by line.

Design note

This is the one screen that's barely changed since the first sketch in the original deck — the pass-card layout was right on the first pass.

Zero Station access levels — membership tiers presented as a physical access pass
02

Three steps, one scroll

Scan, pick a zone, confirm. No separate checkout page — the whole flow reads in the same section as everything else.

Zero Station how-it-works section — three-step booking flow shown as a docking sequence

Gallery & community

Proof the room is real

Photos of the actual space next to the events strip — the part of the page keeping this from reading like a one-off mockup.

Zero Station gallery — real photos of the club's zones and setups
Zero Station community section — events and member highlights

How this compares

What's different from the default

Not a takedown of any one competitor — just the pattern I kept running into, next to what I did instead.

Typical gaming-club site

IdentityOne neon accent over a stock dark theme — hard to tell one club's site from another's.
PricingA three-column feature table you have to actually read.
BookingA generic multi-field checkout form, disconnected from the rest of the site.
MobileThe desktop layout, compressed, with the personality squeezed out first.

Zero Station

IdentityOne consistent system — navy, one blue, mono type — carried from hero to footer.
PricingAccess levels you read from the icon, not the fine print.
BookingA three-step docking sequence that stays inside the same visual language.
MobileRebuilt panel by panel so the identity survives, not just the content.

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 — just 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 — mobile still reads as the same product.

Send me a message

or download my resume