Серый цвет — супергеройский приём в датавизе

Алексей Смагин (@BlackPineapple) — о том, как делать ваши графики понятными и красивыми. А в деталях учу этому искусству на курсе «Эстетика в графиках»

датавизсерый цветвизуализация

Он позволяет оставить на графике больше деталей, но при этом фокусировать внимание на важном.

На первом графике, например, визуализировано количество возрастных пользователей на разных веб-сайтах. Несмотря на то, что при желании можно сравнить пользователей любых возрастов, эта информация сразу уходит на второй план, и акцент в графике делается на категории 45+. Я, правда, не сразу понял, по какому принципу здесь идёт сортировка и не уверен, что стоило делать её только по первому сектору.

На втором графике ситуация иная. Здесь рассмотреть каждый отдельный объект уже не получится, зато благодаря линиям серого цвета мы можем понять, в каких вообще рамках находится инфляция на все продукты. То, как подорожала морковь — это много? А как творог?

Если вам нужно показать контекст или оставить на графике детали второго плана, вспомните про этот пост!

Горизонтальная столбчатая диаграмма с разноцветными секторами и подписями возрастных групп, где выделяется категория 45+ на фоне серых элементов.
Пример диаграммы с фокусом на категории 45+ при помощи цвета и оттенков серого.
Два временных графика роста цен в России: яркие линии для моркови и нежирного творога на фоне серых линий остальных продуктов для контекста.
Как подорожали морковь и нежирный творог в сравнении с остальными продуктами — серые линии показывают фоновые тренды.