Сайт лидера рынка СПА в России

Аналитика
UX/UI дизайн
Frontend
Backend

Вай Тай

Крупнейший сеть салонов тайского СПА с премиальным сервисом.

Обсудить проект

Награды

Рэйтинг Рунета 2023

«Красота и здоровье»

Проголосовать

Цель

Разработать имиджевый сайт, соответствующий статусу лидера рынка СПА в России. Сделать акцент на онлайн продаже сертификатов и абонементов.

Задачи

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

Технологический стек

1С-Битрикс ElasticSearch GitLab Laravel Nginx PHP-FPM Redis Vue.js

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

Константин Иноземцев

Руководитель проекта

Аналитика

На первом этапе работы мы изучили задачи заказчика, провели веб-аналитику, проанализировали существующий сайт. Выделили и описали целевые группы пользователей, их потребности и варианты удовлетворения этих потребностей в рамках сайта. Внимательно изучили проекты конкурентов. Результат аналитики лег в основу информационной архитектуры сайта, интерактивного прототипа и дизайн-концепции.

Дизайн-система

Сделали новую дизайн-систему для всех страниц сайта, собрали UI-кит, в который вошли все необходимые элементы для создания страниц:

Библиотека компонентов Стили шрифтов Уникальные иконки Иллюстрации

Фирменные цвета: фиолетовый и золотой — мы использовали только как акцентные, а за основу взяли светлые тона и оригинальный паттерн. Данное сочетание и хорошо проработанная типографика, позволили добиться поставленной цели в передаче нужного look&feel.

Темная цветовая схема

Создали альтернативную цветовую схему и стиль, который предоставляет пользователям возможность переключаться между светлой и темной темой в зависимости от их предпочтений.

Двигайте круг влево или вправо

Темная версия дизайна отличается от светлой в нескольких аспектах. Вместо светлой палитры и фонов мы используем темные тона, такие как темно-фиолетовый и золотой, чтобы создать более глубокую и насыщенную атмосферу.

Страницы разделов

Раздел «О нас» служит важным инструментом для установления доверия и связи с потенциальными клиентами и партнерами.

Настроили синхронизацию с Яндекс Картами по API. Теперь при выборе города из списка, карта автоматически открывается, отображая соответствующую геопозицию выбранного города. Это позволяет пользователям легко найти и ориентироваться в выбранной локации.

Кроме того, мы добавили кнопку «Найти ближайший салон», которая позволяет пользователям быстро и удобно найти ближайший салон. При нажатии на эту кнопку, система определяет текущее местоположение пользователя и автоматически отображает на карте ближайшие доступные салоны. Это значительно упрощает процесс поиска и позволяет быстро найти необходимый салон.

Декоративные элементы

Разработали ряд декоративных элементов, которые добавляют уникальность и эстетическую привлекательность сайту. Эти элементы созданы с учетом общего стиля и бренда компании, и они помогают усилить его общую визуальную привлекательность.

Золотистые и зеленые листья, оформленные в изысканном стиле, добавляют эстетическую привлекательность и притягательность к дизайну . Каждый лист имеет свою уникальную форму и текстуру, что создает ощущение естественности. Они размещены на различных страницах, чтобы акцентировать важные разделы или привлечь внимание пользователя к определенным элементам.

Эффект параллакса, который мы применили к этим листьям, добавляет глубину и объем к их визуальному представлению. При прокрутке страницы, листья будто движутся независимо от остального контента, создавая иллюзию трехмерности и придающие сайту динамичность.

Адаптивность

В рамках данного проекта мы разработали и внедрили responsive мобильную версию сайта, чтобы обеспечить удобство и оптимальный пользовательский опыт на различных устройствах, включая мобильные телефоны и планшеты.

Создали гибкий дизайн, который автоматически реагирует на различные размеры экранов. Это позволяет контенту сайта плавно меняться и перестраиваться, чтобы оптимально заполнять доступное пространство экрана. Таким образом, пользователи могут легко просматривать и взаимодействовать с сайтом независимо от устройства, которое они используют.

Электронные продажи

Новый функционал делает процесс покупки сертификатов или абонементов онлайн простым и удобным. Теперь стало легко приобрести сертификат или абонемент прямо на сайте.

Сертификат можно купить Или подарить

Инновационный функционал позволяет выбрать желаемый сертификат и его стоимость, а затем заполнить необходимую информацию о получателе. После завершения покупки, система автоматически генерирует красивый и стильный электронный подарочный сертификат в формате PDF, который мгновенно отправляется на электронную почту получателя.

Сроки