Штатик
Все кейсы

сайт-пример · Вымышленная сеть «Тихая гавань», 2 филиала · сборка демо: около 1 рабочего дня, 24.10.2026

Сайт сети спа с онлайн-записью по свободным окнам мастеров

Услуги, мастера, запись в 5 шагов по свободным слотам, подарочный сертификат с предпросмотром и экран «так запись ушла бы администратору».

Сайты

Выберите филиал, услугу и мастера — занятые слоты зачёркнуты. После подтверждения видно, как запись встаёт в колонку мастера у администратора.

Записи хранятся только в вашем браузере и отменяются на той же странице.

Главная

Задача

Запрос салонов и студий: сайт с услугами и ценами, мастерами, онлайн-записью, сертификатами и отзывами; запись должна попадать администратору (YCLIENTS, Altegio или Telegram). Гость хочет за минуту увидеть свободное время у конкретного мастера, не звоня.

Что сделано

  • Услуги с ценой и длительностью, кнопка «записаться» на каждой.
  • 6 мастеров с опытом и специализацией; «записаться к мастеру» подставляет его в запись.
  • Запись в 5 шагов: филиал → услуга → мастер или «любой свободный» → дата на 14 дней → время. Занятые слоты зачёркнуты, свои записи можно отменить.
  • Экран «так запись ушла бы администратору»: сообщение бота и колонка мастера в журнале на день.
  • Подарочный сертификат: номинал, формат, предпросмотр обновляется по мере ввода.
  • Отзывы, вопросы, контакты двух филиалов; Schema.org с двумя адресами, sitemap, canonical.

Роли

  • Гость — выбор услуги, запись, сертификат
  • Администратор филиала — получает запись (показано экраном)

Ключевой момент

Слоты считаются по мастеру и дню, свободное время «любого мастера» объединяется. После подтверждения видно, как запись встаёт в колонку мастера среди уже занятых.

Замеры

8 страницпрокликаны на 1440 и 390 px вместе с полным сценарием записи и сертификата: 0 ошибок консоли, 0 битых ссылок.
≈ 0,1 сLCP главной; CLS 0,030 на телефоне и 0 на компьютере (замер на том же сервере — нижняя граница).
60 КБвесь CSS и JS, без фреймворков и внешних скриптов.

На демо-данных, методика указана в каждой строке. Реального клиента у демо нет, поэтому цифр «выручка выросла» здесь нет.

Скриншоты

Нажмите, чтобы увеличить. Листайте свайпом или стрелками.

Выбор даты и времени, занятые слоты зачёркнуты
«Так запись ушла бы администратору»
Услуги и цены
Сертификат с предпросмотром
Главная на телефоне
Запись на телефоне
Меню на телефоне

Стек и архитектура

  • HTML, CSS, JavaScript без фреймворков
  • сборка на Python
  • Prata + Onest локально
  • webp с srcset
  • Caddy
  1. Один файл данных (филиалы, услуги, мастера, отзывы) для всех страниц.
  2. Запись: детерминированная занятость на 14 дней, шаги, хранение в браузере с защитой от его отказа.
  3. Сертификат: предпросмотр SVG и оформление. Ввод гостя экранируется.

Интеграции

YCLIENTS, Altegio и бот администратора показаны экраном. В проде: свободные окна и запись — через API расписания, гостю подтверждение и напоминание за 24 часа, оплата сертификата через ЮKassa.

Как было бы в проде

  • Расписание из CRM студии вместо генерации, редактор услуг, цен и мастеров.
  • Реальные фото кабинетов и мастеров, открытая индексация.
  • Срок называю после разбора: зависит от системы записи студии.

Честно: Фото интерьеров и мастеров сгенерированы, люди вымышленные. Занятость слотов — модель, а не реальное расписание.

Сроки по факту

Сборка демо: около 1 рабочего дня, 24.10.2026. Код пишу вместе с ИИ-агентами, проверка — автоматическая, в браузере на сервере. Сроки проекта у заказчика — в последнем пункте «Как было бы в проде» и в разделе «Процесс и сроки».

Попробовать

Выберите филиал, услугу и мастера — занятые слоты зачёркнуты. После подтверждения видно, как запись встаёт в колонку мастера у администратора.

Записи хранятся только в вашем браузере и отменяются на той же странице.

Обсудить задачу

Нужна такая система под вашу задачу? Напишите, что болит, — разберу и покажу прототип на ваших данных до договора. Как я работаю и как оплачивать — на странице портфолио.

почта, если Telegram не открывается

anton.shtatik@yandex.ru

Отвечаю в течение рабочего дня.