Website & booking build

2021, updated 2026

TL;DR

A self-initiated website project for a local Prague café I used to frequent, created after I reached out to the owners to turn the idea into a real live site. With no budget on their end, I designed, built, and launched the website in a one-week sprint, including responsive pages, café content, a booking flow, accessibility improvements, SEO basics, and custom domain setup.

Problem

Tout va bien is a small local café in Prague that needed a simple online presence where people could browse their offer, and make a booking. The project started as a self-initiated portfolio piece and later became a real collaboration. Although the café and I ultimately did not continue working together long-term, I still designed, built, published, and maintained a live version of the website. The challenge was to treat a small, low-budget project with the same care I would give to a commercial product: clear structure, responsive design, accessible interaction, and a working production deployment - not just a polished mockup.

Solution

Rebuilt from a vanilla Figma prototype into a production live Next.js 15 app, deployed to Vercel with a custom domain toutvabien.cz. The design uses a horizontal-scrolling panel layout with a scroll-driven animation - the café tagline spins as the user moves through the page. A booking form with real opening-hour constraints (08:30-17:30) using React Hook Form and Zod validation. Responsive layout, based on device, accessibility (WCAG 2.1 AA), and full SEO coverage. A Vercel platform misconfiguration during deployment required API-level debugging to resolve - a real engineering problem.

Results

Live
Live site launched on custom domain
6
Engineering tasks shipped in one week
Booking
Functional booking flow added for reservations

Key Learnings

  • Horizontal scroll published website proves responsive design becomes more complex and time inefficient, although more distinctive and memorable.
  • Spacing/negative space has a major impact on how premium or intentional a simple site feels, visual hierarchy becomes especially important in non-standard layouts.
  • Uncompensated projects are still real projects. Accessibility passes, SEO configuration, and production deployment discipline are what separate portfolio work from tutorial work.