Как мы разрабатывали приложение с сибирским характером для суровых дальнобойщиков (и победили Яндекс Карты)

Пиробайт на связи ✌ Сегодня расскажем, как оптимизировали бизнес, автоматизировав работу суровых дальнобойщиков, потому что вопрос эффективности сегодня чуть ли не самый острый.
(Рекомендуем читать кейс под «Тихий огонёк моей души» :)

О нашем заказчике. Им стала стала крупнейшая дистрибьюторская и логистическая компания в восточно-сибирском регионе — «‎Сервико-Авто‎». Владелец обратился к нам за разработкой приложения для планшета.

До этого их сотрудники пользовались обычным навигатором — открыли и поехали, а на контрольных точках отписывались менеджеру. Ни на какую оптимизацию тогда не было и намека.

Основные проблемы были такими:

водитель не успевал приехать к месту погрузки/разгрузки к нужному времени;
в рейсах терялись важные документы;
навигаторы не показывали маршруты и ограничения для грузового транспорта.

«‎Сервико-Авто‎» нужно было оптимизировать бизнес: распустить лишний штат, навести порядок в документообороте и сохранить ценный ресурс — время, чтобы водитель не заезжал куда не надо.

Разработать приложение, которое бы автоматизировало бизнес-процессы заказчика и упростило коммуникацию между водителем и логистом. Для сотрудников бы оно стало основным инструментом для работы, а для компании удобным средством контроля.

У нас все получилось, результатами поделились в конце. А сейчас расскажем немного про процессы и трудности, с которыми столкнулись, особенно во время разработки ( ° ʖ °)

Без этого в работе не интересно, согласитесь? :)

Куда ж без нее?

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

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

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

Изначально описали ее в Google Docs.

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

С этим пунктом вышло все гладко: мы уже работали примерно с такими же расчетами

После запуска MVP собрали обратную связь от водителей. Выяснилось, что во время движения им мешали всплывающие системные уведомления. В теории все было правильно. На практике оказалось по-другому. Этот момент пришлось дорабатывать.
Николай Оноприенко, аналитик Pyrobyte

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

На прототипе видно, как расположены блоки, по ним можно кликать, открывать попапы и исследовать меню

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

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

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

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

Бонусом разработали новый логотип и фирменный стиль.

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

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

Эту функцию делали через Lottie

Lottie — библиотека для iOS, Android и веб-разработки, которая позволяет рендерить анимацию и проигрывать ее в приложении в реальном времени. Подробная статья об этом есть у нас на Habr.

А вот теперь, как и обещали в начале кейса

Препятствие первое: расхождение координат объектов и устройства

Когда мы разрабатывали собственный навигатор, то при первом внедрении логики построения маршрута столкнулись с тем, что местоположение водителя отображается неправильно. Метка «шагала» где-то сбоку, параллельно полосе маршрута.

Так происходило потому, что координаты реального устройства и координаты объектов на карте — то есть самой дороги — не совпадали

Эту проблему решили, нарисовав метку на нужной нам координате. Она прикрепилась к полосе и теперь движется по маршруту вместе с водителем.

Препятствие второе: метки расходились из-за помех с GPS

При определении координат устройства у GPS-приемника часто случались помехи. Из-за них метка отскакивала от реального местоположения водителя аж на несколько километров. Такие перебои портили всю работу — как логистам оптимизировать время водителей, если им приходят некорректные уведомления о движении дальнобойщиков? Да никак ¯\_(ツ)_/¯

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

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

Если полученная координата не удовлетворяет хотя бы одному из этих условий, она отбрасывается.

Препятствие третье: метки не всегда следовали за водителем

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

Этот момент мы доработали, сделав серую метку. Когда водитель едет по запланированному маршруту — метка синяя, когда отклоняется от него (например, человек заезжает на ТО) — она делается серой. Когда шофер возвращается на свою дорогу, его метка снова становится синей, а незапланированный путь до ТО стирается.

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

Следили, чтобы нигде ничего не поехало, а новые функции работали корректно

Если водитель отклоняется более, чем на 20 км, маршрут перестраивается, и логисту приходит уведомление. Но сложность в том, что это не всегда работает. Трудно отследить именно эти 20 км. Приходилось сверяться с гугл-картами, после чего в эмуляторе выверять все до пикселя.
Юрий, тестировщик Pyrobyte

Геолокация — наша основная фишка, и эмулятор был в тему. На планшете такое провернуть нельзя, поэтому выбрали его.

Тестировали и на реальном устройстве — планшете Samsung. У компании есть корпоративные устройства, мы купили себе такие же.

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

Вот, что теперь появилось у логистов:

Уведомления. Каждые 8 часов им приходят оповещения о том, опаздывает водитель или идет в графике. Теперь они могут скорректировать следующий маршрут;
Логист может отправлять оповещения как конкретному человеку, так и всем водителям сразу;
Может удаленно отключать водителя от системы, если понадобилось запретить доступ к приложению.

Вот что появилось у водителей:

Встроенный навигатор для крупнотоннажных авто;
Система «‎дорожные сети», которая реализована в виде получения точек и их отображения на карте. Теперь водитель видит заправки, парковки, шиномонтаж, автомойки и опасные точки!
Возможность отправить документы по заявке через приложение. Бумаги можно сфотографировать через камеру планшета и отправить менеджеру, это ускорит документооборот;
Уведомления. Теперь водитель сможет получать сообщения о ДТП, изменениях в работе и новых заявках.
У него есть возможность узнать актуальные новости в приложении с портала ati.su, которую мы реализовали с помощью парсинга новостей.
Он может скачать шаблоны типовых документов и посмотреть гайд по работе с приложением, которые мы добавили.

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

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

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

Если хотите заказать разработку похожего приложения (или любого другого) — пишите!

Подготовим для вас предварительный расчет и красивое КП :)

Чтобы не пропустить интересное, оставайтесь на связи с Пиробайт
в TG-канале
в ВКонтакте
на нашем сайте

Если у вас есть задача разработать сайт или мобильное приложение, то напишите в Телеграм, мы это обсудим: https://t.me/sashadzen

Заказать разработку сайта, веб-сервиса или мобильного приложения на нашем сайте: https://vk.cc/cuglQZ

Партнерская программа, где мы платим от 10 000 до 200 000 рублей за контакты тех, кому нужен дизайн или разработка: https://vk.cc/cuglXT

Телеграм-канал Саши Комбарова про управление агентством, проектами, людьми: https://t.me/sasha_kombarov

Телеграм-бот, который бесплатно выдает чек-листы, памятки и регламенты по управлению, маркетингу, аналитике, дизайну и разработке: https://t.me/regulations_pyro_bot