Разработка одностраничного сайта и внедрение системы бронирования TravelLine с системой интернет-эквайринга

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

Этапы разработки:

1 Этап

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

На первом этапе приступили к созданию дизайна для сайта

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

Вложенность сайта

2 Этап

Вверху мы закрепили навигационное меню, чтобы ориентироваться было еще проще. Вынесли такие разделы, как: «О нас», «Смены», «Инфраструктура», «Дипломы и награды», «Команда», «Контакты», «Фотогалерея» и «Отзывы». Также разместили логотип компании, ссылку на Вконтакте, номер телефона и кнопку для перехода на бронь путевки.

Создание общей структуры

3 Этап

4 Этап

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

Размещение смен лагеря

5 Этап

Следующим стал раздел «О нас» — здесь мы отобразили подробную информацию о лагере Еланчик, добавили фотографии корпусов, номеров и окружающей среды. Рассказали об инфраструктуре, наличии спортивных сооружений, детских игровых и спортивных площадках, кабинетах дополнительного образования и условиях питания.

Реализация блока "О нас"

Наглядно показали отличие стоимости путевок в зависимости от выбранных корпусов: Стандарта и Улучшенной категории, добавили фотографии, меняющиеся при клике на название корпуса и основные характеристики.

Настройка зависимой анимации

6 Этап

7 Этап

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

Отображение компетентности лагеря

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

Соблюдение необходимых норм

8 Этап

В качестве дополнительного запроса была реализация продажи путевок прямо на сайте через систему Мир с возвращением кешбека. Для этого мы внедрили систему Travel Line. (https://www.travelline.ru/). за первый год работы сайта было проведено более 1000 путевок.

Внедрение платежной системы

9 Этап

10 Этап

Была настроена интеграция с Битрикс24 (https://www.bitrix24.ru/) для упрощения ведения базы клиентов. На сайте размещена форма заявки из Битрикса, введенная в нее информация сразу попадает в единую базу данных клиентов. После подтверждения заказа, сотрудник, используя информацию из CRM в пару кликов создает путевку, что позволяет сократить время обработки заявок и выдаче путевок. На сайте обеспечена конфиденциальность данных всех клиентов.

Интеграция с Битрикс24

11 Этап

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

Реализация галереи и контактов

На данный момент (2024 год) наша компания оказывает ежемесячную поддержку сайта и осуществляет ежегодное обновление данных. Статистика посещаемости сайта: ежегодно более 23 000 человек (за 2024 год — 22 461)

Техническая поддержка сайта

12 Этап

Провели необходимые SEO-настройки: для каждой страницы выставили заголовок h1; сделали описание и заголовок страниц; добавили favicon. Подключили Яндекс Метрику, Яндекс Вебмастер, Google Search Console, Google Analytics для отображения сайта
в поисковой выдаче и дальнейшего анализа посещаемости

SEO-Настройка сайта

13 Этап

Результат:

Ссылка на сайт: