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