Компания имеет продукт с развитой A/B‑культурой.
Цель задания - спроектировать интерфейс отчёта по A/B‑тестам:

– показать классический сценарий просмотра результатов (метрики × группы),
– добавить режим «по срезам» для глубокой аналитики,
– обеспечить понятную работу с фильтрами, состояниями и статистикой (p‑value).

Срок выполнения: 5 дней.
Формат: ccылка на проект в Figma + краткое описание решений.

Задача дизайна
– Обеспечить аналитикам и продуктам быстрый ответ на базовые вопросы:
«Тест победил или нет?», «За счёт каких метрик и срезов?».
– Сделать интерфейс читаемым при большом количестве данных (метрики, группы, срезы).
– Встроить в интерфейс статистические показатели (p‑value) так,
чтобы ими могли пользоваться не только аналитики, но и менеджеры.

Ограничения
– Нет живых пользователей, только описанный сценарий.
– Неограниченное «полотно» в Figma, но ограничение по времени.
– Нельзя менять саму модель данных (есть группы, метрики, срезы, p‑value).

1. Два режима работы с отчётом
– «Классический» — строки = метрики/срезы, колонки = группы (Контроль, Тест 1, Тест 2…).
– «По срезам» — строки = значения срезов, колонки = метрики, в ячейке — все группы с дельтами.
Это разделяет задачи: «смотреть метрики по группам» и «сравнивать срезы».

2. Явная роль контрольной группы
– отдельная колонка «Контроль» с визуальным акцентом,
– над таблицей текст: «Δ% — изменение относительно контрольной группы».
Это уменьшает риск неправильной интерпретации дельт.

3. Компактное отображение нескольких групп:
– в режиме «по срезам» использую ячейки MultiGroupDelta: несколько групп внутри, цвет + стрелка.
– по наведению — tooltip с абсолютными значениями, дельтой и p‑value.
Это позволяет сравнивать много групп и метрик, не раздувая таблицу.

4. Отдельный слой для настройки фильтров
– выбор срезов и значений вынесен в панель / поповер,
– активные фильтры отображаются тегами над таблицей.
Разделены действия «настроить выборку» и «читать результаты».

5. Проработка состояний
– базовое, с активными фильтрами, пустое (нет выбранных срезов),
– загрузка / ошибка (скелетон + поясняющие тексты).
Это делает продукт устойчивым к реальным сценариям работы.

– Для каждой дельты отображаю p‑value в tooltip:
«p‑value = 0.02 — эффект статистически значим (p < 0.05)».
– Визуально связываю p‑value с цветом дельты:
– яркий зелёный/красный — p < 0.05 (есть статистическая значимость),
– более бледный / серый — p ≥ 0.05 (нет уверенности в эффекте).
– Добавлена мини‑легенда:
что означают цвета, стрелки и порог p‑value.

Цель — чтобы аналитик видел точное значение, а менеджер понимал вывод в одной фразе.

Дальнейшие шаги (если бы это был реальный продукт)

– Настройка метрик и групп:
добавить управление колонками (выбор метрик, порядок, сохранённые пресеты под задачи разных ролей).

– Масштабирование под большие данные:
проработать виртуализацию таблицы, быстрый поиск по строкам, сохранённые наборы фильтров, экспорт.

– Обучающий слой:
встроить отдельный блок «как читать результаты теста» — легенда, объяснение p‑value,
примеры интерпретации для разных ролей.

– Совместная работа:
добавить комментарии к эксперименту и сохранённые «виды» отчёта для команды.

Ссылка на проект в Figma