Кейс · 2026 · сайт + CRM салона
Своя
CRM
Сайт-визитка с онлайн-записью и админ-CRM салона — без подписки. Вы внутри кейса, собранного из самого сайта: та же сетка, те же кнопки, тот же монохром.
Задача
Онлайн-запись и CRM салона — без подписки и чужой инфраструктуры
Hair Atelier — салон красоты в Минске. Обычно запись и клиентскую базу салоны арендуют у сервисов вроде YCLIENTS или DIKIDI: абонентская плата, чужие серверы, платные SMS-рассылки.
Мы собрали полностью самописную платформу: публичный сайт-визитку с пошаговой онлайн-записью и админ-CRM с календарём, клиентами, финансами и собственной системой сообщений. Весь код, база и Telegram-боты живут на одном VPS клиента — без посредников и абонентки.
Брендбук
Монохром как решение
В палитре салона нет ни одного цветного оттенка — только уголь, три серых и бумага. Нажмите на цвет: покажем, где он работает в виджете онлайн-записи.
Единственный «цвет» бренда. Не чистый чёрный, а мягкий уголь: заголовки, основная кнопка, пройденные шаги записи, двухпиксельная линия под шапкой. Всё, что важно и что нажимается, — угольное.
Вторичный текст: подписи-разрядка над заголовками, роль мастера, пояснения. Иерархия строится не цветом, а шагом серого.
Третий план: вторая строка логотипа в хиро, цена и длительность услуги, номера будущих шагов. Серый вместо акцентного цвета: интерфейс остаётся фоном и ни с чем не спорит.
Границы карточек в 1px, сетка 48×48 на фоне хиро, аватары с инициалами, неактивные шаги. Никаких теней и скруглений — только линия, как разметка на выкройке.
Фон и «воздух». Белый лист, на котором уголь читается как типографика в журнале; он же — текст на угольных кнопках и инверсия карточек при наведении.
Выберите мастера
Логотип. Тонкая антиква в разрядку рядом с ромбом-знаком — единственная засечка на сайте, поэтому имя салона ни с чем не спутать.
Заголовки и крупные цифры: номера 01–03, цены, время записи. В монохроме главный акцент — кегль: заголовок хиро набран в 96 px. Кириллицу подхватывает системный гротеск из того же стека.
Интерфейс: кнопки, навигация, подписи. Прописные 10–12 px с широкой разрядкой — как бирка на одежде.
Что мы сделали
Экраны
Главная
Хиро на сетке, услуги, мастера и блок записи. Авторизованного клиента встречают по имени и показывают ближайшую запись.
/ 02
Услуги
Каталог по категориям: название, длительность, цена — прямо из базы салона.
/services 03
Онлайн-запись
Пошаговая форма: мастер, его услуги, дата и время, контакты.
/booking 04
Магазин
Витрина бьюти-товаров салона. Товары заводятся в админке.
/shop 05
Школа
Курсы салона с записью — заявка уходит в отдельную таблицу и в Telegram.
/school 06
Мобильная версия
Mobile-first: нижний tab-bar с кнопкой записи по центру и pull-to-refresh.
/Онлайн-запись
Записаться — и посмотреть, что внутри
Форма работает как на сайте салона: выбирайте мастера, услугу и время. Справа — что в этот момент делает система.
Каталог
Наши услуги салону
Прайс-лист с сайта, только вместо стрижек и цен — состав проекта: что входит в платформу и чем оно измеряется.
Публичная часть
Мастер → услуга → дата и время → контакты; предвыбор через ссылку
Категории, цены, длительность — из базы
Витрина бьюти-товаров и курсы салона с записью
Вход по телефону, свои записи, ответы на сообщения салона
Админ-CRM
Недельная сетка по мастерам, цветовые статусы, приём оплаты в модалке записи
История визитов, заметки мастера, предпочтения: аллергии, окрашивание
Выручка за период с разбивкой по способам оплаты, мастерам и услугам
Индивидуальные цены, расписание по датам, блок-слоты, привязка к Telegram
Сообщения и Telegram
После визита клиенту автоматически приходит вопрос «Повторить запись?»
Администратор пишет вопрос с вариантами ответа — вручную или из шаблона
Подтвердить, отменить или закрыть запись кнопками в чате; мастер видит только свои
Поллер бота проверяет базу и шлёт уведомление
Под капотом
App Router, Route Handlers, типизированная схема на 17 моделей
Своя база в Docker-томе, бэкапы pg_dump по cron
db, web и bot; схема применяется автоматически при деплое
JWT в HttpOnly-cookies — отдельно для админа и для клиента; пароли админов — bcrypt
Команда
Кто работает в системе
Клиент
Сайт и личный кабинет
Записывается в любое время, видит ближайшую запись и её статус, отвечает на сообщения салона прямо на главной — без мессенджеров.
Путь записиАдминистратор
Админ-CRM и Telegram
Ведёт журнал записей, клиентскую базу и финансы, рассылает вопросы клиентам. Новые записи и ответы приходят в Telegram.
Экраны CRMМастер
Telegram-бот
Подключается по одноразовой инвайт-ссылке, видит только свои записи и сам подтверждает, отменяет или отмечает их выполненными.
Состав проекта
Сообщения от салона
Своя замена SMS-маркетингу
Так сообщение выглядит на главной у авторизованного клиента. Ответьте — карточка свернётся, как на сайте.
Hair Atelier
Повторить запись к мастеру Анне на «Окрашивание»?
Системное сообщение создаётся через заданное число дней после визита. Одновременно у клиента только одно такое — без спама.
Ответ сразу ведёт к новой записи с тем же мастером и услугой. Ответы видны в разделе «Сообщения» и приходят администратору в Telegram.
Имена склоняются библиотекой petrovich с собственным детектором пола: Илья и Никита не превращаются в женские имена.
Результат
Запись работает,
абонентка — нет
У салона — собственная платформа вместо арендованной: сайт принимает записи круглосуточно, администратор и мастера управляют ими из календаря и из Telegram, а повторная запись приходит клиенту сама и оформляется в один клик. Код, база и боты — на одном VPS клиента, без подписки и посредников.
Хотите такой же результат?
Обсудим задачу, рассчитаем стоимость и сроки. Первый разбор — бесплатно.
Обсудить проект →