Карьерный рост аналитика. Статья Алексея Колоколова

Критикуем авторитетов: как мы переверстали дашборд KPMG

Мы привыкли доверять авторитетам. Я и сам, когда осваивал профессию бизнес-аналитика, во многом ориентировался на минималистичный стиль дашбордов McKinsey или KPMG. Но спустя время понял: важно, чтобы это доверие не было слепым. И очень важно развивать критическое мышление постоянно.

Иногда мы с командой тренируемся в этом. Расскажу, как мой фронтенд-аналитик Екатерина Стушкова решилась на критику дашборда компании KPMG.
KPMG — одна из крупнейших аудиторских компаний в мире, представитель «Большой четверки». Работает в 139 странах, годовой оборот исчисляется десятками миллиардов долларов, а число сотрудников — сотнями тысяч человек.
Понятно, что к этой компании мы относимся с уважением. Но для развития критического мышления иногда полезно поискать недостатки и в работах таких гигантов. Вникнуть во все детали, со стороны оценить подход к информационному дизайну и найти, что можно было бы сделать иначе. Критикой Катя не ограничилась: она предложила и свой вариант дашборда топовой компании.

3 типовые ошибки на стильном и дорогом дашборде

Ежегодно KPMG выпускает исследование о слияниях и поглощениях в мировой бизнес-среде (M&A-Радар). Раньше оно было в PDF из 50+ слайдов, но в 2021 году вышло в формате интерактивного дашборда в Power BI. Вся информация уместилась на 10 страницах. Именно эту работу Екатерина и взяла на «прожарку».

Обсуждать выбор метрик и показателей для дашборда здесь не будем. Остановимся на правилах грамотной передачи смысла данных, а также UI и UX дизайна — именно от этого зависит удобство восприятия и анализа информации. Расскажу о плюсах и минусах визуального оформления отчета в целом, а затем разберем несколько отдельных страниц.
Одна из страниц исследования KPMG M&A-Радар
Одна из страниц исследования KPMG M&A-Радар
Дашборд выглядит стильно и аккуратно, оформление полностью соответствует корпоративному стилю. И это не единственное очевидное преимущество. Рассмотрим несколько.

1. Слева есть меню, понятное каждому пользователю — однозначный плюс, которым часто пренебрегают.

2. Контрастные цвета помогают легко считывать информацию, а кнопки навигации в правом верхнем углу — удобно переходить по страницам.

3. Дата на панели слева (30 июня 2021 года) помогает сразу понять, на какой период все данные в исследовании были актуальными.

4. Дашборд адаптирован для пользователей с разной подготовкой. Кроме титульной страницы и описания методологии исследования, есть инструкция по использованию этого интерактивного инструмента.

За последний пункт скажу отдельное спасибо специалистам KPMG. Нас здорово вдохновила эта идея с инструкциями, потому что не все клиенты Института бизнес-аналитики — опытные пользователи интерактивных дашбордов.

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

Система контроля для малого и среднего бизнеса. За месяц

Дашборд для директора
УСЛУГА
Но все же на дашборде KPMG есть ошибки, которые либо не помогают анализу данных, либо даже мешают ему. Упомяну те, которые бросаются в глаза сразу. Некоторые повторяются на всех страницах исследования.

Лишние элементы. Каждый элемент на дашборде должен быть целесообразным и помогать пониманию данных. Здесь, к сожалению, не все так. Например, в левом нижнем углу каждой страницы есть фотография. Она неплохо вписывается в общий дизайн, но занимает место и не играет никакой роли на дашборде.

Где-то остались детали дополнительной оси — вроде мелочь, но +1 к неаккуратности. А местами есть даже диаграммы, которые просто дублируют информацию.

Расположение легенды. Человек считывает информацию сверху вниз и слева направо. Сначала он должен понять, что изображено на диаграмме, а только потом переходить к анализу информации. Поэтому легенду нужно размещать над диаграммой.

