Smart Balancing

Smart Balancing — Flex4

Проектирование cross-platform флоу для инженерного оборудования

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

Дизайн-задача — превратить старые mobile и web-решения в один связный продукт, сохранив разные сценарии для телефона и планшета.

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

3 месяца

аутсорс проект

Изучение требований

Анализ старой версии

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

Базовый сценарий

Пользователь заходит в приложение. Видит доступное оборудование. Подключает его и переходит к настройке. Сценарий простой и повторяется чаще всего — поэтому он стал основой для всего интерфейса.

Настройка

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

Данные

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

Flex 2

Сборка первой версии

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

Поиск датчиков

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

Настройка

Для выбора типа использовал степпер и чипсы. После ревью убрали одноразовые действия вроде «открыть / закрыть клапан» и оставили только основные шаги. График вынес в нижнюю панель. Это упростило экран и сделало сценарий понятнее. Решение опиралось на современные паттерны и реальное поведение пользователей.

Графики

Не все идеи сработали с первого раза.От действий через нижнюю панель пришлось отказаться — пользователям было неудобно. В итоге оставили поп-апы. Чипсы для навигации сохранили. Этого набора экранов хватило, чтобы определиться со стилем, проверить гипотезы и спокойно доделать остальную часть продукта.

Планшет

Адаптация для планшета

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

Планшет

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

Логи

Большие объёмы данных читать заметно проще. Навигация всегда перед глазами. Меньше переходов. Меньше лишних действий.

Брендирование

Палитра адаптирована под 15 брендов. Интерфейс автоматически подстраивается под основной цвет бренда. Визуальная целостность сохраняется во всех конфигурациях.

Выводы