переключайтесь между страницами кнопками
или клавишами ← и → на клавиатуре

Панель инсталляций

Административная панель для управления установкой оборудования

Панель инсталляций — реестр установщиков
Обзор

Продукт: внутренний инструмент для отслеживания процесса монтажа умных камер и устройств на транспортные средства. Менеджеры контролируют статус установок в разрезе компаний-клиентов, типов транспорта и команд установщиков.

Задача

Данные по установкам были раскиданы по разным местам: разделы жили каждый сам по себе. Нужно было собрать всё в единый портал с тремя связанными модулями:

  • группы установок;
  • реестр установщиков;
  • привязанный транспорт.
Панель инсталляций
Ход работы
[1]

Перед ТЗ поресёрчил паттерны админ-панелей: увидел, что в них по максимуму переиспользуют одни и те же сущности, а консистентность стоит на первом месте, потому что админка обязана быть однородной.

[2]

Работал в связке с дизайн-лидом, вели проект вместе.

[3]

Подобрал формат под тип данных, а не один шаблон на всё: таблица для групп установок, чтобы проще агрегировать и фильтровать; карточки для транспорта, чтобы модель считывалась по картинке, а не по тексту.

[4]

Консистентность в деле: профиль установщика и форма его создания используют одну и ту же структуру, один паттерн для чтения и записи.

Панель инсталляций
6 экранов: сквозная навигация
[1] Список групп установок

Группы установок. Сводный список: клиент, тип транспорта, статус, количество единиц, с фильтром по статусу и компании. Выбрал таблицу: с ней проще агрегировать и фильтровать, а строк может быть сколько угодно, ничего не потеряется.

[2] Детали установки

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

[3] Вид по отделу

Собрал все установки конкретного отдела в одном месте, чтобы не листать их по одной.

[4] Список установщиков

Собрал реестр установщиков с поиском по имени, статусу, числу активных заданий и компании, чтобы находить нужного монтажника за секунды. Клик по строке ведёт в профиль.

[5] Профиль установщика

Собрал в профиле установщика всю историю и текущую нагрузку сразу (назначенные ТС, группы, контакты), чтобы не запрашивать это по частям.

[5.1] Создание установщика

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

[6] Список транспортных средств

Транспортные средства. Список ТС: тип, номер, статус установки, назначенный установщик. Здесь выбрал карточки, а не таблицу: важно узнать модель по картинке, а не читать текст.

Панель инсталляций
Результат
[1]

Менеджер видит все группы установок в одном месте и фильтрует по статусу и клиенту.

[2]

Из любой группы переходит в детали конкретной инсталляции и отдела за один клик, без потери контекста.

[3]

Реестр установщиков с поиском; профиль и форма создания используют одну и ту же структуру.

Единый портал — группы установок
[4]

Транспортные средства разных типов показаны в едином формате с визуальным различением по иконке типа.

[5]

Портал полностью закрыл ТЗ: менеджер видит все группы установок, фильтрует, проваливается в детали любой инсталляции, отдела или установщика. Структура везде одна и та же.

Панель инсталляций
← Ко всем кейсам