URBANFIT — сеть премиальных фитнес-клубов в Санкт-Петербурге. Бизнес развивался: открывались новые клубы и обновлялись пространства, а сайт застрял в прошлом.
Задача — разработать имиджевый сайт, который передает атмосферу клубов с первого экрана. При этом важно:
✓ упростить путь до записи и покупки абонемента;
✓ уйти от типовой фитнес-эстетики и выделиться в нише;
✓ сохранить SEO-позиции;
✓ связать сайт с CRM и снять ручную работу с команды;
✓ заложить основу для масштабирования.
БРИФИНГ И АНАЛИТИКА
→ На встречах с клиентом собрали основные требования к сайту.
→ Параллельно погрузились в специфику сферы и аудитории. Выяснили, что основное ядро — миллениалы 25–35 лет, около 60% из них — девушки. Есть клубы, которые посещает много зумеров, а есть площадки с более возрастной аудиторией. Около 25% клиентов ходит в URBANFIT. ради групповых занятий, а значит, эти форматы нужно особенно проработать в структуре сайта.
→ Разобрали, как в целом устроены сайты фитнес-клубов. Изучили конкурентов: какие разделы у них есть, как они показывают клубы, тарифы, расписание и тренеров, как ведут человека по страницам.
СТРУКТУРА И СЦЕНАРИИ
✓ Собрали структуру сайта вокруг базовых задач пользователей: выбор клуба, тарифов, тренировок, быстрый доступ к расписанию.
✓ Каждый раздел закрывает конкретный сценарий и подталкивает к целевому действию.
✓ Сделали прототипы ключевых страниц и путей — от первого визита до покупки абонемента.
ДИЗАЙН-КОНЦЕПЦИЯ И 3D-МАСКОТ
→ У URBANFIT. не было полноценного брендбука, поэтому вместе с клиентом сформировали стиль бренда: темный фон, теплый неон, акцентные градиенты, визуальные отсылки к клубным пространствам.
→ Центральный элемент главной страницы — 3D-персонаж URBANFIT. Прошли полный путь от черно-белого скетча и силуэта до готовой сцены: риггинг, симуляция ткани, тестовые секвенции, настройка света и материалов. Параллельно думали о том, как персонаж поведет себя в интерфейсе.
→ Оптимизировали 3D для быстрой загрузки, включая мобильные устройства. А еще добавили микроанимации, которые усиливают ощущение движения и энергии: удары ракеткой по мячу, движение браслетов, легкое смещение камеры.
→ Сделали детальные прототипы всех страниц, в которых почти полностью отразили все дизайн-решение. По глубине проработки мы ушли дальше стандартов рынка: на этом этапе был виден почти весь будущий продукт. Показали, как будет вести себя главная, как 3D-персонаж будет перемещаться по страницам и расписали всю структуру.
КЛЮЧЕВЫЕ РАЗДЕЛЫ
Выделили 7 ключевых блоков, которые влияют на конверсию, и вынесли их в верхнее меню:
1. Клубы — кастомная карта с метками локаций.
2. Тарифы — собрали на одной странице 4 основных предложения, показали характеристики и отличия.
3. Расписание — календарь тренировок по всем клубам.
4. Тренировки и услуги — быстрый вход для основной аудитории групповых занятий.
5. Новости и акции — предусмотрели все типы контента, которые команда может использовать в маркетинговых активностях.
Клиент был глубоко вовлечен в дизайн-этап. Мы вместе перебирали иконки, уточняли отступы и композицию, обсуждали мелкие визуальные детали. Это позволило на этапе макетов снять большинство будущих правок и прийти к дизайну, который одинаково комфортен бренду и пользователям.
РАЗРАБОТКА И ИНТЕГРАЦИИ
Фронтенд на Next.js, бэкенд на Laravel + Filament. Сайт ощущается как мини-приложение: быстрые переходы, анимации, стабильная работа.
Главный технический вызов проекта — связать новый сайт с CRM для фитнес-клубов Fitbase. Всего реализовали 3 интеграции:
1. Модуль расписания — данные по тренировкам теперь подгружаются на сайт из Fitbase автоматически и отображаются пользователям: категория, тренер, дата и время, длительность и другие параметры. Менеджерам не нужно руками обновлять сетку, достаточно внести корректировки в CRM, и они изменятся на сайте.
2. Формы обратной связи — связали с Fitbase все формы на сайте. Каждая заявка уходит в CRM с пометкой, с какой страницы и из какой формы ее отправили. Отдел продаж сразу видит источник лида и может оценивать эффективность страниц и воронок. Раньше заявки переносили в CRM вручную, сейчас этот этап полностью автоматизирован.
3. Покупка абонементов и личный кабинет — при регистрации создается карточка пользователя в CRM, данные по оплатам автоматически подтягиваются в систему.
АДМИНКА
Собрали удобную админку на CMS Filament. Из нее полностью управляют сайтом и меняют контент, в том числе с телефона. Менеджеры могут даже настраивать цвета для обозначения разных залов.
SEO БЕЗ ПОТЕРИ ПОЗИЦИЙ
SEO заложили на этапе проектирования: структура, URL, метаданные. После запуска была небольшая просадка, но позиции быстро восстановились и продолжают расти.
РЕЗУЛЬТАТ
✓ На 20% выросла конверсия сайта, по данным клиента.
✓ Онлайн-образ бренда совпал с реальностью клубов: премиум-формат, атмосфера, внимание к деталям.
✓ Путь пользователя стал коротким и понятным: человек заходит на сайт → выбирает клуб → смотрит тарифы и тренировки → записывается или покупает абонемент. Расписание, клубы, тарифы, новости и акции — в быстрых сценариях, без блужданий по разделам.
✓ Все заявки и покупки автоматически обрабатываются в CRM Fitbase — без ручной работы.
✓ Кастомная админка на Laravel Filament дает возможность команде самостоятельно запускать акции, обновлять контент клубов, настраивать визуальные акценты, без участия разработчиков.
✓ Сайт готов к масштабированию. Можно добавлять новые клубы, функции и интеграции.
Ну и один из главных показателей — клиент остался настолько доволен результатом, что отменил ретро-встречу по проекту. Для нас это сигнал, что мы оправдали и даже перевыполнили ожидания.
Выставлено в номинациях:
— Лучший сайт для потребителей (b2c)
— Сайт спортивной организации, клуба, команды