Kilo IoT

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

B2B / B2B2C / B2B2B / PRODUCT DESIGN
Роль
Product Designer / Product Analyst
Период
2024–2026
Команда
Product owner, разработчики, QA и дизайнеры
Ограничения
NDA: данные и часть визуальных деталей изменены
/ 001

Контекст

Kilo IoT — B2B-платформа, которая развивается в моделях B2B2C и B2B2B. Пользователь работает не с одним экраном, а с цепочкой зависимых сущностей: коннектор передаёт данные, устройство хранит метрики, виджет показывает их, а правило или аларм реагирует на изменения.

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

/ 002

Подключение устройств

У LoRaWAN, MQTT и трекеров разная техническая логика. Пользователь при этом хочет получить один понятный ответ: что подключать, какие данные понадобятся и что делать, если соединение не работает.

  • Разделили выбор подключения и его настройку.
  • Сделали отдельные ветки для облачного и внешнего MQTT.
  • Добавили состояния проверки и ошибки.
  • Связали коннекторы со списком устройств.
Сценарии подключения устройств Kilo IoT
Рабочая карта сценариев: LoRaWAN, MQTT и tracker connector.
/ 003

Дашборды и управление

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

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

Экран редактирования дашборда Kilo IoT с управляющими виджетами
Экран редактирования дашборда с управляющими виджетами.
Управляющие виджеты Kilo IoT: switch, button, slider и input
Проработка switch, button, slider и input во всех состояниях.
/ 004

Алармы

Здесь важно было развести само событие и правило, которое его создаёт. Мы разделили входящие срабатывания, определения алармов и настройки, а сложные параметры собрали в последовательный сценарий.

Алармы Kilo IoT: inbox, определения и расписания
Inbox, определения алармов, расписания и настройки.
/ 005

Дилерская модель

Следующим уровнем стала B2B2B-модель. Дилер управляет клиентами, сотрудниками, тарифами и white label, а иногда входит в организацию клиента для поддержки.

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

Структура дилерской панели Kilo IoT
Структура дилерской панели и различия между ролями.
/ 006

AI-агент

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

AI-агент Kilo IoT — сценарий чата и переход к действиям
Первый сценарий чата и переход к действиям внутри платформы.
/ 007

Дизайн-система

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

Цветовые токены дизайн-системы Kilo IoT
Цветовые токены светлой темы. В библиотеке также типографика, формы, контроллеры и паттерны.
/ 008

Результат

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

Главный результат моей работы на стадии MVP — согласованная модель продукта, проработанные сценарии и система, которую команда может дальше развивать.

Следующий кейсКреатор →