Разработка демонстрационного веб-дашборда SCADA/HMI

Требуется создать веб-приложение (дашборд) для мониторинга состояния промышленного оборудования. Система должна визуализировать работу таких объектов, как насосы, теплообменники, датчики давления и температуры, на интерактивной карте или схеме технологического процесса.

Основные цели проекта

Демонстрация принципов работы современных веб-систем SCADA (диспетчеризации) и HMI (человеко-машинного интерфейса).
Создание наглядного, интуитивно понятного интерфейса для отслеживания состояния оборудования в реальном времени.
Реализация базовой логики, аналогичной промышленным системам, но в упрощенном демонстрационном варианте.

Ключевые функциональные требования

1. Визуализация и карта объекта

Главный экран должен содержать схематическую карту или план технологического объекта.
На карте размещаются интерактивные пиктограммы (виджеты) оборудования: насосы, теплообменники, резервуары, датчики.
Внешний вид виджетов должен динамически меняться в зависимости от состояния (норма, авария, предупреждение, отключен).
По клику на элемент открывается панель с детальной информацией и историей.

2. Мониторинг в реальном времени

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

3. Панель событий и аварий

Лента или список событий в хронологическом порядке.
Фильтрация событий по типу (авария, предупреждение, информационное) и по объекту.
Визуальное выделение новых и непрочитанных аварийных сообщений.

4. Базовая аналитика и отчеты

Возможность просмотра графиков изменения ключевых параметров за выбранный период.
Формирование простых отчетов о состоянии системы.

5. Административный интерфейс

Возможность настройки карты объекта (добавление/удаление элементов).
Управление параметрами симуляции данных для демонстрации.
Настройка пороговых значений для срабатывания аварийных сигналов.

Технические и дизайн-требования

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

Референсы и примеры

Заказчик предоставил примеры интерфейсов, на которые стоит ориентироваться:

Пример веб-интерфейса SCADA-системы (предоставлен в виде архива).
Видео-пример функционала, начиная с 55-й секунды (ссылка предоставлена).

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

Важные условия

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

дизайн