В отчете KPMG некоторые легенды находятся под диаграммами. Это усложняет и замедляет анализ данных. Мы увидели диаграмму, не поняли, о чем она, только потом наткнулись на легенду и… приходится снова возвращаться к диаграмме. На некоторых же визуальных элементах легенды просто нет. Значит, у пользователя нет возможности понять, что они показывают.
Группировка периодов. Пример есть уже на первой странице исследования. Обратите внимание на столбцы диаграммы. В большинстве из них — показатель за год, но на последних двух — за полгода.

Это грубейшая ошибка: сравнивать такие показатели как минимум некорректно. Временные отрезки на одной диаграмме должны быть равными. Всегда.
Неверная группировка периодов на диаграмме
Цель интерактивного дашборда — упрощать и ускорять анализ данных. Это правило номер один. Если человек вынужден совершать лишние действия или может неверно воспринять смысл данных, значит, с дашбордом что-то не так.

Как уменьшить число диаграмм в два раза

Переходим к отдельным страницам M&A-Радара. Сначала рассмотрим «Отраслевой анализ» и разберем нарушения правил визуализации данных. Вот как выглядел этот дашборд у KPMG.
Ошибки на дашборде
Дашборд KPMG до переверстки

Расположение и оформление KPI

Ключевые показатели — первое, что пользователь должен видеть на дашборде после заголовка. Диаграммы детализируют эти числа, а потому их логично располагать ниже. Но здесь карточки KPI размещены справа, в одной из самых непросматриваемых областей. Значит, пользователь не может быстро оценить числовые показатели.

Есть претензия и к расположению элементов в карточках. Правило все то же: в первую очередь мы должны понять, что показывает число. То есть сначала — заголовок, а уже под ним — показатель. Я не назову это фатальной ошибкой, но учитывать особенности восприятия все-таки стоит.

Отдельный вопрос — цвета чисел в карточках. Видно, что хотели как-то разнообразить и сделать «красиво». Но на дашборде цвета нужны для смыслового кодирования: каждый цвет что-то значит. Здесь розовый, фиолетовый, синий и голубой, скорее всего, не значат ничего. И пока человек интуитивно пытается уловить связь этих цветов с цветами на диаграммах, он теряет время впустую.

Оформление столбчатых диаграмм

Первым бросается в глаза цветной фон меток данных у диаграммы слева. Значит ли он что-то? Нет. А значит, не нужен.

Это не просто лишний элемент — как и в предыдущей ошибке, голубой фон заставляет мысленно связывать эту диаграмму с правой. Но связи по цветам между ними нет.
Неверная группировка периодов на диаграмме
На линейчатой диаграмме справа — снова ошибка с расположением легенды, которая находится внизу. То есть какое-то время пользователь не понимает смысл голубого и синего. Потом видит обозначения в легенде и снова возвращается к диаграмме. О том, что легенда не должна наезжать на заголовок диаграммы ниже, и говорить не буду.

Легенда на кольцевых диаграммах

Не перестаю повторять: на круговых и кольцевых диаграммах не нужно использовать легенду! Это снова отнимает время пользователя: чтобы проанализировать данные, ему приходится перемещать взгляд от сектора диаграммы к легенде и обратно.

Располагайте метки категорий рядом с их значениями на секторах. Тогда диаграмму будет гораздо легче читать, да и места на дашборде она займет меньше.
Неверная группировка периодов на диаграмме

Порядок диаграмм

Структура дашборда всегда выстраивается от общего к частному. Именно поэтому в его верхней части мы располагаем главные числа — карточки с ключевыми показателями.

Во всем остальном действуем так же. Например, сумма сделок по географии — это верхнеуровневый анализ. А распределение сумм по отраслям — уже более «частное» явление. Поэтому есть смысл поменять кольцевую и линейчатую диаграммы местами.

То же самое и с правой частью, где мы анализируем количество сделок. Сначала — информация по их географии, а потом — по конкретным отраслям бизнеса.
Неверная группировка периодов на диаграмме
Но здесь стоит поступить еще проще и сэкономить драгоценное место на дашборде. Информацию о суммах и количестве сделок можно разместить на одной диаграмме и просматривать нужное с помощью фильтра-переключателя. Вот как мы исправили все упомянутые недостатки страницы «Отраслевой анализ».
Переделка дашборда
Отраслевой анализ KPMG после переверстки
1. Карточки KPI разместили в верхней части дашборда, чтобы пользователь сразу видел главное.

