Дизайн дашбордов на собеседовании BI
Зачем дизайн дашбордов на собесе BI
На собесе BI-разработчика дают кейс: «спроектируй дашборд для X». Слабый кандидат рисует «все метрики, какие знаю» в одной куче. Сильный — продумывает audience, ключевые вопросы, иерархию информации.
Дизайн дашборда отличает middle от senior. SQL умеют все BI. Спроектировать дашборд, который реально используют — нет.
С чего начинается дашборд
Не с visuals. С 3 вопросов:
1. Кто audience?
- CEO / руководители — high-level KPI, мало деталей
- PM продукта — funnels, retention, feature usage
- Маркетинг — CAC / LTV / channels
- Operations — ежедневные операционные метрики
2. Какие 3-5 вопросов нужно ответить?
- «Растём ли мы?» — Y trend
- «Где теряем?» — funnel drop
- «Какой канал работает?» — attribution
- Каждый вопрос → 1-2 chart-а
3. Что user будет делать с дашбордом?
- Monitoring — высокоуровневые KPI + alerts
- Diagnostics — drill-down в детали
- Decision support — comparisons / scenarios
Без ответов на эти вопросы дашборд = мусор.
Иерархия информации
Pyramid:
- Top (1-3 KPI) — главные числа. Видны при первом взгляде.
- Middle — breakdown по dimensions (регион, время, продукт).
- Bottom — детальные таблицы / drill-downs.
User scanning сверху вниз. KPI наверху — обязательно.
F-pattern: user смотрит верхний-левый угол первым. Туда — самое важное.
Типы чартов: когда что
| Цель | Chart |
|---|---|
| Сравнение категорий | Bar / Column |
| Тренд во времени | Line / Area |
| Доли (max 5-6) | Pie / Donut |
| Корреляция | Scatter |
| Распределение | Histogram |
| Geographic | Map |
| Поток / переходы | Sankey |
| Иерархия | Treemap |
| Tabular | Table (но осторожно — не панацея) |
Антипаттерны:
- Pie c 10+ категориями — нечитаемо
- 3D-charts — distortion
- Line chart без zero baseline — overstate trends
- Multiple Y-axes — confusing
Цвета
Sequential (single hue, varying intensity): для ordinal / continuous (e.g., heatmap)
Diverging (two hues): для метрик с нулём посередине (e.g., growth %)
Qualitative (distinct hues): для categorical (e.g., region)
Best practices:
- Не используй больше 6 разных цветов
- Colorblind-friendly palettes (e.g., ColorBrewer)
- Red = bad, Green = good — стандарт, не нарушай
- Brand colors — для focal points, не для всего
Антипаттерн: rainbow palette. Не передаёт ordinal.
Фильтры и интерактивность
Top-level filters:
- Период (date range)
- Сегмент (region / product line)
- 3-5 max — иначе user теряется
Drill-down:
- Клик по bar → подробности по этой категории
- Не overdose — 2-3 уровня max
Кросс-фильтрация:
- Клик на pie → фильтрует bar и line
- В Power BI / DataLens — встроенная
Performance в design
Тормозящий дашборд = нерабочий. UX правило: < 5 секунд load.
- Меньше чартов на одной странице → быстрее load
- Top-N + others в pie / bar
- Pre-aggregated views (день / неделя / месяц)
- Lazy loading табов
Подробнее — SQL для BI.
Типичные вопросы
«Спроектируй дашборд для CEO маркетплейса»
- Audience: CEO. High-level.
- Вопросы: GMV растёт? Active users? Margin?
- Структура: top — 3 KPI (GMV / WAU / margin %). Middle — line charts по этим метрикам, breakdown по category. Bottom — top-10 issues / alerts.
- Фильтры: period, geography.
«Дашборд для product manager»
PM думает funnel + retention + feature usage. KPI: D7/D30 retention, funnel conversion, NPS. Drill-down: cohorts.
«Чарт типа X — когда использовать?»
Знать decision tree: time series → line, categorical comparison → bar, parts of whole → pie/treemap, correlation → scatter, geographic → map.
«Дашборд тормозит — как ускорить?»
Profiling SQL, materialized view, top-N, agregate level, кэширование. Подробнее — SQL для BI.
Частые ошибки
- «Все метрики на один дашборд». Без иерархии = шум.
- Без audience. «Дашборд для всех» = для никого.
- 3D / rainbow / gradient. UX антипаттерны.
- Без фильтров. User не может drill down.
- Перегруз чартами. 5-7 на page max.
FAQ
Сколько чартов на дашборд?
5-7 на страницу. Больше — табы / drill-downs.
Книги по дизайну дашбордов?
«Information Dashboard Design» Stephen Few — классика. «The Big Book of Dashboards» Wexler/Shaffer/Cotgreave.
Какая ширина / высота?
16:9 desktop. Mobile-first if user смотрит с телефона.
Auto-refresh нужен?
Только для real-time monitoring. Иначе — daily / hourly refresh.
Сколько времени на дизайн дашборда?
Wireframe — 1-2 часа. Builder + iteration с user — 1-2 дня. Production — неделя.