Дизайн веб-приложения для сервиса мониторинга.
Требуется создать UI/UX дизайн небольшого веб-приложения. Пока только дизайн, верстка не нужна.
Краткое описание системы:
Есть удаленные объекты мониторинга. С них данные поступают на сервер. Собираемые данные такие: температура, давление, энергия, объем, и др. Кроме этого объект мониторинга характеризуется состоянием. Список возможных состояний: неопределенное состояние, устаревшие данные, все нормально, есть нештатная ситуация.
Собираемые данные и состояния объектов мониторинга надо отображать.
Как я себе представляю UI: Есть основная страница, где отображены все объекты мониторинга. Сколько их может быть? – По разному. Иногда до 10-20. Максимум - около 200. На первой странице должны быть показаны все. Каждый объект мониторинга на этой странице назовем элементом.
В каждом элементе отображена некоторая информация.
Если элементов очень много, то понятно, что много информации в одном элементе не разместить, в этом случае важен цвет элемента (означает его состояние), некоторая иконка объекта, и минимум другой информации. При наведении мышкой на элемент должен быть tooltip с расширенной информацией.
Если элементов мало (как сейчас), то информации на самом элементе может быть больше. Цвет элемента зависит от состояния.
Сейчас так: неопределенное состояние – серый цвет, устаревшие данные – оранжевый цвет, все нормально – зеленый цвет, есть нештатные ситуации – красный цвет.
При нажатии на элемент попадаем на страницу с детальной информацией об объекте мониторинга. Там все оперативные данные, плюс можно запрашивать архивные данные (отображаются в виде таблицы), запрашивать отчеты (результат – ссылка для скачивания отчета). Еще будет график (сейчас нет, но планирую, что он будет "за одно" с архивными данными).
На странице с детальной информацией должен быть переход на основную страницу (приложение может работать в полноэкранном режиме, и другого пути перейти обратно - нет)
Должно быть все просто и лаконично.
Скриншоты рабочего прототипа в аттаче.
Пожалуй, все. Я описал мое видение. Возможно, можно сделать по-другому. Буду рад услышать/увидеть другие предложения.
Если описал непонятно - отвечу на любые вопросы, могу дать ссылку на прототип.
Итак, предполагаемый список артефактов:
Основная страница со списком всех объектов, когда их 150 штук (с тултипом).
Основная страница со списком всех объектов, когда их 10 штук или меньше.
Страница с детальной информацией (только оперативные данные)
Страница с детальной информацией (архивные данные + график)
Страница с детальной информацией (запрос/результат отчета)