2. Столбчатые диаграммы объединили, добавив переключатель в область фильтров — удобно смотреть данные о сделках в разрезе их сумм или количества.

3. Кольцевые диаграммы по географии сделок тоже объединили в одну: клик по переключателю слева выведет данные либо по суммам, либо по количеству. Метки категорий перенесли из легенды ближе к секторам.

4. Упорядочили уровни информации. Сначала — общие данные по географии, потом — по конкретным отраслям.

5. В диаграмме для анализа сделок по отраслям разместили легенду сразу под заголовком. Так пользователь будет сразу понимать, что видит перед собой и почему на диаграмме два цвета.
Решение задач бизнеса с помощью аналитики
Кейсы и лайфхаки от практика
Excel, Power BI, PowerPoint

Обучение на реальных бизнес-задачах

Курсы по визуализации и аналитике данных

Как использовать географическую карту разумно

Одна из страниц на дашборде под названием «Покупка иностранных активов» почти полностью занята географической картой. И в такой композиции тоже есть серьезные ошибки.
Ошибка с картой на дашборде

Непонятная карта

Что должен увидеть пользователь на этой карте и какой вывод он может сделать? К сожалению, это осталось секретом. Легенды для пояснения над картой нет. Впрочем, нет ее и под картой. Остается только домысливать, что хотели показать создатели дашборда. Мы видим только то, что этот визуальный элемент занимает 80% рабочего пространства при минимуме информации.

Расположение показателей

Главная ошибка на этом листе отчета — показатели вынесены в область фильтров! Это значит, что им достанется минимум пользовательского внимания. Или не достанется совсем.

Как и на других страницах, карточки KPI размещены в «теневой» области, к которой человек переходит в последнюю очередь. И цвет показателей в них по-прежнему остается загадкой.

В переделанном варианте эта страница изменилась значительно. Вот как она стала выглядеть.
Измененный дашборд KPMG
1. Фильтры переместили в правую верхнюю часть дашборда: их всего два, и выделять им целую панель нецелесообразно.

2. Показатели с панели перенесли на отдельные диаграммы. Так информация становится наглядной и сразу видно, в какой отрасли самые дорогие сделки.

3. Ну а с картой пришлось придумывать — не обессудьте: разные суммы сделок по странам мы разметили разными оттенками. И добавили легенду, чтобы сразу было ясно, что показывает эта карта.

Как сконцентрировать внимание на данных, а не на цветах

Нельзя не прожарить страницу KPMG о продажах иностранным инвесторам! Буйство красок, которое, к сожалению, никак себя не оправдывает. Судите сами.
Ошибки на дашборде KPMG
Отмечу плюс этой страницы — сюда добавили переключатель, чтобы не множить диаграммы и удобно просматривать данные в разрезе количества или сумм сделок. Но разберем ошибки, которые мы здесь увидели.

Уровни информации на дашборде

Уже упоминал, но здесь не грех и повторить. Композицию дашборда выстраиваем от общего к частному: только так пользователю будет проще усвоить информацию и составить в голове полноценную картину происходящего.

Здесь правило информационных уровней нарушено примерно во всем. Карточки с ключевыми показателями даже не у правого края, а вообще внизу. Хотя по сути они — и есть то «общее», с которого дашборд должен начинаться. Но это не все.

Диаграмма с динамикой сделок по годам стоит первой. Но на ней уже все-таки частности: сначала необходимо проанализировать структуру по регионам. А значит, диаграммы нужно менять местами.

Цветовое оформление

Ой-ой-ой! Такой была моя реакция, когда увидел эту страницу дашборда впервые. По цветовому оформлению есть вопросы к большинству элементов, но победитель — диаграмма с динамикой количества сделок по годам.

Что означают эти цвета? Чтобы расшифровать их, придется опускать взгляд к легенде кольцевой диаграммы. А потом еще разбираться в одинаковых синих секторах — то ли это АТР, то ли Ближний Восток…

