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

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

Services

UI/UX Design
Frontend Development
Backend Development
QA Management

Technologies

React (TypeScript)
Nest (TypeScript)
MySQL
Docker
CI/CD

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

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

Заказчик

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

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

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

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

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

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

Кроппер

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

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

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

Наша задача

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

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

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

Экраны

  • Мои задачи

1

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

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

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

  • Сотрудники

2

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

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

  • Доски

4

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

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

  • Команды

7

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

Результат

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