Більшість сайтів ресторанів - це той самий буклет, що гортається: головне фото, меню у PDF, форма зворотного зв'язку. NOIRÉ не такий. Його створено як вечерю в темряві: кожне прокручування розгортає нову сцену, кожна страва розкривається за подачами, і коли відвідувач доходить до кнопки бронювання, він уже почувається так, ніби сидить за столом.

Жива демоверсія: https://noire-
dining.netlify.app/

В основі шаблону п'ять фірмових послідовностей. «Розкриття страви» перетворює одну тарілку на п'ятиетапну кінематографічну історію: інгредієнт → приготування → подача → страва → перший шматочок, що керується прокручуванням. «Чотирнадцять місць» - інтерактивний мотив розсадки, де 14 маркерів плавно з'являються й розкривають частину атмосфери вечері під час наведення або дотику. «Режим темряви» - закріплена подорож через п'ять сцен вечора, від прибуття до останньої страви, що керується прокручуванням, під час якої екран поступово темніє в міру того, як глибшає ніч. «Інтерактивне дегустаційне меню» проводить гостей через повну послідовність із п'яти подач: закуска від шефа, перша, друга, основна, десерт, кожна зі своєю стравою, інгредієнтами та підбором вина. А «Анатомія страви» відкриває кожну окрему страву в тому самому послідовному стилі меню мішленівського рівня: страва → інгредієнти → склад → поєднання з вином.

Усе це керується простими типізованими файлами даних у src/data/: жодної CMS, бази даних чи бекенду підключати не потрібно. Перейменувати ресторан, переписати меню, додати нову страву, замінити фото й відео чи змінити кольорову палітру та шрифти можна, просто відредагувавши об'єкт TypeScript, не торкаючись коду компонентів. Форми контактів і бронювання повністю створені та перевіряються на стороні клієнта, готові до підключення до реального бекенду чи сервісу бронювання під час запуску. Повний Посібник для клієнта крок за кроком описує брендинг, контент, зображення, відео, навігацію, SEO та розгортання, тож шаблоном зручно користуватися навіть тому, хто не є розробником і щодня веде сайт.

Створено на Next.js 16 (App Router) з TypeScript, Tailwind CSS v4, Framer Motion, GSAP/ScrollTrigger, плавним прокручуванням Lenis, React Hook Form + Zod та іконками Lucide. Що ви отримуєте: повний вихідний код, усі маршрути (головна, меню, сторінка страви, враження, історія, журнал + сторінка статті, бронювання, контакти), адаптивні макети, перевірені аж до 320 px, зображення через next/image (автоматичні AVIF/WebP, відкладене завантаження), запасні варіанти зі зменшеною анімацією для кожної анімованої послідовності, SEO-метадані з картками Open Graph/Twitter і структурованими даними ресторану JSON-LD, автоматично створені файли sitemap і robots, а також письмовий Посібник для клієнта зі встановлення, налаштування та розгортання на Netlify або Vercel.