ZeroDark: управление персоналом и задачами для судоверфи

ZeroDark — веб-приложение для управления персоналом и задачами на судоверфи Ophardt Maritim. Система позволяет менеджерам контролировать команды и производственные процессы изготовления моторных лодок. В приложении три основных роли: менеджер, сотрудник и системный администратор.

Разработку завершили, полностью протестировали и выпустили приложение за 3 месяца.

Заказчик

Ophardt Maritim входит в состав международной группы компаний OPHARDT. Компания производит надёжные и доступные алюминиевые лодки для массового производства, разрабатывает новые корпуса и конструкции судов.

Технические решения

Канбан-доска

Разработали канбан-доску по образцу Trello, специально адаптированную под это приложение. Реализована с применением нескольких технологий. Функция drag’n’drop обеспечивает плавное перемещение задач между колонками. Через WebSocket участники доски видят изменения в режиме реального времени.

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

Адаптивные изображения

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

Кроппер

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

Поэтапная загрузка

Использовали поэтапную загрузку, методы React и конфигурацию webpack для загрузки только необходимых ресурсов на странице. Это экономит трафик и подгружает только нужные данные.

Наша задача

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

Менеджеры получают доступ к производственным задачам каждого сотрудника, видят оставшееся время, могут оставлять комментарии и менять статусы задач вместе с сотрудниками.

Все внутренние процессы и их взаимосвязи отображены в единой системе — управление построено интуитивно, по принципам Kanban.

Экраны

• Мои задачи

Менеджеры видят все свои задачи. Оставшееся время обозначено цветом:

Зелёный — прошло 0–33% времени, задача только началась. Оранжевый, 33–66% — время ещё есть. Красный, 66–100% — дедлайн близко.

У менеджера и сотрудника может быть несколько общих задач и одна специальная (STC). Клик по задаче открывает модальное окно с информацией о ней. Менеджер может менять статус задачи и оставлять комментарии.

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

• Сотрудники

Раздел содержит список сотрудников с информацией о них: подразделение, имя и фамилия, команда, статус задачи и другое.

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

• Доски

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

Задачи сгруппированы по статусу: черновики, в работе, на проверке и завершённые.

• Команды

Администратор создаёт команды по направлениям деятельности. Каждая команда отвечает за отдельный проект и представлена в виде доски со всеми связанными задачами.

Реальное тестирование, а не только демо

Каждый релиз проходил через структурированное QA по письменному ТЗ, включая тестирование по регионам — со сменой локали устройства на каждую, где работает приложение. Именно так наша команда ловила проблемы вроде путаницы в формате даты и вёрстки, специфичной для локали, ещё до того, как их видели рабочие на производстве. Подробнее о процессе QA мобильного приложения — в отдельной статье.

Результат

Команда Симплео построила адаптивную CRM-систему для отслеживания задач сотрудников и статуса их выполнения. Бумажный документооборот ушёл в прошлое. Все внутренние процессы судоверфи теперь живут в одной системе.