InterLAB
InterLABdigital studio
Menu
HomeWorkServicesNews2Contact
About
WhatsAppTelegram
Log in
InterLABdigital studio
Menu
HomeWorkServicesNews2Contact
About
WhatsAppTelegram
Log in
InterLAB
Log in
Case · Flagship · interaction and motion

Крем Coffee Coffee that wakes the city.

A flagship case for a specialty coffee shop: the signature cup leads the guest through the whole site as they scroll, and the recipe of the house raf is taken apart in a video the scroll controls. Editorial serif type instead of the usual grotesque, glass panels with a warm glow, an 18-item menu driven by a single file. Design, code and visuals by InterLAB. The coffee shop is fictional; this is a showcase of the approach.

Open the live demo ↗hover the cloud — the points gather

point cloud · takeaway cup

interlab-demos.vercel.app/v3/cafe
Open the live demo ↗

this isn't a screenshot — that's the real site in the frame · hover to straighten it

Problem → Solution

the pain in this niche

There are plenty of coffee shops — few are remembered

A specialty coffee shop sells taste and ritual, but online it looks like all the rest: a couple of Instagram photos, a menu as an image, orders through DMs. There's nothing for a guest to hold on to — so they pick whatever is closest to home rather than whatever tastes better.

the solution

Show the product, don't describe it

Instead of stock shots, the cup itself: pinned to the screen, living with the scroll, turning and opening. The house raf isn't described in words but taken apart into layers in a video the scroll drives: foam, cream, caramel, double espresso. The guest understands what they're paying for before the first sip.

Design System

Palette, type pairing, stack. One niche — one system.

Coffee that wakes the city

Prata is a high-contrast serif with full Cyrillic support: the serifs and hairlines give it an editorial character. Onest is a neutral grotesque for body copy. Contrast comes from the serifs, not from width.

Prata · headingsOnest · body
  • --bg#572a14terracotta
  • --surface#6d3a1droast
  • --ink#f5ecddcream
  • --accent#f2a43cgold
  • --accent-2#ff6a1fcrema orange

stack

Next.js 16Tailwind 4MotionScroll-videoffmpeg
UX decisions / 4

Why it's built this way

The product instead of stock photography

01

The signature cup is pinned to the screen and lives with the scroll: it turns, moves to the edge, opens into a raf. The guest is looking at the actual product rather than someone else's photos from a stock library.

scroll-choreography

The drink taken apart in a video the scroll controls

02

The raf recipe isn't described in words but separated into layers: scrolling runs the video to a full reveal, holds while the labels show, then reassembles the cup. Scrolling back rewinds it. The video plays natively, so it runs smoothly without frame-by-frame stutter.

scroll-driven video

An editorial serif instead of the usual grotesque

03

Prata is a high-contrast serif with complete Cyrillic coverage. Lowercase instead of heavy caps immediately lifts how the price reads: specialty should feel more expensive than the kiosk by the metro.

editorial serif

The menu lives in a single file

04

18 items across four sections sit in JSON: the bar manager edits a line and the site updates instantly, with no markup work and no developer. Takeaway orders are assembled in WhatsApp, with no aggregator taking a cut.

JSON menu · wa.me

Full disclosure

'Krem Coffee' is a fictional coffee shop: a flagship demo in the InterLAB showroom, with prices and a menu that illustrate the format. The same site for your real business is built with your menu, photos and WhatsApp number.

we reply within one business hour

Want one like this — for your coffee shop?

We'll show you a draft on our subdomain before any payment. Scroll-driven video, a menu from a single file and WhatsApp ordering — just like the demo, but with your drink, your items and your photos.

  • Scope and risks estimated before we start
  • NDA — yours or ours
  • Work starts within 3–5 days
Message on WhatsAppTelegram

By clicking the button you agree to the processing of your personal data.

InterLABdigital studio

web apps · services · software

WorkServicesAboutContact

© 2026 InterLAB · Privacy