Это примерно то, что многие несут в Power BI из Excel, где мы не используем интерактивность. Чтобы понять, как изменялось количество сделок в каждом регионе, пользователь вынужден сравнивать цифры — цветные части столбцов этому не помогают. Получилось много всего и ничего не понятно.
Неверная группировка периодов на диаграмме
С цветовым оформлением чисел в карточках все по-прежнему. Они снова цветные, и мозг пытается связать это с теми же цветами на других диаграммах. Хотя связи нет — цвета в карточках не значат ничего.
Ошибки в оформлении карточек KPI
Переверстка этой страницы дашборда была кардинальной, иначе здесь просто нельзя. Мы исправили описанные недостатки, а заодно поправили ошибки, о которых я уже говорил выше. Вот как дашборд стал выглядеть в результате.
Переверстка дашборда Power BI
1. Перенесли фильтры и переключатель из левой панели в правую верхнюю часть дашборда. Так они занимают гораздо меньше ценного пространства.

2. Избавились от кольцевой диаграммы, которая во многом дублировала диаграмму справа. Всю информацию с них перенесли в матрицу.

3. Убрали карту справа, которую, судя по всему, делали исключительно для красоты. Она не несла никакой информации, а значит, просто занимала место и отвлекала.

4. Информацию со столбцов на карте перенесли в матрицу. Мы предположили, что их цель — сравнить результаты двух лет в каждом регионе. Поэтому показали отклонение от предыдущего года и настроили цветовое форматирование, чтобы сразу было видно, где число сделок выросло, а где сократилось.

5. Переделали диаграмму динамики с количеством сделок по годам — убрали нагромождение показателей. Чтобы посмотреть данные по конкретному региону, достаточно выбрать его в матрице, и диаграмма выведет только нужную информацию.

6. Переместили диаграмму динамики количества сделок, чтобы не нарушать правила уровней информации.

Вот как отличаются проанализированные страницы исследования до и после переверстки. Листайте, чтобы увидеть все варианты.

Существуют ли идеальные дашборды?

Скажу откровенно: я не знаю. Ошибки и недочеты можно найти в большинстве работ. В том числе, на дашбордах Института бизнес-аналитики. Главное, чтобы эти ошибки и недочеты не влияли на достоверность данных и доносили информацию до пользователя быстро и понятно. Иначе весь смысл теряется.
Прошу понять меня правильно. Я не обесцениваю труд KPMG — они крутые специалисты. Просто хочу показать: то, что мы традиционно считаем эталоном, не всегда на самом деле эталон.
Многие из упомянутых в статье ошибок появились из-за нарушения базовых правил визуализации данных. Такое случается по разным причинам, и не всегда потому, что специалистам не хватило каких-то знаний и навыков.

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

Я стараюсь следовать этому во всех направлениях своей работы. Например, в обучающих программах мы со студентами изучаем галереи Power BI и Tableau. Оптимизируем выбранные решения и обсуждаем, как сделать их лучше для бизнеса. Это развивает насмотренность и пополняет багаж знаний.

В клиентских проектах я лично проверяю каждую работу перед тем, как она уйдет заказчику. Но все равно иногда сталкиваемся с ситуациями, когда реализовать задумку не удается. Чтобы таких ситуаций было меньше, мы анализируем каждую из них. Разбираем сложные случаи, в которых нет единственно правильного решения. Ищем варианты, которые не будут вызывать дискомфорта у заказчика, но при этом помогут грамотной передаче смысла данных. Потому что насмотренность и критическое мышление — возможно, одни из главных навыков для хорошего дата-аналитика.
Адаптация для нестандартных носителей
Визуализация данных любой сложности
Решение задачи, а не просто красивые картинки

Для сложных KPI и требовательных заказчиков

Кастомные BI-решения
УСЛУГА
Вам понравилась статья?
Читайте также
Подпишись на рассылку и получи в подарок «Каталог лучших отраслевых дашбордов»!

Хочешь получать актуальные статьи о визуализации данных?