📊 Красный или синий? Квадраты или кривые?

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

Для чего? Чтобы собирать более крутые дашборды и лучше продумывать визуальный стиль в сообществе, потому что визуализацию ещё можно прикрутить к UI/UX.

В целом весь подход базируется на манипулировании преаттентивных атрибутов — визуальных свойств, которые человеческий мозг обрабатывает мгновенно, еще до того, как мы осознанно обратим внимание на изображение. Этот процесс занимает менее 200–500 миллисекунд.

Вот чем можно управлять в визуализации, чтобы было понятнее + где можно применить:

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

▫️Ширина Этот атрибут считывается сложнее, чем длина, но хорошо работает для обозначения «веса» или значимости потока. Его можно применять в диаграммах Санкей, визуализирующих путь пользователя: широкая линия показывает, откуда приходят люди, и дальше всё разбивается по узким ручейкам.

▫️Ориентация Наклон линии мгновенно воспринимается как тренд: рост, падение или стагнация. Этот подход полезен для отслеживания динамики CSI или ERR, например.

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

▫️Форма Треугольники, квадраты и круги хорошо работают для категоризации данных, но если форм становится слишком много (больше 5–7), мозг перестает их мгновенно различать. Этот подход можно применять опять же на графах. Например, квадратами можно обозначить модераторов, а кругами — обычных пользователей, что позволит одним взглядом оценить влияние и активность разных ролей.

▫️Изгиб Прямая линия воспринимается иначе, чем изогнутая, что часто используется для разделения жестких и плавных трендов. Этот атрибут можно использовать для того, чтобы различать явные тренды и хаотичные перемены на линейном графике.

▫️Добавленные отметки Это любые дополнительные значки, привлекающие внимание к обычному объекту. Нелегко применить.

▫️Контур Любые объекты, заключенные в рамку или общую область, автоматически воспринимаются как группа. Контур полезен для выделения когорт. Можно использовать, когда мы анализируем поведение определенных групп, например новичков. Обведя их в один круг, мы будем лучше понимать их как целостность.

▫️Цветовой тон Это то, что мы называем цветом (красный, синий, зеленый), и это хорошо способ разделить данные на категории. Вспомним разделение трендов на красный для отрицательного и зеленый для положительного.

▫️Интенсивность цвета Более темный или насыщенный оттенок воспринимается как «большее» значение, что интуитивно понятно при чтении тепловых карт. Этот атрибут подойдет для анализа активности по времени. Например, для тепловой карты по активности людей в чате в разрезе времени. Чем интенсивнее цвет, тем больше было переписок.

▫️Позиция Это полезный атрибут для количественного сравнения: мы лучше всего понимаем данные, когда видим их точное положение на осях координат.

▫️Пространственная группировка Объекты, расположенные близко друг к другу, наш мозг считает связанными, даже если у них нет общего контура. Этот атрибут используется, например, при визуализации облака тегов. Там слова группируются в плотные кучки, и мы сразу видим сформировавшиеся тематические интересы аудитории без нужды читать каждое слово.

Теперь есть больше идей для вдохновения своих визуализаций. Как минимум, их можно включать в запрос для ИИ, как максимум — самим настраивать в Excel 😪 Пройти исследование для комьюнити-менеджеров