До змісту
Tvorum.
КонцептСалон краси2026

Lumière — концепт сайту для салону краси

Сайт-візитка для бутик-салону в Одесі, побудований як один день світла: прокрутка — це час від 08:00 до 21:00, а запис до конкретного майстра на вільне вікно займає менше хвилини.

Це концепт, а не клієнтський проєктКонцепт-проєкт студії: демонстрація дизайну та функціоналу для ніші. Так ми бачимо сильний сайт для салону краси: структура, дизайн, тексти й функціонал. Замовте — і ваш сайт стане наступним кейсом.

Lumière — концепт сайту для салону краси — головний екран
Ніша
Салон краси
Тип сайту
Сайт-візитка
Рік
2026
Формат
Концепт студії

01 / Задача

Яку задачу вирішує сайт

Салон краси живе записами, а записи найчастіше губляться між директом, телефоном і месенджерами. Клієнтка о 23:00 хоче записатися на манікюр, але адміністратор відповість лише вранці — і вона вже записалася в інше місце. Ще три типові болі ніші:

  • «Ціну уточнюйте в адміністратора» — людина не бачить ні вартості, ні тривалості і відкладає рішення;
  • вибір майстра — до салону ходять «до Марти», а не «на манікюр», тож важливо бачити майстрів, їхній рівень і ціну саме в них;
  • сезонні продажі — подарункові сертифікати перед святами можуть давати помітну частку виручки, але зазвичай продаються лише на рецепції.

Сайт мав працювати на три цілі: записи 24/7 без участі адміністратора, середній чек (прозорий прайс Top/Senior, комплекси й ритуали) і повернення гостей — через клуб лояльності та сертифікати, які приводять нових клієнток.

02 / Рішення

Дизайн і UX-рішення

Ідея — «краса, що ловить світло». Вся сторінка — це один день у салоні з вікнами на захід: прокрутка рухає годинник від світанку (08:00) до ночі (21:00), фон плавно змінюється від ранкового крему до пудрового заходу й графітового вечора, а кожна секція має свою годину. На десктопі за часом стежить вертикальна «лінія сонця», на мобільному — годинник у шапці. Це запам’ятовується і водночас нагадує головне: салон працює щодня до 21:00, а онлайн-запис — цілодобово.

Естетика. Пудровий, крем, шампань і графіт; Cormorant для заголовків і цін, Manrope для інтерфейсу. Наскрізний мотив — арка старого одеського вікна: у ній фото героя, майстри, роботи й навіть знак бренду. Перший екран оживає без важкого відео: повільний ken burns по фото і відблиск арочного вікна, що м’яко «дихає» на заголовку, ніби світло проходить крізь штору.

Запис, який продає. Уже на першому екрані — картка «найближче вільне вікно» з реальним слотом. Віджет запису веде «майстер → послуга → дата і час → контакти», ціна автоматично враховує рівень майстра (Top +20%), зайняті слоти й вихідні недоступні, а справа збирається «квиток» візиту. Після підтвердження запис можна додати в календар (.ics). Кожна послуга в прайсі, картка майстра й робота в портфоліо («Хочу так само») відкривають запис із уже заповненими полями.

Додаткові гроші. Конструктор сертифіката з живим прев’ю картки (номінал або ритуал, дизайн, ім’я, побажання, доставка Новою Поштою) і калькулятор клубу, який показує, скільки бонусів гостя отримає за рік і на яку послугу їх вистачить. Довіра — без вигадок: замість відгуків — принципи роботи, стерилізація, умови скасування і чесне FAQ.

03 / Функціонал

Що є на сайті

  • Онлайн-запис у 4 кроки: майстер → послуга → слот у календарі → контакти, з валідацією і маскою +380
  • Картка «найближче вільне вікно» на першому екрані з переходом одразу до запису
  • Прайс за категоріями (волосся, нігті, обличчя, брови) з тривалістю та цінами Top/Senior
  • Майстри з рівнями Top і Senior та записом до конкретного фахівця
  • Портфоліо з фільтром, лайтбоксом, свайпом і кнопкою «Хочу так само»
  • Конструктор подарункового сертифіката з 3D-прев’ю картки та трьома дизайнами
  • Клуб лояльності з калькулятором бонусів на рік
  • Scroll-driven «день світла»: годинник, зміна палітри секцій і theme-color
  • Експорт запису в календар (.ics) та підтвердження в Telegram, Viber або SMS
  • Адаптив від 390 px: бургер-меню, плаваюча кнопка запису, нижній лайтбокс

04 / Екрани

Як сайт виглядає на компʼютері й телефоні

Lumière — концепт сайту для салону краси — головна сторінка повністю
Головна сторінка повністю — гортайте всередині рамки
Lumière — концепт сайту для салону краси — мобільна версія
Мобільна версія

Технології

Стек

Технології підбираємо під задачу: швидке завантаження, зручне редагування контенту та інтеграції з вашими сервісами.

  • HTML5
  • CSS Grid/Flex
  • Vanilla JS
  • Онлайн-запис: майстер → послуга → слот у календарі
  • Scroll-driven «годинник дня» (requestAnimationFrame)
  • Конструктор подарункового сертифіката з живим прев’ю
  • Калькулятор бонусів програми лояльності
  • Портфоліо з фільтром і лайтбоксом (клавіатура, свайп)
  • Експорт запису в календар (.ics)
  • IntersectionObserver-анімації
  • Готовий до інтеграції з CMS

Палітра

Кольори концепту

  • Колір #f3e9df
  • Колір #ebd3ce
  • Колір #d9c4a3
  • Колір #a0705f
  • Колір #2a2729

Портфоліо

Інші роботи

Усі роботи

0 ₴ · 24h

Хочете такий самий — але під ваш бізнес?

Залиште контакт — за 24 години покажемо безкоштовний прототип головної сторінки: у стилі цього концепту або в зовсім іншому.

  • Прототип за 24 години — безкоштовно
  • Фіксована ціна, без «доплат» в процесі
  • Запуск від 5 днів
  • Гарантія та підтримка після здачі
Де відповісти?

Без спаму. Натискаючи кнопку, ви погоджуєтесь з політикою конфіденційності.