Редизайн SCADA-редактора Horocycle для адронного коллайдера NICA
Моя роль
Продуктовый дизайнер
Зона ответственности
UX-аудит, интервью, продуктовые гипотезы, wireframes, UI-дизайн, UX-тест, передача макетов в разработку
Результат
−26% медианного времени настройки объекта
Контекст
Horocycle — программа для работы со SCADA-проектами, которая используется в ОИЯИ в рамках проекта адронного коллайдера NICA. Инженер создаёт и открывает в ней проекты, работает с деревом структуры, графическими экранами, объектами, переменными и настройками.
Главная сложность — много рабочих зон и технических сценариев. Задача дизайна: сделать интерфейс понятнее, быстрее в работе и удобнее при редактировании элементов.
Главный экран
Было
Стало
Рабочая область
Было
Стало
Настройки
Было
Стало
Отвечал за UX-логику и интерфейс редактора
Нужно было сделать сложный технический продукт понятнее: чтобы инженер быстрее начинал работу с проектом, ориентировался в структуре и редактировал объекты без лишних переходов.
Анализировал структуру редактора
Изучал сценарии создания и открытия проектов
Искал проблемы в навигации, дереве проекта и настройках
Формулировал продуктовые гипотезы
Проектировал структуру экранов
Создавал wireframes и финальный UI
Продумывал панели, состояния, вкладки и свойства объектов
Готовил макеты для разработки
Начал с аудита старой версии
Сначала нужно было понять, где пользователю неудобно и что мешает быстро работать с проектами. Дальше — десять шагов от аудита до доработки.
Аудит→Слабые места→Действия пользователя→Фидбек команды→Гипотезы→Метрики→Новая структура→Макеты в Figma→UX-тест→Доработка
Выбрал метрики скорости и успешности
Смотрел не на внешний вид, а на понятные показатели: как быстро пользователь начинает работу, добавляет первый элемент и редактирует объект.
Метрика 1
Time to start project
Время, за которое пользователь создаёт новый проект или открывает существующий.
Метрика 2
Time to first element
Время от открытия проекта до добавления первого элемента в рабочую область.
Метрика 3
Клики до редактирования объекта
Сколько шагов нужно, чтобы выбрать объект и изменить его свойства.
Метрика 4
Task success rate
Доля сценариев, выполненных без ошибки: открыть проект, найти экран, добавить элемент, изменить свойства или настройку.
Интерфейс перегружен и не задаёт приоритетов
Вместе с техническими специалистами проверили интерфейс на ключевых сценариях и разобрали три экрана.
Стартовый экран
Рабочий экран
Экран настроек
Проблема в общей сложности, а не в кнопках
Мы собрали обратную связь от команды и технических специалистов, которые понимают логику SCADA-проектов. Чаще всего отмечали:
Нужен быстрый доступ к созданию и открытию проекта
Последние проекты должны быть видны сразу
В дереве важно разделить объекты, экраны, программы и переменные
На пустом экране нужна подсказка, как добавить первый элемент
Свойства объекта должны быть доступны без отдельного окна
Настройки нужно разделить по категориям
UX-тест старой версии показал потерю времени на старте
Проверили семь сценариев инженера: создать проект, открыть проект, вернуться к недавнему, найти экран в дереве, добавить первый элемент, открыть свойства объекта и найти параметр в настройках.
Пользователь терял время на старте, поиске проекта, ориентации в структуре и настройке объектов. Вывод: интерфейс нужно перестроить вокруг быстрого старта, понятной структуры проекта и удобного редактирования объектов.
UX-тест старой версии
Гипотеза: старт, структура и панель свойств
На брейншторме с разработчиком, техническим специалистом и заказчиком выделили главные проблемы: сложный старт, слабая навигация по дереву, пустая рабочая область без подсказок, трудный доступ к свойствам и перегруженные настройки.
Главная гипотеза
Если упростить старт, сделать структуру проекта понятнее и вынести свойства объекта в отдельную панель, пользователь быстрее создаст и отредактирует SCADA-проект.
Классических метрик вроде MAU, retention или conversion для профессионального инструмента было недостаточно. Поэтому проблему подтверждали разбором сценариев: создание и открытие проекта, навигация по дереву, добавление первого элемента, работа с правой панелью и структура настроек.
Интервью подтвердили запрос на быстрый доступ к проектам
Поговорил с инженерами и техническими специалистами, которые создают, настраивают и редактируют SCADA-проекты. Проверял, как они начинают работу, находят последние проекты, ориентируются в дереве, добавляют первый элемент, ищут свойства и настройки.
Страх потерять проект
Пользователи переживали за сохранность работы при долгих сессиях и вылетах системы.
Возвращаются к одним и тем же проектам
Хотят открывать их быстрее, без поиска по папкам.
Интервью с пользователем
Две группы пользователей
Инженер-разработчик SCADA-проектов
Создаёт проекты, собирает экраны и объекты, много времени проводит в рабочей области.
Технический специалист
Настраивает структуру проекта и параметры, чаще работает с деревом, свойствами и настройками.
Шесть гипотез, четыре из них в первую очередь
Приоритизировал по влиянию на пользователя, влиянию на проект и сложности. В первую очередь взяли те, что сильнее всего ускоряют старт и ориентацию в системе.
Гипотеза
Метрика
Приоритет
Быстрое создание и открытие проекта на главном экране
Time to start project
1
Список последних проектов
Time to reopen project
2
Дерево с понятной структурой: объекты, источники, программы, переменные, диагностика
Task success rate
3
Правая панель свойств объекта
Time to edit object
4
Empty state в рабочей области
Time to first element
5
Настройки по категориям: общие, экран, редактор ST, редактор FBD, мышь
Settings task success rate
6
Добавил идеи, которые появились в ходе исследования
Во время интервью, теста и обсуждения сценариев появились решения для ежедневной работы инженеров.
Быстрый доступ к сохранениям
Избранные проекты, автосохранение и облачное хранение.
Миникарта
Помогает ориентироваться в больших схемах и понимать текущую область просмотра.
Empty state
Подсказывает, с чего начать на пустом экране.
UX-тест нового интерфейса подтвердил решения
Дал пользователям восемь заданий: создать проект, открыть один из последних, найти в дереве «Экран 3», добавить первый элемент, найти свойства экрана, открыть настройки, найти автосохранение и раздел про редактор FBD.
Стартовый экран поняли сразу: основные действия на виду
Дерево помогло быстрее ориентироваться в структуре
Empty state подсказал, как добавить первый элемент
Правая панель ускорила редактирование без отдельных окон
Настройки стали понятнее за счёт категорий
UX-тест нового интерфейса
Настройка объекта стала быстрее на 26%
Свойства выбранного элемента вынесены в правую панель, поэтому не нужно искать параметры в отдельных окнах.
−26%
медианное время настройки объекта: 4:10 → 3:05 на UX-тесте после переноса свойств в правую панель.
Мы не просто обновили внешний вид, а пересобрали основной сценарий работы инженера со SCADA-проектом:
Старт стал понятнее. Создать проект, открыть файл или вернуться к недавнему можно с главного экрана.
Навигация проще. Дерево разделяет экраны, объекты, переменные и программы.
Первый элемент очевиднее. Empty state говорит, что делать на пустом экране.
Редактирование быстрее. Свойства объекта всегда под рукой в правой панели.
Настройки понятнее. Разделы сгруппированы по смыслу.
Есть задел на будущее. Избранные проекты, автосохранение, облачные сохранения и миникарта.
NOVA — концепт мобильного банка, в котором к привычным счетам, картам и истории операций добавлена система финансовых привычек. Пользователь создаёт правила и видит, как их выполняет.
ограничить расходы на категорию
регулярно откладывать деньги
планировать бюджет
контролировать импульсивные траты
автоматизировать повторяющиеся действия
Идея продукта — помочь перейти от анализа расходов к реальному изменению поведения.
Банки показывают, куда ушли деньги, но не помогают это изменить
Большинство приложений хорошо отвечают на один вопрос. На второй пользователь отвечает сам.
Отвечает банк
«Куда я потратил деньги?»
Категории, графики и история операций.
Остаётся пользователю
«Что мне изменить?»
Какой лимит поставить, как его соблюдать и стоит ли менять его в следующем месяце.
Я хотел проверить другую модель: банк не только показывает финансовое поведение, но и помогает менять его через простые измеримые привычки.
Спроектировал механику привычек как часть банка
Привычки не должны выглядеть отдельным сервисом. Они должны ощущаться естественной частью мобильного банка.
Сформулировал продуктовую проблему
Разобрал основные пользовательские сценарии
Проработал концепцию финансовых привычек
Собрал каталог привычек
Выстроил категории и информационную архитектуру
Спроектировал основные user flow
Продумал связь привычек с банковскими продуктами
Спроектировал механику автоматизации
Встроил Nova AI в пользовательский сценарий
Создал wireframes и финальный UI
Собрал интерактивный прототип
Провёл UX-тест
Доработал продуктовую логику по результатам тестов
Шаги от проблемы до метрик
Сначала нужно было понять, как встроить новый слой в знакомую модель банковского приложения.
Пользователь уже потратил деньги, а приложение показывает сумму, категорию и динамику. Механизма изменения поведения обычно нет.
Например, банк сообщает: «За месяц на доставку потрачено 12 500 ₽». Дальше нужно самому решить, сколько тратить, какой поставить лимит, как его соблюдать и насколько это получается.
Главная гипотеза
Если превратить финансовую цель в простое повторяемое действие с понятным правилом и измеримым прогрессом, пользователю будет легче контролировать своё поведение.
Цель
«Меньше тратить на доставку»
Привычка
«Лимит на доставку — 5 000 ₽ в месяц»
Пользователь сразу видит правило, сколько уже потрачено, сколько осталось и насколько близок к лимиту.
Главным объектом стало повторяемое действие
Цель вроде «начать больше откладывать» не говорит, что делать сегодня. Привычка превращает её в действие: «Откладывать 500 ₽ каждую неделю» или «Переводить 10% дохода в накопления».
Поэтому основным объектом NOVA стала не цель, а именно повторяемое финансовое действие.
В каталог вошли двенадцать привычек
Из разных сценариев финансового поведения я оставил самые понятные и реалистичные. Поиск в каталоге находит привычки по названию и ключевым словам, например «копить» или «такси».
Контроль · 6
Расходы под контролем
Лимит на доставку · Лимит на развлечения · Без такси · Без импульсивных покупок · День без лишних трат · Держаться дневного бюджета
Накопления · 3
Деньги в запас
Откладывать каждую неделю · Откладывать 10% дохода · Кешбэк в накопления
Планирование · 1
Бюджет наперёд
Планировать бюджет на неделю
Осознанность · 2
Понять своё поведение
Проверять траты за день · Финансовый итог недели
Каталог привычек
Популярное и категорииНакопления, планирование и «Своя привычка»
Каждая привычка обязана что-то делать в банке
Я избегал привычек, которые существуют только ради заполнения каталога. Привычка попадает в каталог, если выполняется хотя бы одно условие:
Банк может автоматически измерить результат
Банк может показать понятный прогресс
Банк может помочь выполнить действие
Действие напрямую связано с финансовым поведением
Поэтому обычная задача или напоминание сами по себе финансовой привычкой NOVA не считаются.
В первую очередь взял четыре привычки, которые проще всего понять без обучения: лимит на доставку, «Без такси», откладывать 500 ₽ каждую неделю и планировать бюджет на неделю. Они показывают разные механики: контроль, ограничение, накопления и планирование.
Для детальной проработки выбрал «Лимит на доставку»
Пользователь уже совершает операции через банк, поэтому NOVA сама определяет расходы на доставку и считает прогресс. Отмечать каждое действие вручную не нужно.
Я проектировал не отдельный экран, а весь путь привычки: от главного экрана до результата периода.
01 Главный экран02 Мои привычки03 Каталог04 Карточка привычки05 Настройка06 Привычка создана07 Страница привычки08 Главный с привычкой
Листайте вбок. Нажмите на экран, чтобы открыть.
Привычки живут рядом с балансом и картами
Основные разделы: привычки, счета, карты, аналитика. Привычки — ключевая функция, поэтому я не спрятал их внутри аналитики.
На главном экране рядом с балансом, картами и быстрыми действиями показаны активные привычки. Пользователь видит прогресс, даже если не открывает раздел.
Главный экран
Пустое состояниеПривычка рядом с картойНесколько привычек
Шесть гипотез, четыре из них в первую очередь
Для первой версии сфокусировался на понятном каталоге, полном сценарии создания привычки, активных привычках на главном экране, прогрессе и истории. Дополнительно проработал автоматизацию, Nova AI, результат периода и изменение параметров.
Гипотеза
Метрика
Активные привычки на главном экране: пользователь чаще замечает прогресс
Habit engagement rate
Привычка как измеримое правило: проще понять, что делать
Habit setup completion rate
Прогресс считается по транзакциям: не нужно вести трекер вручную
Habit engagement / return rate
Прогресс на карточке привычки: состояние понятно сразу
Task success rate
Часть привычек выполняется автоматически: проще держать их долго
Automated habit adoption rate
Nova AI появляется в момент настройки: воспринимается как полезный инструмент
AI suggestion acceptance rate
Перед включением пользователь должен понять смысл привычки
Между каталогом и настройкой появился отдельный экран привычки. Он объясняет, что привычка делает, как считается результат, какой параметр можно менять и что произойдёт после активации. Для лимита на доставку это три коротких слайда.
Карточка привычки
Доставка под контролемСледи за лимитомБольше на важное
Настройка оставляет только необходимое
Дальше пользователь выбирает свой лимит. Задача экрана — оставить только параметры, без которых привычку нельзя запустить: чем меньше действий при создании, тем ниже порог входа.
Настройка привычки
Сумма и периодНапоминание, цель и заметка
Nova AI помогает в момент выбора, а не живёт отдельным чатом
Я не хотел делать AI отдельным чатом, который существует независимо от продукта. Поэтому Nova AI встроен прямо в страницу привычки и появляется в четырёх конкретных моментах.
1
Замечает раньше пользователя
Карточка на странице привычки первой сигнализирует о риске: «Есть риск превысить лимит» или «Заметил: по „Лимит на доставку“ осталось мало до лимита. Разобрать?» — и уже отсюда можно перейти в прогноз или в чат.
2
Показывает расчёт, а не просто вывод
Экран «Прогноз» строит цифру у пользователя на глазах: «В среднем вы тратите 5 130 ₽ в месяц», «До конца месяца ещё 29 дней», «Следите за темпом трат» — и только потом называет итоговый прогноз. Пользователь видит, откуда взялось число, а не верит ему на слово.
3
Отвечает на вопрос своими словами, с расчётом внутри
В чате на вопрос «Почему такой прогноз?» Nova AI отвечает: «Считаю так по „Лимит на доставку“: за 29 дн. потрачено 1 660 ₽, это около 57 ₽ в день; в периоде 30 дн., поэтому прогноз около 1 718 ₽; лимит — 2 000 ₽» — и сразу предлагает открыть привычку или изменить лимит.
4
Предлагает следующий шаг после периода
В «Итогах месяца» Nova AI считает, что лимит соблюдён с запасом, и предлагает конкретную цифру: «Можно снизить лимит… Снизить его до 1 700 ₽?» — пользователь либо соглашается, либо оставляет как есть.
Чат в прототипе работает по правилам, без нейросети: так я мог полностью контролировать, что и когда он говорит. Он помнит разговор между открытиями, понимает опечатки и суммы словами, уточняет недостающее и выполняет команды — изменить лимит, поставить на паузу, удалить привычку, добавить трату — только после явного подтверждения. Умеет сравнение, историю трат и подбор привычек из каталога. На вопрос не по теме честно отвечает «этого я пока не умею», а не пытается угадать.
Nova AI
Прогноз и причиныЧат: подсказкиЧат: ответ с расчётом
Пользователь получает ясное подтверждение
Перед включением он видит итоговые параметры: привычку, лимит, принцип подсчёта и связанные настройки. После подтверждения привычка становится активной, а экран успеха закрывает сценарий и показывает, где теперь искать привычку. Основное действие — «К привычке», дополнительное — «На главную».
Создание привычки
Привычка созданаСтраница новой привычки
Прогресс читается без открытия детального экрана
После создания карточка меняет задачу: не объяснять механику, а быстро показывать прогресс. Пользователь видит название, прогресс, лимит, остаток, период и статус. Для лимита на доставку данные считаются автоматически по операциям.
Состояние привычки видно прямо на компактной карточке. Точные значения открываются по нажатию, поэтому главный экран не перегружен. В списке есть вкладки «Активные», «На паузе» и «Завершённые», а свайп по карточке вправо ставит привычку на паузу, влево — удаляет с возможностью отмены.
Мои привычки
Пока пустоНачало периода83% лимитаНесколько привычек
История и итог периода превращают месяц в результат
Одного текущего значения мало, если привычка формируется неделями. В детальном экране ниже текущего состояния идёт история: прошлые периоды, успешные и неуспешные, динамика.
Вместо сообщения «Месяц закончился» пользователь получает финансовый итог: какой был лимит, сколько потрачено, удалось ли выполнить привычку и чем результат отличается от прошлого периода. Дальше система предлагает шаг: оставить лимит или попробовать немного снизить его.
Страница привычки
Начало периода83% лимита и прогнозТраты и напоминание
Статистика, история и итог
Статистика по днямИстория тратИтог периода
Три механики привычек и автоматизация
Не все привычки считаются одинаково, поэтому в NOVA три механики:
Лимит · ₽
Доставка, развлечения, бюджет
Прогресс — потрачено к лимиту. Статус: всё по плану, осталось столько-то, почти исчерпан, превышен. Уведомление при 80% и при превышении.
Челлендж · дни
Без такси, без импульсивных покупок
Считаем дни подряд. Ежедневный чек-ин и серия. Такси в операциях ломает серию текущего дня.
Накопление
Откладывать 10% дохода
Когда приходит доход, NOVA предлагает отложить долю или делает автоперевод, если он включён.
Поступил доход→NOVA считает 10%→Перевод в накопления
Банк становится не только трекером, но и инструментом выполнения привычки. Любая автоматизация сначала объясняется пользователю и только потом включается. Для новой механики есть и короткий онбординг: выбрать привычку, следовать ей, получить результат.
Механики привычек
НакоплениеЧелленджИтог недели
Своя привычка
Если в каталоге нет нужной, пользователь создаёт свою и выбирает тип: лимит, челлендж или накопление. Название не теряется при смене типа, а категория, напоминание, цель и заметка общие для всех типов. «Финансовый итог недели» показывает кольцевую диаграмму, категории и вывод Nova AI.
Новая привычка
Тип: лимит, челлендж или накопление
Светлый fintech-стиль, который не спорит с цифрами
Визуальный язык не должен конкурировать с финансовыми данными. Он помогает быстро считывать состояние счетов и привычек.
белый фон и много воздуха
крупная чёрная типографика, серый вторичный текст
системный синий как главный акцент, шрифт TT Hoves Pro
большие скругления карточек и минималистичные иконки
мягкие голубые и лавандовые акценты
#0088FFАкцент
#131214Таббар и текст
#E4EAF6Голубой фон
#DCDAFCЛавандовый фон
#898D8FВторичный текст
#FFFFFFКарточки
Пройдите сценарий сами в рабочем прототипе
Для проверки концепции не нужно было делать интерактивным весь банк, поэтому прототип собран вокруг одного сквозного сценария: создать привычку «Лимит на доставку» и увидеть её на главном экране. Нажимайте на кнопки как в обычном приложении. Если промахнётесь, прототип подсветит кликабельные зоны. Здесь есть чат Nova AI, прогноз, итог периода и кнопка «Демо» на странице привычки: «+1 день» и «Перейти к последнему дню».
Загружаем прототип…
Прототип не загрузился в этом окне. Откройте его в новой вкладке, он работает там так же.
Проверил, разберётся ли пользователь без объяснений
Главный вопрос теста: сможет ли пользователь без подсказок понять новую для банка механику привычек. Проверял восемь вещей:
Понимает ли, где находятся привычки
Может ли найти нужную привычку
Понимает ли смысл «Лимита на доставку»
Может ли сам настроить привычку
Понимает ли роль Nova AI
Понимает ли момент активации
Видит ли текущее состояние привычки
Знает ли, где история и результат
Задание
Сократить расходы на доставку
«Вы хотите сократить расходы на доставку еды. Найдите в приложении способ установить лимит на эту категорию и включите его».
Три респондента прошли сценарий без критических проблем
Респондент 1
Прошёл основной сценарий
Критических препятствий, из-за которых нельзя закончить задачу, не было.
Респондент 2
Сразу перешёл в «Привычки»
Ожидал найти функцию именно там. Успешно прошёл сценарий и оценил понятность на 10/10.
Респондент 3
Прошёл без существенных затруднений
Общая логика была понятна, критических проблем не обнаружено.
Пользователи понимали, где искать функцию, что такое финансовая привычка, как её выбрать, настроить и что происходит после активации. Раздел «Привычки» воспринимался как ожидаемое место, и это подтвердило информационную архитектуру.
Гипотеза
Статус
Пользователь сам находит раздел привычек
Подтверждена в тесте
Формулировка «Лимит на доставку» объясняет механику
Подтверждена в тесте
Пользователь сам проходит создание привычки
Подтверждена: все дошли до конца
Механику можно встроить без отдельного обучения
Предварительно подтверждена
Тест проверяет понятность, а не изменение поведения
NOVA — концептуальный кейс, поэтому у меня нет данных реального продукта: удержания, транзакционных паттернов, долгого использования и влияния механики на финансовое поведение.
UX-тест подтверждает понятность интерфейса, но не доказывает, что поведение изменится надолго. Для окончательного вывода нужны большая выборка и измерения после запуска.
Есть и ограничения самого прототипа: вкладки «Цели» и «Аналитика» никуда не ведут, чат Nova AI работает по правилам и не поймёт очень нестандартные формулировки, а данные демонстрационные и не сохраняются после перезагрузки.
После запуска важнее удержание, а не число созданных привычек
Пользователь может создать привычку и бросить её через несколько дней, поэтому главная метрика должна учитывать долгосрочное поведение.
Основная метрика
Habit completion / adherence rate
Доля активированных привычек, которые пользователи продолжают успешно выполнять в течение нескольких периодов. Помогает ли продукт поддерживать новое поведение, а не просто создать настройку один раз.
Habit activation rate
Какая доля пользователей после открытия карточки создаёт привычку.
Week 1 completion rate
Какая доля проходит первый период после создания привычки.
Habit retention
Продолжает ли пользователь привычку спустя несколько недель.
Automated habit adoption
Какая доля подключает автоматическое выполнение там, где оно доступно.
Habit return rate
Как часто пользователь возвращается к привычкам проверить прогресс.
Не чек-лист, а связанная с операциями система
Отдельного раздела с чек-листом оказалось недостаточно. Чтобы механика работала как часть банка, привычка должна:
быть связана с реальными финансовыми действиями
иметь конкретное измеримое правило
автоматически получать данные из операций
показывать текущий прогресс
сохранять историю
давать результат по итогам периода
при возможности выполняться автоматически
3/3
респондента прошли основной сценарий создания привычки без критических проблем. Один оценил понятность на 10/10.
Я спроектировал не отдельную функцию, а полный сценарий работы с привычкой:
