KapDev

Автоматизация формирования первичных документов логистической компании

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

Рассказываем как мы разработали систему автоматизации форирования и учёта первичной документации в логистической компании.

two-standing-smartphones-mockup.png

Почему к нам обратились

Заказчику требовалось разработать интеграцию своего бизнеса с Shopify (мы, кстати, в нём эксперты). Изначально это планировалось как разработка для внутреннего пользования, которую после отладки бизнес-процессов можно было выпустить на рынок и предлагать своим клиентам.

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

Какой набор инструментов требовался

  • Shopify интеграция
  • Мобильное приложение
  • Админ-панель

Back-end и Shopify интеграция

Классическое Shopify приложение с монолитным back-end'ом на Python и front-end'ом на React с использованием UI-kit от Shopify. Здесь не было ничего сложного, по большей мере обычные CRUD операции, REST API и обработка веб-хуков.

Из фишек бэкенда можно выделить то, что у заказчика было одно конкретное требование - загружать первичку по FTP.

komerk-system.png

Панель администратора и настройки

Настройки для работы с Shopify происходили внутри инфраструктуры платформы, front-end по их стандартному протоколу вставлялся через iframe.

Прочая адинистративная работа, включая управление доступами, пользователями и т.д. происходила через отдельную front-end админку.

49d41b952c.png

Мобильное приложение

Разработано на React Native, включает в себя функционал просмотра загруженной первички, авторизации, ручного сканирования документов, постановку задач сотрудникам/коллегам, настройки личного профиля.

iphone-x-mockup-charts.png

Самое интересное

Это чтение информации с накладных и преобразование их в структурированную информацию. Видели подобное в банках, когда загружали платёжки? Мы сделали то же самое.

Front-end (мобильное приложение) делает фото накладной, back-end анализирует изображение, если находит на нём накладную, в мобильном приложении появляется кнопка "отправить", после чего back-end нормализует фотографию, удаляет лишнее, преводит в gray-scale и т.д., после чего применяется OCR.

P.S. Не обязательно делать фотографию физического документа, можно загрузить PDF или PNG через мобильное приложение.

iphone-x-mockup-qr-selected.png