← Back to all work
Web Design Hospitality Pool Hall Bespoke Booking

The Break Room

A modern, video-led website for an Ashford pool hall — built around a custom booking system that surfaces busy and quiet periods in real time, with a companion-app integration, full-bleed video hero, gallery and contact form. Hand-coded, mobile-first, no templates.

Visit the live site
ClientThe Break Room, Ashford
SectorHospitality & sport
ServicesWeb design, custom booking, app integration
Build typeCustom — no template, no plugins
StackHTML/CSS/JS, Firebase, MP4 + HLS, Lightbox
StatusLive
Live
Real-time busy periods
<1.5s
First load on 4G
100%
Mobile-first build
0
Plugins or page builders

The brief

The Break Room is a new kind of pool hall in Ashford — a venue that wants to feel closer to a craft cocktail bar than a smoky back-street club. They came to us with a clear ask: a website that feels like the place. Cinematic, modern, atmospheric. Something that does the venue justice the moment a stranger lands on the home page.

Underneath the visuals, they had three practical problems to solve. Customers were turning up to find every table booked. Other nights the room was empty because nobody knew it was a quiet shift. And they had a King of the Club companion app for serious players that they wanted seamlessly integrated into the website experience.

How we approached it

We treated this as a bespoke web design project from the ground up — no template, no page builder, no compromises. Every section was designed in Figma against real venue photography and signed off before a line of code was written.

The cinematic video hero was the anchor: full-bleed, autoplaying, muted by default, with a layered colour grade that pulls the venue's blacks and neon highlights to the surface. From there the page tells a quick visual story — the room, the bar, the tables, the league nights — before dropping into the booking flow.

The booking system itself is a hand-built component talking to a Firebase backend. Slot availability is recomputed live as bookings come in, and the customer never sees a "fully booked" page without an alternative — instead they see a heatmap of the week ahead and a one-tap nudge to a quieter slot.

Inside the build

Six things that make it more than a brochure

Everything on this site exists to do a job — get the customer to the right table, on the right night, with the least friction possible.

Bespoke Booking System

Hand-coded, no third-party widget. Customers pick a date, time and table size in three taps; staff get the booking in real time on a single dashboard.

Live Busy-Period Heatmap

The booking flow shows the room's actual busyness across the next seven days, hour by hour. Customers see which slots are buzzing and which are quiet — and self-select the night that fits them.

App Integration

Deep-links straight into the King of the Club companion app for serious players — challenges, league standings, drinks-to-table, all one tap from the website.

Cinematic Video Hero

Full-bleed autoplay video, colour-graded for the venue. Optimised at multiple bitrates, served via HLS where supported, with a hand-picked still as a fallback for slow connections.

Curated Photo Gallery

A swipe-friendly gallery of the room, the bar, the league nights and the regulars. Lightbox view, lazy-loaded so the page stays fast.

Contact & Enquiries Form

For private hire, league sign-ups and general questions. Spam-protected, instantly emailed to the team, with a "we'll reply within 24 hours" promise.

The live busyness heatmap

A snapshot of the booking widget — yellow gets busier, dim cells are quieter slots ripe for grabbing.

Quieter Busier
Under the hood

The tech stack

Picked piece by piece for speed, control, and a build the team can grow with — no plugin sprawl, no template ceiling.

Front-end
HTML, CSS & JS

Hand-coded vanilla. No framework tax, no build pipeline weight — a fast, focused single-page experience that loads in under 1.5s on 4G.

Backend
Firebase

Authentication, Firestore for live booking data, hosting and Cloud Functions. Slot availability and busy data update in real time.

Video
MP4 + HLS

Multi-bitrate adaptive streaming where supported, with a hand-picked still as a graceful fallback for low-bandwidth connections.

Booking UI
Custom Heatmap

A bespoke 7-day × hourly grid driven by Firestore listeners. Re-renders in real time as bookings land — no refresh, no widget.

App Bridge
Deep Links

Universal links straight into the King of the Club companion app — challenges, leagues, and drinks-to-table opened with one tap.

Forms
Cloud Function + reCAPTCHA

Spam-filtered enquiries fire as transactional emails to the venue team and into Firestore for follow-up. Sub-second submission.

"A pool hall with a full-bleed video hero and a real-time busy heatmap shouldn't load in 1.5 seconds. We got obsessive about every byte. It does."

— Onimo

The outcome

The Break Room launched with a website that does the room justice on a phone, a tablet, or a wide-screen above the bar. Bookings now flow through one system instead of three. The heatmap quietly redistributes demand — quiet midweek slots fill faster than they ever did because customers can see they're available.

Because the front-end is hand-coded and the backend is on Firebase, the whole thing loads in under 1.5 seconds on 4G in Ashford and scales without anyone touching it. New features — private hire pages, league night sign-ups, gift vouchers — ship in days, not weeks.

If you've got a venue that needs a website that feels like the place, plus the engineering to back it up, take a look at our web design service, our web app builds, or just drop us a line.

Next case study →

King of the Club

The members-only platform powering pool players inside The Break Room — challenges, leagues, drinks-to-table, all in a hand-built progressive web app.

Got an idea like this?

Let's build something custom.

If you've got a venue, a product idea, or a website that needs to do more than just sit there — book a call. We'll tell you honestly whether we're the right partner.

Start a Project