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

Категориальные разрезы

Это разрезы метрики по различным категориям, например: город, тип товара, тип устройства, цвет и т.д. Их главная особенность - все разрезы имеют одинаковую ценность с точки зрения информации, и поэтому и на графике они должны показываться на "одном уровне". За это отвечает цвет и его насыщенность. Сначала посмотрим на антипример:

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

Использование цвета разно насыщенности

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

Также цвет показывает "значимость" метрики, мы можем показать план более темным, а план светлым, так как это не точное значение:

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

Грязные градиенты

Популярная проблема не только в датавизе, но и во всем дизайне - это получение грязынх градиентов. Конкретно в визуализации данных этот эффект чаще всего встречается в форматировании таблиц:

Закрепление цвета у метрики на всем дашборде

Чтобы пользователям было проще ориентироваться по многочисленным метриками и графикам на вашем дашборде используйте следующее правило - закрепите за метрикой ее цвет. На графиках где фигугируют "юбки" - задайте им, например, фиолетовый цвет и красьте в него динамику юбок и значения в total-карточке. Аналогично поступите с другими разрезами:

Вот как "ломается" мозг, когда кодирование сломано:

Использование серого цвета

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

нулевые значения (NULL)
то что попало в категорию "другое"
то, что добавлено на дашборд просто для справки
прошлый год
устаревшие разрезы

Красный и зеленый

Самые логичные цвета это красный и зеленый, они легко считываются и все понимают, что красный - это что-то плохое, например падение выручки или заказов. А зеленое - это всегда что-то хорошее. Тут еще стоит обратить внимание на то, что не все метрики при падении должны окрашиваться в красный, а при росте - в зеленый:

Цветовые ассоциации

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

Об авторе

Я Валерия Смирнова, работаю в продуктовой и BI-аналитике более 6 лет, болею за понятные дашборды и датавизуализации, которые помогают бизнесу оптимизировать метрики и становиться более эффективными.Веду свой телеграм канал про датавизуализации, дэшборды
и BI, буду рада, если вы подпишитеcь.

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