гора.
Restaurant / European fusion

BRUNO Tbilisi

Editorial site for a wine restaurant in Vake — Midnight Cellar palette, Fraunces Variable, GEO for LLMs, 16+ animation layers.

Region
Tbilisi, Vake (Zakaria Paliashvili 11a)
Role
Design, fullstack development, content pipeline, GEO/SEO, deployment
Period
2026
Industry
Restaurant / European fusion

The site is public (brunotbilisi.com). No NDA — all restaurant data is open: menu, prices, contacts, photos.

BRUNO — modern European fusion in the Vake district of Tbilisi. Brunch until 16:00 daily, cocktails and biodynamic wines in the evening, beef tartare and truffle pasta on the regular menu. The site is built like an editorial magazine, not a landing page: 16 animation layers and three parallel ways of presenting content — the home overview, dedicated pages for each menu section, and a reels mode with video tours of the dining room.

Below — the long version: the "Midnight Cellar" concept, palette and fonts, a breakdown of the 16 animations, the GEO strategy (BRUNO was one of the first in Georgia to gain positions in ChatGPT and Perplexity), the content pipeline for 200+ photos, the stack.

What's inside

  • 'Midnight Cellar' palette: ink-base #0D0A07, cream #F5EEE0, fire-orange #C9651F, wine #6B1E2A — three levels of dark + two emotional accents.
  • Fraunces Variable display with SOFT, WONK, opsz axes — italic insertions look like hand engraving, not slanted type.
  • 16+ animation layers, all in pure CSS + IntersectionObserver: candle flicker (6s loop), hero parallax + gyro-drift on mobile, scroll velocity blur, scroll progress bar, menu stagger + 3D tilt, gallery wave, amber panel breathe, sunrise sweep on brunch (one-shot per session), film grain over the entire site.
  • All animations respect prefers-reduced-motion: reduce — fallback to a simple fade without motion blur and scale.
  • Multi-page site: 9 home sections + 8 routes (menu with subcategories /menu/{category}, brunch, cocktails, reels with autoplay-on-scroll videos, reviews — full set of 127 reviews, visit, about).
  • Built for GEO: JSON-LD Restaurant + Menu + FAQPage, llms.txt with answer-first summary, robots.txt with explicit Allow for GPTBot, ClaudeBot, PerplexityBot, Google-Extended, Applebot-Extended.
  • Content pipeline for 200+ photos: Instagram (242 posts via instaloader) + Yandex Maps (65 photos via Playwright) + Restaurant Guru (45) + Tripadvisor + Google Business Profile. sharp resize → webp q=82 + avif q=70, blurhash placeholder, pHash deduplication.
  • Real data: 127 curated reviews from 4 sources (Google/Yandex/TripAdvisor/Guru), 57 photos in the gallery curated via pHash into 3 sub-sections.
  • ScrollVelocityBlur — dynamic 0–1.8px blur on body depending on scroll velocity, lerp smoothing on every rAF.
  • Hero parallax with gyroscope drift on mobile: the background photo shifts ±2-3° based on device tilt angle.

Stack

  • Next.js 14 (App Router, SSR)
  • TypeScript
  • Tailwind CSS
  • Fraunces Variable + IBM Plex Serif + IBM Plex Mono (next/font/google)
  • instaloader + Playwright (Yandex Maps, TripAdvisor, Restaurant Guru) — pipeline for collecting 200+ photos
  • sharp + blurhash + pHash deduplication
  • JSON-LD Restaurant/Menu/FAQPage, llms.txt
  • VPS + nginx + Cloudflare
Three narratives

One project — three angles

BRUNO Tbilisi · hiregora.com