На главную
ru
en
Триафлай
Перепроектирование low-code платформы для автоматизации аналитических процессов.
Компания
Триафлай
Роль
Продуктовый дизайнер
Таймлайн
2024 — 2025
Триафлай ↗ — это российская low-code платформа для автоматизации аналитических процессов. Она объединяет инструменты для подготовки данных, построения витрин и создания интерактивных дашбордов. Продукт позволяет компаниям быстро запускать аналитику без сложной разработки.
Об этом кейсе
Кейс в основном технический и выполнен в product-oriented подходе: интерфейсы, дизайн-система, токены, темы, архитектура компонентов.Из-за B2B-специфики, ограниченного доступа к пользователям и большого технического долга исследования почти не проводились — дизайн опирался на технические спецификации.
Проблемы
Дизайн «Триафлай» во многом уступал конкурентным решениям (Visiology, Форсайт, Microsoft Fabric): продукт сильно полагался на кастомизацию во время внедрения и недостаточное количество готовых пользовательских сценариев «из коробки».
Также много лет в команде не было дизайнера, что усилило накопление UX-проблем:
Отсутствовало разделение по ролям — все пользователи попадали в одинаковое рабочее пространство вне зависимости от задач
Несколько функциональных модулей были неудобно объединены в одном экране, что усложняло навигацию и понимание логики
Онбординг занимал много времени — в отдельных случаях до полугода
Непродуманный UX делал продукт враждебным к пользователю: клиенты не могли работать самостоятельно и постоянно обращались в поддержку
Кроме того, слабая архитектура интерфейсов негативно влияла на производительность — работа с системой ощущалась медленной и перегруженной
Цели бизнеса и критерии успеха
Перед началом работы мы совместно с командой определили ключевые цели продукта и понятные критерии успеха. Это позволило сфокусироваться на пользовательской ценности, масштабируемости и снижении нагрузки на команду.
Ниже — краткое соответствие между бизнес-целями и ожидаемыми результатами:
Цель бизнеса
Разгрузить службу поддержки — пользователи решают базовые задачи самостоятельно
Критерий успеха
Поддержка занимается только сложными случаями; мелкие задачи закрываются без её участия
Цель бизнеса
Обеспечить быстрый онбординг и обучение новых бизнес-пользователей
Критерий успеха
Онбординг занимает несколько дней, после чего пользователи работают автономно
Цель бизнеса
Обеспечить быстрый онбординг и обучение новых бизнес-пользователей
Критерий успеха
Новый процесс настраивается за 1 день вместо 2 недель
Цель бизнеса
Освободить разработчиков от типовой настройки
Критерий успеха
>80% типовых задач решаются без участия разработчиков
Цель бизнеса
Освободить разработчиков от типовой настройки
Критерий успеха
Количество команд-использователей растёт без расширения команды сопровождения
Цель бизнеса
Уменьшить количество ошибок из-за ручной настройки
Критерий успеха
Снижение числа пользовательских ошибок и запросов «как настроить» на 60%
Цель бизнеса
Уменьшить количество ошибок из-за ручной настройки
Критерий успеха
Настройка, аудит и ревизия доступны продактам и аналитикам без инженеров
Подход
Из-за огромного технического долга было принято решение полностью обновить визуальную часть продукта на основе новой дизайн-системы.
Фактически речь шла о полном перепроектировании продукта: добавлении отсутствующего функционала и унификации пользовательского опыта.
Что я сделал
Сформировал JTBD и ключевыесценарии по ролям (desk research)
Сформировал JTBD и ключевые сценарии по ролям (desk research)
Разработал полноценную дизайн-систему с токенами и поддержкой тёмной темы
Создал интерфейсы ETL-модуля и системы аналитического хранилища
Перевёл требования продукт-оунера и системного аналитика в детализированные UX/UI-макеты
Стандартизировал паттерны и повысил визуальную согласованность продукта
Организовал передачу дизайна в разработку и контролировал корректность внедрения
Проработал UX-логику с учётом технических ограничений платформы
Создал интерактивные прототипы и представил их лицам, принимающим решения
Jobs To Be Done
Так как проект B2B и доступ к конечным пользователям был ограничен, вместо классических интервью я зафиксировал ключевые Jobs-to-be-Done по ролям. Это помогло выстроить структуру интерфейса, разделить роли и определить критичные точки.
Роль
JTBD
Критерий успеха
Что поддержали
Data engineer / внедренец
Подключить источник данных и провалидировать подключение
Тест соединения + понятные ошибки
Мастер + статусы + ошибки
Data engineer
Собрать pipeline/витрину из шагов и безопасно менять трансформации
Читаемая схема + быстрый дебаг
Pipeline builder + дебаг
Аналитик
Быстро найти нужный датасет и понять, можно ли ему доверять
Поиск за 1–2 минуты
Каталог данных + метаданные
Бизнес-пользователь
Собрать дашборд без кода и “с понятным стартом”
MVP за 30–60 минут
Шаблоны + guided setup
Админ / поддержка
Контролировать доступ и стабильность системы
Роли + прозрачные статусы
RBAC + мониторинг
Дизайн-система
Я с нуля создал гибкую дизайн-систему, включающую глобальные и локальные компоненты, цветовые и типографические токены, а также набор стилей и ассетов (иконки, иллюстрации, логотипы). Как видно на изображении ниже, файлы проекта аккуратно структурированы и связаны друг с другом.
UI
Ниже представлены несколько экранов, демонстрирующих визуальную часть продукта. Их также можно посмотреть в светлой и тёмной темах.
Список диаграмм в Суперсете
Это каталог всех визуализаций: здесь можно просматривать, искать, фильтровать диаграммы и переходить к их редактированию.
Светло
Создание диаграммы
Рабочее пространство для настройки визуализации: выбор источника данных, метрик, измерений, фильтров и типа диаграммы.
Светло
Статус
Экран для быстрого контроля состояния системы: ключевые метрики, нагрузка по топикам, lag и выполнение ELT-задач. Помогает оперативно выявлять аномалии и понимать, где возникает проблема — в данных, обработке или инфраструктуре.
Светло
Логи
Экран логов показывает системные события: ошибки, предупреждения и статусы сервисов. Сверху — ключевые метрики и график активности, ниже — таблица событий с фильтрами по сервису, важности и дате. Интерфейс помогает быстро находить проблемы в работе системы.
Светло
Управление ролями и доступами
Экран для настройки прав доступа всех ролей в виде матрицы. Позволяет администраторам быстро назначать, проверять и контролировать доступы, снижая риск ошибок и повышая прозрачность прав.
Светло
Иконки
Большинство иконок я взял из open-source наборов — Phosphor, Tabler, Dazzle и MyIcons. Отдельные иконки, например, некоторые типы диаграмм, я нарисовал самостоятельно. Все иконки размещены в отдельном файле Colors, Styles, Assets, что позволяет удобно поддерживать их, переиспользовать в разных файлах проекта и централизованно обновлять при изменениях.
Логика
Логику сценариев я визуализировал в виде последовательных флоу-схем. Такой формат помогает быстро понять порядок действий и взаимодействие элементов без необходимости запускать прототип. Также широко использовались аннотации. Ниже приведены несколько примеров.
3
Текущий статус
Проект был остановлен из-за прекращения внешнего финансирования, после чего значительную часть команды сократили. Разработка продукта в текущем виде заморожена.
Давайте общаться
telegram
cv
На главную
ru
en
Триафлай
Перепроектирование low-code платформы для автоматизации аналитических процессов.
Компания
Триафлай
Роль
Продуктовый дизайнер
Таймлайн
2024 — 2025
Триафлай ↗ — это российская low-code платформа для автоматизации аналитических процессов. Она объединяет инструменты для подготовки данных, построения витрин и создания интерактивных дашбордов. Продукт позволяет компаниям быстро запускать аналитику без сложной разработки.
Об этом кейсе
Кейс в основном технический и выполнен в product-oriented подходе: интерфейсы, дизайн-система, токены, темы, архитектура компонентов.Из-за B2B-специфики, ограниченного доступа к пользователям и большого технического долга исследования почти не проводились — дизайн опирался на технические спецификации.
Проблемы
Дизайн «Триафлай» во многом уступал конкурентным решениям (Visiology, Форсайт, Microsoft Fabric): продукт сильно полагался на кастомизацию во время внедрения и недостаточное количество готовых пользовательских сценариев «из коробки».
Также много лет в команде не было дизайнера, что усилило накопление UX-проблем:
Отсутствовало разделение по ролям — все пользователи попадали в одинаковое рабочее пространство вне зависимости от задач
Несколько функциональных модулей были неудобно объединены в одном экране, что усложняло навигацию и понимание логики
Онбординг занимал много времени — в отдельных случаях до полугода
Непродуманный UX делал продукт враждебным к пользователю: клиенты не могли работать самостоятельно и постоянно обращались в поддержку
Кроме того, слабая архитектура интерфейсов негативно влияла на производительность — работа с системой ощущалась медленной и перегруженной
Цели бизнеса и критерии успеха
Перед началом работы мы совместно с командой определили ключевые цели продукта и понятные критерии успеха. Это позволило сфокусироваться на пользовательской ценности, масштабируемости и снижении нагрузки на команду.
Ниже — краткое соответствие между бизнес-целями и ожидаемыми результатами:
Цель бизнеса
Разгрузить службу поддержки — пользователи решают базовые задачи самостоятельно
Критерий успеха
Поддержка занимается только сложными случаями; мелкие задачи закрываются без её участия
Цель бизнеса
Обеспечить быстрый онбординг и обучение новых бизнес-пользователей
Критерий успеха
Онбординг занимает несколько дней, после чего пользователи работают автономно
Цель бизнеса
Обеспечить быстрый онбординг и обучение новых бизнес-пользователей
Критерий успеха
Новый процесс настраивается за 1 день вместо 2 недель
Цель бизнеса
Освободить разработчиков от типовой настройки
Критерий успеха
>80% типовых задач решаются без участия разработчиков
Цель бизнеса
Освободить разработчиков от типовой настройки
Критерий успеха
Количество команд-использователей растёт без расширения команды сопровождения
Цель бизнеса
Уменьшить количество ошибок из-за ручной настройки
Критерий успеха
Снижение числа пользовательских ошибок и запросов «как настроить» на 60%
Цель бизнеса
Уменьшить количество ошибок из-за ручной настройки
Критерий успеха
Настройка, аудит и ревизия доступны продактам и аналитикам без инженеров
Подход
Из-за огромного технического долга было принято решение полностью обновить визуальную часть продукта на основе новой дизайн-системы.
Фактически речь шла о полном перепроектировании продукта: добавлении отсутствующего функционала и унификации пользовательского опыта.
Что я сделал
Сформировал JTBD и ключевые сценарии по ролям (desk research)
Сформировал JTBD и ключевые сценарии по ролям (desk research)
Разработал полноценную дизайн-систему с токенами и поддержкой тёмной темы
Создал интерфейсы ETL-модуля и системы аналитического хранилища
Перевёл требования продукт-оунера и системного аналитика в детализированные UX/UI-макеты
Стандартизировал паттерны и повысил визуальную согласованность продукта
Организовал передачу дизайна в разработку и контролировал корректность внедрения
Проработал UX-логику с учётом технических ограничений платформы
Создал интерактивные прототипы и представил их лицам, принимающим решения
Jobs To Be Done
Так как проект B2B и доступ к конечным пользователям был ограничен, вместо классических интервью я зафиксировал ключевые Jobs-to-be-Done по ролям. Это помогло выстроить структуру интерфейса, разделить роли и определить критичные точки.
Роль
JTBD
Критерий успеха
Что поддержали
Data engineer / внедренец
Подключить источник данных и провалидировать подключение
Тест соединения + понятные ошибки
Мастер + статусы + ошибки
Data engineer
Собрать pipeline/витрину из шагов и безопасно менять трансформации
Читаемая схема + быстрый дебаг
Pipeline builder + дебаг
Аналитик
Быстро найти нужный датасет и понять, можно ли ему доверять
Поиск за 1–2 минуты
Каталог данных + метаданные
Бизнес-пользователь
Собрать дашборд без кода и “с понятным стартом”
MVP за 30–60 минут
Шаблоны + guided setup
Админ / поддержка
Контролировать доступ и стабильность системы
Роли + прозрачные статусы
RBAC + мониторинг
Дизайн-система
Я с нуля создал гибкую дизайн-систему, включающую глобальные и локальные компоненты, цветовые и типографические токены, а также набор стилей и ассетов (иконки, иллюстрации, логотипы). Как видно на изображении ниже, файлы проекта аккуратно структурированы и связаны друг с другом.
UI
Ниже представлены несколько экранов, демонстрирующих визуальную часть продукта. Их также можно посмотреть в светлой и тёмной темах.
Список диаграмм в Суперсете
Это каталог всех визуализаций: здесь можно просматривать, искать, фильтровать диаграммы и переходить к их редактированию.
Светло
Создание диаграммы
Рабочее пространство для настройки визуализации: выбор источника данных, метрик, измерений, фильтров и типа диаграммы.
Светло
Статус
Экран для быстрого контроля состояния системы: ключевые метрики, нагрузка по топикам, lag и выполнение ELT-задач. Помогает оперативно выявлять аномалии и понимать, где возникает проблема — в данных, обработке или инфраструктуре.
Светло
Логи
Экран логов показывает системные события: ошибки, предупреждения и статусы сервисов. Сверху — ключевые метрики и график активности, ниже — таблица событий с фильтрами по сервису, важности и дате. Интерфейс помогает быстро находить проблемы в работе системы.
Светло
Управление ролями и доступами
Экран для настройки прав доступа всех ролей в виде матрицы. Позволяет администраторам быстро назначать, проверять и контролировать доступы, снижая риск ошибок и повышая прозрачность прав.
Светло
Иконки
Большинство иконок я взял из open-source наборов — Phosphor, Tabler, Dazzle и MyIcons. Отдельные иконки, например, некоторые типы диаграмм, я нарисовал самостоятельно. Все иконки размещены в отдельном файле Colors, Styles, Assets, что позволяет удобно поддерживать их, переиспользовать в разных файлах проекта и централизованно обновлять при изменениях.
Логика
Логику сценариев я визуализировал в виде последовательных флоу-схем. Такой формат помогает быстро понять порядок действий и взаимодействие элементов без необходимости запускать прототип. Также широко использовались аннотации. Ниже приведены несколько примеров.
1
Текущий статус
Проект был остановлен из-за прекращения внешнего финансирования, после чего значительную часть команды сократили. Разработка продукта в текущем виде заморожена.
Давайте общаться
telegram
cv
На главную
Триафлай
Перепроектирование low-code платформы для автоматизации аналитических процессов.
Компания
Триафлай
Роль
Продуктовый дизайнер
Таймлайн
2024 — 2025
Триафлай ↗ — это российская low-code платформа для автоматизации аналитических процессов. Она объединяет инструменты для подготовки данных, построения витрин и создания интерактивных дашбордов. Продукт позволяет компаниям быстро запускать аналитику без сложной разработки.
Об этом кейсе
Кейс в основном технический и выполнен в product-oriented подходе: интерфейсы, дизайн-система, токены, темы, архитектура компонентов.Из-за B2B-специфики, ограниченного доступа к пользователям и большого технического долга исследования почти не проводились — дизайн опирался на технические спецификации.
Проблемы
Дизайн «Триафлай» во многом уступал конкурентным решениям (Visiology, Форсайт, Microsoft Fabric): продукт сильно полагался на кастомизацию во время внедрения и недостаточное количество готовых пользовательских сценариев «из коробки».
Также много лет в команде не было дизайнера, что усилило накопление UX-проблем:
Отсутствовало разделение по ролям — все пользователи попадали в одинаковое рабочее пространство вне зависимости от задач
Несколько функциональных модулей были неудобно объединены в одном экране, что усложняло навигацию и понимание логики
Онбординг занимал много времени — в отдельных случаях до полугода
Непродуманный UX делал продукт враждебным к пользователю: клиенты не могли работать самостоятельно и постоянно обращались в поддержку
Кроме того, слабая архитектура интерфейсов негативно влияла на производительность — работа с системой ощущалась медленной и перегруженной
Цели бизнесаи критерии успеха
Перед началом работы мы совместно с командой определили ключевые цели продукта и понятные критерии успеха. Это позволило сфокусироваться на пользовательской ценности, масштабируемости и снижении нагрузки на команду.
Ниже — краткое соответствие между бизнес-целями и ожидаемыми результатами:
Цель бизнеса
Разгрузить службу поддержки — пользователи решают базовые задачи самостоятельно
Критерий успеха
Поддержка занимается только сложными случаями; мелкие задачи закрываются без её участия
Цель бизнеса
Обеспечить быстрый онбординг и обучение новых бизнес-пользователей
Критерий успеха
Онбординг занимает несколько дней, после чего пользователи работают автономно
Цель бизнеса
Сократить сроки разработки прикладных решений
Критерий успеха
Новый процесс настраивается за 1 день вместо 2 недель
Цель бизнеса
Освободить разработчиков от типовой настройки
Критерий успеха
>80% типовых задач решаются без участия разработчиков
Цель бизнеса
Масштабировать продукт без роста поддержки
Критерий успеха
Количество команд-использователей растёт без расширения команды сопровождения
Цель бизнеса
Уменьшить количество ошибок из-за ручной настройки
Критерий успеха
Снижение числа пользовательских ошибок и запросов «как настроить» на 60%
Цель бизнеса
Обеспечить прозрачность и контроль без доступа к коду
Критерий успеха
Настройка, аудит и ревизия доступны продактам и аналитикам без инженеров
Подход
Из-за огромного технического долга было принято решение полностью обновить визуальную часть продукта на основе новой дизайн-системы.
Фактически речь шла о полном перепроектировании продукта: добавлении отсутствующего функционала и унификации пользовательского опыта.
Что я сделал
Сформировал JTBD и ключевыесценарии по ролям (desk research)
Разработал полноценную дизайн-системус токенами и поддержкой тёмной темы
Создал интерфейсы ETL-модуля и системы аналитического хранилища
Перевёл требования продукт-оунера исистемного аналитика в детализированные UX/UI-макеты
Стандартизировал паттерны иповысил визуальную согласованность продукта
Организовал передачу дизайна в разработкуи контролировал корректность внедрения
Проработал UX-логику с учётомтехнических ограничений платформы
Создал интерактивные прототипы ипредставил их лицам, принимающим решения
Jobs To Be Done
Так как проект B2B и доступ к конечным пользователям был ограничен, вместо классических интервью я зафиксировал ключевые Jobs-to-be-Done по ролям. Это помогло выстроить структуру интерфейса, разделить роли и определить критичные точки.
Роль
JTBD
Критерий успеха
Что поддержали
Data engineer / внедренец
Подключить источник данных и провалидировать подключение
Тест соединения + понятные ошибки
Мастер + статусы + ошибки
Data engineer
Собрать pipeline/витрину из шагов и безопасно менять трансформации
Читаемая схема + быстрый дебаг
Pipeline builder + дебаг
Аналитик
Быстро найти нужный датасет и понять, можно ли ему доверять
Поиск за 1–2 минуты
Каталог данных + метаданные
Бизнес-пользователь
Собрать дашборд без кода и “с понятным стартом”
MVP за 30–60 минут
Шаблоны + guided setup
Админ / поддержка
Контролировать доступ и стабильность системы
Роли + прозрачные статусы
RBAC + мониторинг
Дизайн-система
Я с нуля создал гибкую дизайн-систему, включающую глобальные и локальные компоненты, цветовые и типографические токены, а также набор стилей и ассетов (иконки, иллюстрации, логотипы). Как видно на изображении ниже, файлы проекта аккуратно структурированы и связаны друг с другом.
Больше о дизайн-системе
UI
Ниже представлены несколько экранов, демонстрирующих визуальную часть продукта. Их также можно посмотреть в светлой и тёмной темах.
Список диаграмм в Суперсете
Это каталог всех визуализаций: здесь можно просматривать, искать, фильтровать диаграммы и переходить к их редактированию.
Светло
Создание диаграммы
Рабочее пространство для настройки визуализации: выбор источника данных, метрик, измерений, фильтров и типа диаграммы.
Светло
Статус
Экран для быстрого контроля состояния системы: ключевые метрики, нагрузка по топикам, lag и выполнение ELT-задач. Помогает оперативно выявлять аномалии и понимать, где возникает проблема — в данных, обработке или инфраструктуре.
Светло
Логи
Экран логов показывает системные события: ошибки, предупреждения и статусы сервисов. Сверху — ключевые метрики и график активности, ниже — таблица событий с фильтрами по сервису, важности и дате. Интерфейс помогает быстро находить проблемы в работе системы.
Светло
Управление ролями и доступами
Экран для настройки прав доступа всех ролей в виде матрицы. Позволяет администраторам быстро назначать, проверять и контролировать доступы, снижая риск ошибок и повышая прозрачность прав.
Светло
Иконки
Большинство иконок я взял из open-source наборов — Phosphor, Tabler, Dazzle и MyIcons. Отдельные иконки, например, некоторые типы диаграмм, я нарисовал самостоятельно. Все иконки размещены в отдельном файле Colors, Styles, Assets, что позволяет удобно поддерживать их, переиспользовать в разных файлах проекта и централизованно обновлять при изменениях.
Логика
Логику сценариев я визуализировал в виде последовательных флоу-схем. Такой формат помогает быстро понять порядок действий и взаимодействие элементов без необходимости запускать прототип. Также широко использовались аннотации. Ниже приведены несколько примеров.
1
Текущий статус
Проект был остановлен из-за прекращения внешнего финансирования, после чего значительную часть команды сократили. Разработка продукта в текущем виде заморожена.
Давайте общаться
telegram
cv