Редизайн SCADA-редактора Horocycle для адронного коллайдера NICA
- Моя роль
- Продуктовый дизайнер
- Зона ответственности
- UX-аудит, интервью, продуктовые гипотезы, wireframes, UI-дизайн, UX-тест, передача макетов в разработку
- Результат
- −32% времени старта проекта, −34% до первого элемента, −26% редактирования объекта
Контекст
Horocycle — программа для работы со SCADA-проектами, которая используется в ОИЯИ в рамках проекта адронного коллайдера NICA. Инженер создаёт и открывает в ней проекты, работает с деревом структуры, графическими экранами, объектами, переменными и настройками.
Главная сложность — много рабочих зон и технических сценариев. Задача дизайна: сделать интерфейс понятнее, быстрее в работе и удобнее при редактировании элементов.
Главный экран
Рабочая область
Настройки
Отвечал за UX-логику и интерфейс редактора
Нужно было сделать сложный технический продукт понятнее: чтобы инженер быстрее начинал работу с проектом, ориентировался в структуре и редактировал объекты без лишних переходов.
- Анализировал структуру редактора
- Изучал сценарии создания и открытия проектов
- Искал проблемы в навигации, дереве проекта и настройках
- Формулировал продуктовые гипотезы
- Проектировал структуру экранов
- Создавал wireframes и финальный UI
- Продумывал панели, состояния, вкладки и свойства объектов
- Готовил макеты для разработки
Начал с аудита старой версии
Сначала нужно было понять, где пользователю неудобно и что мешает быстро работать с проектами. Дальше — десять шагов от аудита до доработки.
Аудит→Слабые места→Фидбек команды→Действия пользователя→Гипотезы→Метрики→Новая структура→Макеты в Figma→UX-тест→Доработка
Интерфейс перегружен и не задаёт приоритетов
Вместе с техническими специалистами проверили интерфейс на ключевых сценариях и разобрали три экрана.
Проблема в общей сложности, а не в кнопках
Мы собрали обратную связь от команды и технических специалистов, которые понимают логику SCADA-проектов. Чаще всего отмечали:
- Нужен быстрый доступ к созданию и открытию проекта
- Последние проекты должны быть видны сразу
- В дереве важно разделить объекты, экраны, программы и переменные
- На пустом экране нужна подсказка, как добавить первый элемент
- Свойства объекта должны быть доступны без отдельного окна
- Настройки нужно разделить по категориям
UX-тест старой версии показал потерю времени на старте
Проверили на четырёх респондентах семь сценариев инженера: создать проект, открыть проект, вернуться к недавнему, найти экран в дереве, добавить первый элемент, открыть свойства объекта и найти параметр в настройках.
Пользователь терял время на старте, поиске проекта, ориентации в структуре и настройке объектов. Вывод: интерфейс нужно перестроить вокруг быстрого старта, понятной структуры проекта и удобного редактирования объектов.
Гипотеза: старт, структура и панель свойств
На брейншторме с разработчиком, техническим специалистом и заказчиком выделили главные проблемы: сложный старт, слабая навигация по дереву, пустая рабочая область без подсказок, трудный доступ к свойствам и перегруженные настройки.
Главная гипотеза
Если упростить старт, сделать структуру проекта понятнее и вынести свойства объекта в отдельную панель, пользователь быстрее создаст и отредактирует SCADA-проект.
Классических метрик вроде MAU, retention или conversion для профессионального инструмента было недостаточно. Поэтому проблему подтверждали разбором сценариев: создание и открытие проекта, навигация по дереву, добавление первого элемента, работа с правой панелью и структура настроек.
Интервью подтвердили запрос на быстрый доступ к проектам
Поговорил с инженерами и техническими специалистами, которые создают, настраивают и редактируют SCADA-проекты. Проверял, как они начинают работу, находят последние проекты, ориентируются в дереве, добавляют первый элемент, ищут свойства и настройки.
Страх потерять проект
Пользователи переживали за сохранность работы при долгих сессиях и вылетах системы.
Возвращаются к одним и тем же проектам
Хотят открывать их быстрее, без поиска по папкам.
Две группы пользователей
Инженер-разработчик SCADA-проектов
Создаёт проекты, собирает экраны и объекты, много времени проводит в рабочей области.
Технический специалист
Настраивает структуру проекта и параметры, чаще работает с деревом, свойствами и настройками.
Выбрал метрики скорости, успешности и качества
Смотрел не на внешний вид, а на понятные показатели: как быстро пользователь начинает работу, добавляет первый элемент и редактирует объект, и как часто при этом ошибается.
Time to start project
Время, за которое пользователь создаёт новый проект или открывает существующий. Отдельный вариант — Time to reopen project: возврат к недавнему проекту.
Time to first element
Время от открытия проекта до добавления первого элемента в рабочую область.
Time to edit object
Время, за которое пользователь выбирает объект и изменяет его свойства.
Task success rate
Доля сценариев, которые пользователь довёл до конца: открыть проект, найти экран, добавить элемент, изменить свойства или настройку. Отдельный вариант — Settings task success rate: задачи в разделе настроек.
Time to find object / screen
Время, за которое пользователь находит нужный объект или экран в дереве проекта.
Configuration Error Rate
Доля операций настройки, выполненных с ошибкой.
Rework Rate
Доля операций, которые пришлось переделывать.
Шесть гипотез, четыре из них в первую очередь
Приоритизировал по влиянию на пользователя, влиянию на проект и сложности. В первую очередь (приоритеты 1–4) взяли те, что сильнее всего ускоряют старт, ориентацию в системе и редактирование объектов.
| Гипотеза | Метрика | Приоритет |
|---|---|---|
| Быстрое создание и открытие проекта на главном экране | Time to start project | 1 |
| Список последних проектов | Time to reopen project | 2 |
| Дерево с понятной структурой: объекты, источники, программы, переменные, диагностика | Time to find object / screen | 3 |
| Правая панель свойств объекта | Time to edit object | 4 |
| Empty state в рабочей области | Time to first element | 5 |
| Настройки по категориям: общие, экран, редактор ST, редактор FBD, мышь | Settings task success rate | 6 |
Добавил идеи, которые появились в ходе исследования
Во время интервью, теста и обсуждения сценариев появились решения для ежедневной работы инженеров.
Быстрый доступ к сохранениям
Избранные проекты, автосохранение и облачное хранение.
Миникарта
Помогает ориентироваться в больших схемах и понимать текущую область просмотра.
UX-тест нового интерфейса подтвердил решения
Дал четырём респондентам восемь заданий: создать проект, открыть один из последних, найти в дереве «Экран 3», добавить первый элемент, найти свойства экрана, открыть настройки, найти автосохранение и раздел про редактор FBD.
- Стартовый экран поняли сразу: основные действия на виду
- Дерево помогло быстрее ориентироваться в структуре
- Empty state подсказал, как добавить первый элемент
- Правая панель ускорила редактирование без отдельных окон
- Настройки стали понятнее за счёт категорий
Старт, первый элемент и редактирование стали быстрее на 26–34%
Главный экран ускорил старт, а empty state — добавление первого элемента. Свойства выбранного элемента вынесены в правую панель, поэтому не нужно искать параметры в отдельных окнах.
время старта проекта: 1:35 → 1:05
время до первого элемента: 2:40 → 1:45
время редактирования объекта: 4:10 → 3:05
Сравнение на UX-тестах старой и новой версии, в каждом по четыре респондента. Время — медианное. По всем метрикам скорости оно сократилось на 26–44% в зависимости от сценария.
| Метрика | До | После | Изменение |
|---|---|---|---|
| Time to start project | 1:35 | 1:05 | −32% |
| Time to reopen project | 0:45 | 0:25 | −44% |
| Time to first element | 2:40 | 1:45 | −34% |
| Time to edit object | 4:10 | 3:05 | −26% |
| Time to find object / screen | 1:20 | 0:50 | −38% |
| Task success rate | 100% | 100% | без изменений |
| Settings task success rate | 100% | 100% | без изменений |
Доля сценариев, доведённых до конца, осталась 100%: инженеры справлялись с задачами и в старой версии. Выигрыш — во времени и в числе ошибок.
Ошибки и переделки тоже стали реже:
| Метрика | До | После | Изменение |
|---|---|---|---|
| Configuration Error Rate | 12% | 8% | −33% |
| Rework Rate | 18% | 12% | −33% |
Мы не просто обновили внешний вид, а пересобрали основной сценарий работы инженера со SCADA-проектом:
- Старт стал понятнее. Создать проект, открыть файл или вернуться к недавнему можно с главного экрана.
- Навигация проще. Дерево разделяет экраны, объекты, переменные и программы.
- Первый элемент очевиднее. Empty state говорит, что делать на пустом экране.
- Редактирование быстрее. Свойства объекта всегда под рукой в правой панели.
- Настройки понятнее. Разделы сгруппированы по смыслу.
- Есть задел на будущее. Избранные проекты, автосохранение, облачные сохранения и миникарта.
