Track 2.0: как я превратила дашборд с графиками в ответ на вопрос «что исправлять в первую очередь?»

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

2026 · Product Designer · Концепция редизайна · Корпоративная платформа AppSec

Роль: Провела UX-аудит первой версии и перестроила дашборды вокруг приоритетных рисков. Спроектировала ролевые шаблоны, общие фильтры, добавление и настройку виджетов, их состояния и переход от графика к деталям.
Продукт: Кибербезопасность, B2B, веб-приложение
Результат: Первый полезный дашборд менее чем за 10 секунд вместо минуты; эксплуатируемые уязвимости на первом экране; один клик от графика до списка проблем, которые нужно исправить

Обновлённый дашборд Track: KPI, критичность, недельный тренд, приложения и политики

Что такое Track

Большую часть современного приложения пишет не та команда, которая его выпускает. Оно собирается из open-source библиотек из npm, Maven, PyPI и других реестров. Любая из них может принести известную уязвимость, вредоносный код или лицензию, которую компании нельзя использовать.

Track защищает эту цепочку поставок. Он проверяет каждую зависимость, в том числе транзитивную, и работает как межсетевой экран перед внутренними репозиториями компании: опасные пакеты блокируются или попадают в карантин ещё до сборки. На дашбордах команда видит, как работает эта защита.

Кто пользуется продуктом

AppSec-инженеры разбирают уязвимости и определяют, что исправлять в первую очередь.
DevOps- и DevSecOps-инженеры следят за репозиториями и за тем, чтобы блокировка пакета не сломала сборку.
Руководители безопасности контролируют политики, нарушения и сроки исправления, отчитываются перед бизнесом.

Несколько терминов

CVE: публичный идентификатор известной уязвимости.
Severity: уровень критичности, от Critical до Info.
KEV: публичный каталог уязвимостей, которые уже используют атакующие. Если уязвимость попала в него, её нужно исправлять сейчас.
MTTR: среднее время от обнаружения проблемы до её исправления.

Что не работало

Первая версия решала основную задачу: каждая роль могла собрать свой обзор примерно за минуту. Но когда я прошла сценарий AppSec-инженера, обнаружилось несколько препятствий.

Много чисел, нет приоритетов. Дашборд показывал 25 648 уязвимостей, но не объяснял, какие из них важны сегодня.
У каждого виджета свои фильтры. Соседние графики могли показывать разные периоды, поэтому их нельзя было сравнивать.
Блокировки выглядели как инциденты. Заблокированный пакет означает, что защита сработала, но на графике он был тревожным красным.
Тупиковые экраны. Пустой экран не подсказывал, с чего начать, а раскрытый виджет просто увеличивал график, не предлагая следующего действия.
Не было состояний. Загрузка, сбой источника данных и отсутствие прав не были спроектированы, поэтому дашборд мог выглядеть сломанным.

Задача

Сохранить гибкость, которая нравилась пользователям, но за несколько секунд отвечать на вопрос «что исправлять в первую очередь?» и сразу вести к исправлению.

01 · Обзор

От статистики к приоритетам

Дашборд Track 2.0 — Потяните разделитель, чтобы сравнить первую версию и редизайн.

Дашборд Track первой версии — Потяните разделитель, чтобы сравнить первую версию и редизайн.

Один период и общие фильтры. Я вынесла фильтры из виджетов над дашбордом: теперь все графики показывают данные в одном контексте. Если виджету нужен собственный период, он явно указан, например «Last 90 d».

Ряд KPI с главными вопросами. Сколько проблем открыто, сколько из них критические, какие уже эксплуатируются и как быстро команда исправляет их относительно SLA.

Спокойный цвет для блокировок. Красный остался только для того, что требует реакции. Рост числа заблокированных пакетов означает, что защита работает.

Видно, что делает каждая политика. У каждой политики есть метка Block, Quarantine или Warn: 2000 предупреждений и 2000 блокировок говорят о разных вещах.

Различимые уровни критичности. Critical теперь сливовый и не сливается с High, а второстепенный текст соответствует требованиям WCAG AA по контрастности.

02 · Первый запуск

Пустой экран помогает начать

Пустой дашборд Track 2.0 с ролевыми шаблонами

Вместо одинокого «+» появились три шаблона для трёх ролей: Security overview для AppSec, Supply chain risk для DevSecOps и Policy compliance для руководителей безопасности. Один клик даёт готовый полезный дашборд. Выбор виджетов вручную тоже остался.

03 · Библиотека виджетов

Выбор, в котором легко разобраться

Категории и поиск вместо длинной сетки, крупные превью с реальными данными, заметная метка «Already on dashboard» и счётчик выбранных виджетов. Названия в библиотеке и на дашборде совпадают, поэтому добавленный виджет легко узнать.

04 · Детали

От графика сразу к действию

Детальный вид Track 2.0: приложения, KEV и доступность исправления

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

05 · Новое в 2.0

Чего не было в первой версии

Редактирование раскладки. Виджет можно перетащить за ручку и изменить его размер за угол; сетка подсказывает расположение. На общем дашборде есть предупреждение, что изменения увидит вся команда, чтобы случайно не нарушить работу коллег.

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

Состояния и наложения. У всех виджетов одинаково устроены загрузка, отсутствие данных, ошибка источника и отсутствие прав. В каждом состоянии есть следующий шаг. Если один источник недоступен, остальные виджеты продолжают работать.

Результат

Менее 10 секунд до полезного дашборда вместо минуты. Ролевой шаблон заменяет поочерёдный выбор виджетов.
Эксплуатируемые уязвимости на первом экране. Раньше увидеть их на дашборде было невозможно.
1 клик от графика до списка проблем, с сохранением фильтров. Раньше приходилось переходить в другой раздел и настраивать их заново.
1 набор фильтров вместо 6. Все виджеты показывают один период и одну область данных.
Спроектированы 4 состояния виджета: загрузка, пустые данные, ошибка и отсутствие прав. Раньше их не было.

После запуска я бы отслеживала два показателя: долю эксплуатируемых уязвимостей, исправленных в пределах SLA, и частоту переходов из виджета в детали. Они покажут, приводит ли дашборд к исправлениям.

Чему я научилась

Возможность собрать свой обзор решает задачу «нам всем нужно разное», но не отвечает на вопрос «что делать дальше?». В продукте для безопасности дашборд полезен, когда отделяет реальный риск от шума и ведёт к исправлению в один клик.