Сайт для Краевого Автотранспортного предприятия (КАТП).
ЗаказчикАО «Краевое автотранспортное предприятие» — коммерческое предприятие, основным видом деятельности которого являются услуги по перевозке пассажиров и багажа автомобильным транспортом.ЗадачаСоздать корпоративный сайт, чтобы дать представление об АО в интернете: о самой компании, филиалах и маршрутах, о видах деятельности. Отразить услуги по ТО и перевозкам.
Клиент АО «Краевое автотранспортное предприятие» — коммерческий перевозчик пассажиров и багажа в Красноярском крае. Специализируется на автоперевозках, фрахтовании транспорта и услугах автовокзалов.
КАТП — это:
- самый крупный пассажирский перевозчик по социально значимым направлениям Красноярского края;
- собственный автопарк (~ 500 машин);
- хорошая репутация и доступные цены.
Задача Разработать корпоративный сайт, чтобы дать представление об АО в интернете: о самой компании, филиалах и маршрутах, о видах деятельности. Отразить услуги по ТО и перевозкам.
Для пользователей нужно дать информацию по маршрутам: какие направления обслуживаются, контакты филиалов, остановки. Возможность узнать номер маршрута и увидеть маршруты и стоянки.
Как решали задачу
В процессе работы мы столкнулись с рядом трудностей, так как система заказчика не была рассчитана на интеграцию с сайтом. Мы постоянно были на связи с клиентом и решали проблемы общими усилиями.
Планировалось, что клиент выполнит интеграцию своими силами, а нам передаст набор api-эндпойнтов, по которым мы быстро соберём всю нужную для страницы информацию. Когда дело дошло до реализации, оказалось, что информация на существующих api неполная или её вообще нет.
Наша команда провела мозговой штурм, как интегрировать сайт с базой. Решили напрямую общаться с базой данных посредством функций, которые нам передаст заказчик. Но данные функции возвращали много дублей или давали неполную информацию. Приходилось делать дополнительные запросы с фильтрацией повторов.
Например, база не могла построить маршрут из промежуточного пункта. Список рейсов можно было получить только по пункту отправления. Нужно было получить список всех рейсов, которые проходят через точку отправления, потом сделать запрос на список остановок по данному рейсу и проверить, есть ли там точка назначения.
К базе получалось много запросов, что замедляло работу сайта. Если поиск рейсов между деревнями занимал около 1 секунды, то построение маршрута через Красноярск, где требовалось обработать много рейсов, заставляло пользователя ждать уже несколько секунд.
Ускорить обработку запросов без серьёзной доработки со стороны клиента было нельзя. Чтобы пользователь понимал, что сайт не завис, мы сделали анимацию с уведомлением, что запрос обрабатывается.
Фрагмент анимации во время ожидания:
Дальше мы стали искать способ ускорить работу кода и уменьшить количество запросов к базе. Для этого мы нашли куски кода, запрашивающие информацию, которая очень редко меняется (например, список праздничных или нестандартных дней). Начали рефакторить их и разносить по функциям, которые потом положили в кеш. Так мы сократили максимальное время обработки с 6–7 до 4–5 секунд и меньше.
Кроме того, нужно было «объяснить» коду, какой сегодня день, потому что расписание и рейсы по будням, выходным и праздникам могли различаться. В этом нам помог дополнительный запрос к базе данных КАТП. Программист заказчика написал дополнительную функцию по списку нестандартных дней, которая фильтровала списки рейсов.
И, наконец, система не позволяла указывать точный адрес некоторых остановок. Мы сделали сводную таблицу для подсказок и вывели из базы координаты, чтобы пользователи понимали, где находится остановка. При нажатии на координаты открывается модальное окно с картой, где отмечена остановка. В базе не все остановки имели конкретный адрес, поэтому мы временно добавили подсказку, что местонахождение остановки может отличаться от реального.
Таблица выглядит следующим образом:
При нажатии появляется модальное окно с картой:
Эти технические вопросы не увели нас от задачи сделать корпоративный сайт. Мы сделали интуитивно понятное меню. Разместили всю необходимую информацию для пассажиров и юрлиц. Чтобы подчеркнуть масштаб компании и её богатую историю, создали разделы с информацией о руководстве, основных вехах в развитии, услугах, оказанных крупным клиентам. Всю контактную информацию сделали кликабельной.
Так выглядит главная страница:
Страница услуг:
Страница контактов:
Блоки сайта сделали с запасом, чтобы можно было разместить больше информации. Вместо карусели категорий меню в мобильной версии разместили выпадающий список. Он управляет и десктопной версией при адаптиве.
На странице «Пассажирам» после получения результата поиска добавили возможность при изменении любого поля фильтра заново выполнять запрос, не нажимая на кнопку «найти». Добавили выпадающий список с поиском пунктов отправления и прибытия по первым буквам. Исключили возможность совпадения пунктов отправления и прибытия, чтобы посетитель случайно не ошибся.
Разместили всю необходимую информацию для юридических лиц и пассажиров транспортных средств. А для того чтобы подчеркнуть масштаб компании и ее богатую историю, сделали разделы с информацией о руководстве, основных вехах в развитии компании, услугах, оказанных крупным клиентам.
Результат
Готовый корпоративный сайт, где можно посмотреть расписание автобусов, узнать номер рейса и получить весь список остановок по нужному маршруту. Также можно узнать контакты филиала для справок и покупки билета.
Для этого мы интегрировали сайт с готовой системой КТУ. База данных со стороны сервиса клиента нуждается в доработке. Более того, запланирован её апгрейд или замена в ближайший год. Поэтому мы подобрали максимально результативное, но временное решение (до изменений в системе заказчика).
Также мы разместили информацию об истории компании и филиалов, рассказали о дополнительных услугах, о жизни предприятия, участии в спортивных мероприятиях и помощи в ЧС.
Что дальше
Через 6–9 мес. планируется запустить онлайн-продажи билетов и он-лайн отслеживание маршрутов.
Полный текст статьи читайте на CMS Magazine
