Разработка нового сайта для производителя прицеп-кемперов "Кемпер-Урал"

Исходная ситуация

Сайт: https://camper-ural.ru/

Компания "Кемпер-Урал" занимается производством кемперов для легковых автомобилей. Старый сайт был разработан на 1С-Битрикс, что в процессе эксплуатации привело к ряду проблем:

• На сайте выявлены уязвимости, ставившие под угрозу его стабильность.
• Избыточный код и неоптимизированные скрипты замедляли загрузку страниц.
• Дизайн устарел, что негативно сказывалось на имидже компании.
• Ограниченная гибкость настроек и низкая скорость работы затрудняли SEO-продвижение.
• Низкая конверсия снижала эффективность привлечения клиентов.

Цель проекта

Разработать новый сайт на современном технологическом стеке, обеспечив:

• Быструю загрузку страниц.
• Улучшение SEO-показателей.
• Удобный интерфейс для пользователей.
• Интеграцию с CRM-системой для автоматизации работы с клиентами.
• Функционал конфигуратора для создания персонализированных заказов кемперов.

Реализация

Мы выбрали стек PHP Laravel + Filament и провели работу по следующим этапам:

Проектирование и дизайн

• Предварительно разработали семантическое ядро
• Создали техническое задание, где предусмотрели все тонкости будущего сайта опираясь на запросы клиентов.
• Разработали адаптивный дизайн в Figma (десктоп, планшет, мобильные устройства).
• Проработали удобную навигацию и структуру сайта согласно семантике. 

Разработка и верстка

После утверждения дизайна мы приступили к его верстке и разработке системы управления контентом (CMS) на Laravel + Filament. Это позволило создать удобную, гибкую и безопасную платформу для управления сайтом, обеспечив клиенту полный контроль над контентом.

Верстка и фронтенд-разработка

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

Разработка архитектуры системы

Бэкенд-разработка велась на Laravel с использованием Filament для удобного управления сайтом. Мы реализовали продуманную архитектуру базы данных и подготовили API для взаимодействия фронтенда и бэкенда.

Одним из ключевых элементов проекта стало создание удобной и интуитивно понятной административной панели. В ней реализованы следующие возможности:

• Управление контентом: добавление, редактирование и удаление страниц, новостей, статей.
• Каталог кемперов: возможность создания, редактирования и удаления моделей кемперов с детальным описанием и фото.
• Конфигуратор кемперов: администраторы могут задавать доступные опции для конфигуратора, добавлять новые комплектующие, изменять цены и условия их доступности.
• Управление комплектующими: настройка доступных дополнительных модулей для кемперов (стол, подушки, крыша, москитные сетки и т. д.), их характеристик и цен.
• Ценообразование: гибкая настройка стоимости кемперов и их комплектующих, возможность обновления цен в несколько кликов.
• Управление пользователями: система ролей и прав доступа для администраторов и менеджеров.
• Отзывы: модерация и публикация пользовательских отзывов.
• SEO-настройки: возможность редактирования мета-тегов, генерация sitemap.xml и robots.txt, управление редиректами.
• Скрипты и интеграции: подключение аналитики, интеграция с внешними сервисами и управление скриптами.

Безопасность и производительность

Особое внимание было уделено защите данных. Реализованы механизмы аутентификации, ограничения доступа, защита от SQL-инъекций и XSS-атак. Производительность системы была оптимизирована за счет кеширования данных, оптимизированных запросов к базе и асинхронной обработки тяжелых операций.

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

Разработка интерактивного конфигуратора кемперов

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

Этап 1: Выбор кузова кемпера

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

Этап 2: Добавление дополнительных опций

После выбора базовой модели клиент переходит к настройке комплектации. В этом разделе доступны различные опции:

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

Этап 3: Оформление заявки

После завершения конфигурации клиент переходит к финальному этапу – отправке заявки. На этом шаге система:

• Формирует итоговую комплектацию кемпера.
• Отображает окончательную стоимость.
• Предлагает оставить контактные данные.

После заполнения формы заявка передается в CRM-систему (amoCRM), где менеджер получает всю информацию о выбранной комплектации, дополнительных опциях и итоговой стоимости.

Гибкость управления через админ-панель

Для удобного управления конфигуратором была разработана гибкая административная панель на базе Filament. В админке предусмотрены следующие возможности:

• Редактирование списка доступных кузовов кемперов.
• Добавление, изменение и удаление дополнительных опций.
• Гибкая настройка цен, возможность оперативного обновления.
• Контроль заказов и просмотр заявок.

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

В результате реализации конфигуратора мы добились:

• Повышения удобства для клиентов – теперь они могут самостоятельно собрать комплектацию кемпера.
• Автоматического расчета стоимости – пользователи сразу видят итоговую сумму.
• Упрощения работы менеджеров – вся информация о заказе передается в amoCRM.
• Гибкости управления – администраторы могут изменять ассортимент и цены в несколько кликов.

Конфигуратор стал мощным инструментом, который не только улучшает пользовательский опыт, но и помогает компании быстрее обрабатывать заказы и увеличивать конверсию.

Результаты

• Увеличение скорости загрузки сайта с 1.2 сек до 0.4 сек.
• Рост трафика из поисковых систем на 40% (год к году).
• Повышение конверсии сайта на 30%.

Итог

Компания "Кемпер-Урал" получила современный, быстрый и удобный сайт, который стал эффективным инструментом для привлечения клиентов. Новый дизайн ориентирован на путешественников, а интеграция с amoCRM позволила автоматизировать работу с заказами и повысить эффективность бизнеса.