Проект 01 / Сайт и веб-сервис

ONYX CLEANING

Выбрать уборку. Рассчитать стоимость. Оформить заказ. Всё — на одном сайте.

Проект для ИП. Коммерческого запуска не было.

Главная страница ONYX CLEANING на настольном экране

01 / Задача

Больше, чем
витрина услуг

Для клининговой компании нужен был сайт, на котором клиент мог бы не только узнать об уборке, но и самостоятельно собрать заказ: выбрать услуги, увидеть расчёт и указать время выезда.

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

Для клиента
Каталог, расчёт и заказ
Для бизнеса
Управление и уведомления
Формат
Десктоп и мобильная версия

02 / Визуальное решение

Спокойный образ.
Понятные действия.

Тёплый светлый фон, графитовые блоки и золотистые акценты продолжают образ ONYX. Крупные фотографии показывают контекст услуги, а контрастные кнопки выделяют переход к заказу.

Информационная часть знакомит с услугами. В конфигураторе акцент смещается на параметры, состав заказа и стоимость — то, что нужно для решения.

Светлая основаГрафитЗолотой акцент

03 / Конфигуратор заказа

Стоимость понятна
до отправки заявки

Калькулятор учитывает тип уборки, площадь или количество, минимальные цены, дополнительные услуги, выезд и ориентировочное время.

  1. Услуга
  2. Тип уборки
  3. Площадь
  4. Доп. услуги
  5. Адрес и выезд
  6. Итог
Выбор услугиОформлениеПроверка заказа
Страница услуги ONYX CLEANING с описанием уборки и кнопкой заказа
Оформление заказа ONYX CLEANING с контактами, адресом, датой и итоговой стоимостью
Финальная проверка состава и стоимости заказа перед отправкой

Полный сценарий на мобильном

Форма сохраняет расчёт, быстрый доступ к итогу и проверку заказа перед отправкой.

Мобильная форма оформления заказа ONYX CLEANING
Форма заказа
Проверка состава и стоимости заказа на мобильном экране
Проверка перед отправкой

04 / Передача заказа

С сайта
сразу в Telegram

После подтверждения заказ отправлялся в Telegram. Команда получала контакты, адрес, состав услуг, стоимость и время работы в одном сообщении.

Заказ ONYX CLEANING в Telegram

05 / Панель управления

Управление
без изменения кода

Панель управления ценами, параметрами расчёта и городами выезда
Редактирование дополнительных услуг в панели ONYX CLEANING
  • Услуги и цены
  • Параметры расчёта
  • Города и стоимость выезда
  • Контакты и отзывы
  • Повторные обращения по телефону

Доступ администратора: bcrypt, JWT и httpOnly cookie.

06 / Итог проекта

Сайт с логикой
полноценного сервиса

В проекте реализован путь от знакомства с услугой до расчёта, проверки и передачи заказа команде. Цены, услуги и параметры выезда вынесены в панель управления.

Коммерческого запуска не было, поэтому здесь показаны реализованные решения, а не показатели продаж.

Обсудить похожий проект
React 18TypeScriptSCSSMantineFramer MotionAxiosReact RouterNode.jsExpressMySQL
Следующий проектСистема управления пропускамиНа главную