
Описание
Tarkett — мировой лидер в производстве напольных покрытий. 34 производственных центр, 12 тыс сотрудников по всему миру
Что требовалось
Автоматизировать бизнес-процессы Tarkett, разработав ERP-систему на фреймворке SAPUI5. Взять на себя работу по части frontend-разработки, разработать дизайн. Бэкенд у клиента свой.
До обращения к нам у Tarkett уже была ERP в виде десктопного приложения, но ее технологии и дизайн устарели. Нам нужно было разработать ERP-систему с нуля, создать интерфейс, который по расположению разделов напоминал бы старую версию, но выглядел бы современно и свежо — чтобы для текущих сотрудников переход был легким, а для новых — простым и понятным.
Что сделали
Совместно с командой бэкендеров Tarkett мы разработали ERP-систему, которая оптимизировала бизнес-процессы компании: сократила жизненный цикл сделок, ускорила подготовку отчетности, усилила аналитику и сэкономила время на внутреннее взаимодействие. Теперь бизнес эффективнее управляет ресурсами и быстрее реагирует на изменения.
Объединили все бизнес-процессы компании в единую систему, включая маркетинг, производство, подбор персонала, логистику, закупки, аудит, поставку, подписание документов и т.д — около 118 бизнес-процессов
Разработали дизайн
Реализовали дашборд, систему виджетов, схему протекания бизнес-процессов
Вывели список материалов > 50 тыс наименований (каталог)
Разработали чаты с сотрудниками
Настроили интеграцию с КриптоПро, Яндекс.Картами, Sentry
Разработали функционал по работе с ЭДО — возможность пользоваться электронной подписью, загружать и скачивать документы с разными расширениями, работать над одним документом несколькими сотрудниками сразу, автоматически проверять подлинность документов
Этапы разработки
Дизайн
В дизайне ERP самое главное — создать понятный визуальный интерфейс для оперативного просмотра и анализа данных. Нельзя просто взять и сделать это без подготовки. Сначала нужно выяснить, что действительно важно пользователям:
Какие данные они используют чаще
Как с ними взаимодействуют
В дизайне ERP самое главное — создать понятный визуальный интерфейс для оперативного просмотра и анализа данных. Нельзя просто взять и сделать это без подготовки. Сначала нужно выяснить, что действительно важно пользователям:

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

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

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

Разработка
Особенность проекта в том, что мы работали в коллаборации с бэкендерами клиента, взяв на себя задачи по разработке пользовательской части. Бэкенд подготавливал нам API, по которому мы реализовывали фронтенд.
Два раза в неделю мы встречались на созвонах. Вопросы по внедрению нового функционала решались группой директоров на стороне клиента, а затем в виде задач заносились в таск-трекер. За счет того, что ЛПРы были вовлечены, мы узнавали о процессах из первых уст, поэтому аналитика к проекту мы не привлекали.
Визуальную часть ERP мы реализовывали по методу TDD — это разработка через тестирование. Сначала пишется тест, а затем код, который будет тестироваться. Тест содержит проверки условий, которые могут либо выполняться, либо нет. Когда они выполняются, говорят, что тест пройден.
При такой разработке приходится писать много кода, но в конечном счете это экономит время. Если устранять баги на ранних этапах, можно избежать ошибок, которые потребуют долгой отладки в будущем.
ERP-система Tarkett — это высоконагруженная платформа, объем данных в которой измеряется десятками тысяч килобайт. Например, за день может поступить свыше тысячи подписанных документов, а в самой программе хранится более 50 тысяч материалов. Из-за этого многие наименования могут совпадать по некоторым параметрам, что создает путаницу. Чтобы решить проблему, мы разработали кастомный каталог, который помогает точно определить значения для разных товаров.

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

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

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

Мы упростили процесс подписания документов, настроив интеграцию с КриптоПро для создания и проверки электронной подписи. Реализовали возможность групповой работы над ЭДО, разработали процесс верификации для проверки подлинности документов и добавили возможность загружать и скачивать файлы различных форматов, таких как png, doc и другие.
Также мы настроили автоматический деплой проекта, чтобы обновления происходили без ручного вмешательства, минимум два раза в неделю.
Тестирование
Для поиска и устранения ошибок мы настроили интеграцию с Sentry. Эта программа показывает сбои в коде в реальном времени и предоставляет информацию, необходимую для их исправления.

Интеграция с Sentry сэкономила время, так как раньше тестирование стояло отдельной задачей, а теперь ошибки обнаруживаются и исправляются автоматически.
Результат
Благодаря централизации и автоматизации процессов, кастомная ERP оптимизировала бизнес-процессы Tarkett:
Сэкономила время на внутреннее взаимодействие
Чаты, единое хранилище и ЭДО упростило общение между отделами, меньше времени уходит на координацию и обмен информацией
Ускорила принятие управленческих решений
У руководителей есть доступ к ключевой информации. Реакция на изменения рынка стала быстрее, а стратегическое планирование точнее
Сократила ручные операции
Автоматизация рутинных задач повысила производительность компании. Теперь Tarkett тратит меньше ресурсов на типовые операции
Ускорила подготовку отчетности
Теперь данные обновляются в реальном времени, а аналитические инструменты предоставляют быструю и точную информацию
Повысила прозрачность и контроль
Инструменты мониторинга и анализа дали полное представление о текущих процессах. Руководители могут управлять KPI и выявлять узкие места
Улучшила взаимодействие с клиентами и партнерами
Инструменты CRM и интеграция с клиентскими порталами повысили качество взаимодействия с партнерами. Заявки теперь обрабатываются быстрее
Какой функционал реализован в EPR
Меню и экраны общих и внутренних бизнес-процессов, включая маркетинг, производство, подбор персонала, логистику, закупки, аудит, поставку, подписание документов и т.д — около 118 бизнес-процессов
Дашборд, позволяющий сотрудникам видеть рабочие операции и отслеживать статистику по ним
Система виджетов и отображение бизнес-процессов, показывающие жизненный цикл задачи
Кастомный каталог материалов
Пагинация для ускорения загрузки страниц
Чат и роутинг диалогового окна
Инструменты для работы с документами — групповая работа, электронная подпись, верификация, загрузка и скачивание разных расширений — png, doc и др
Интеграция со сторонними сервисами — Яндекс.Картами, КриптоПро и Sentry
Корректировки конфигурации и SSI-сертификатов для поддержания работы сайта

На данный момент проект на техподдержке. С этого года Tarkett сосредоточены на разработке 1С База данных, так как SAP частично заблокирован в РФ. Мы импортировали фреймворк на локальное пространство проекта, чтобы версия ERP на SAPUI5 продолжала работать даже при полной блокировке.
Команда проекта
Никита З. — менеджер проекта
Сергей Ш. — мастер проекта, frontend
Сергей К. — frontend
Никита Р. — frontend