О эти чарующие большие красивые цифры на дашборде!

Приятно смотреть, как они растут, менее приятно, когда они падают. Редко их значение является неожиданным, но все равно они притягивают взгляд. Здорово, если KPI полезны для бизнеса, замечательно, если на них можно влиять. И по-хорошему, много их быть не должно.

Сколько, по вашему, KPI - оптимально для одного дашборда?
Один? Четыре? Шесть? Восемь? Больше?

На что ориентируетесь при выборе количества? На дизайн, на пользу? Или на жадность? 😁

Напоминаю, что уже сегодня в 14 в Некрасовке (м. Бауманская) творческая встреча, посвященная книгам «Графики, которые убеждают всех» и «Роман с Data science».

С меня вся внутренняя кухня и увлекательный процесс создания книги с самого начала.

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

Если кто-то до сих пор не купил книгу, будет шанс сделать это с автором автора. Вход свободный по предварительной регистрации.

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

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

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

Итак, поехали!

#диаграммки

Линейчатая диаграмма (Бар-чарт)

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

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

Используется для:
- сравнения категорий между собой по количественному признаку,
- ранжирования категорий между собой (1–2–3 место),
- отображения динамики показателя по периодам (вертикально)...

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

#диаграммки

График (Лайн-чарт)

Лайн-чарт — самая переменчивая из диаграмм, она обожает запутанные истории, но и сама может легко запутаться, если вы поставите ей две оси. Она не прочь погулять босиком, наличие нулевой отметки по оси Y желательно, но не обязательно — если вам нужно показывать именно динамику показателя. Данные должны отображаться последовательно, применять ее для категорий не стоит. Она не любит, когда ее обзывают лапшой, для выделения главного Лайн-чарт носит в волосах яркую ленту.

Лайн-чарт— это диаграмма, на которой отображается изменение показателя во времени. На ней мы видим не только значение показателя в момент времени, но и скорость изменения этого показателя - в наклоне линии.

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

#диаграммки

Совмещение диаграмм (двойные оси)

Мы часто можем видеть сочетания разных типов диаграмм на одном визуале. Так Бар-чарт и Лайн-чарт часто встречаются вместе. Не всегда к взаимному удовольствию, впрочем!..

Рекомендации по двойным осям:

- Двойные оси не всегда хорошо считываются, так что можно заменить их на два графика друг над другом - с одинаковой осью X.

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

- Можно убрать вертикальные оси и отобразить метки данных над столбиками/линиями. Но если все элементы будут накладываться друг на друга - будет трудно читать эту диаграмму. В таком случае попробуйте первый вариант.

#диаграммки

Интерактивный дашборд с картами и ловушками из фильма "Один дома" ! 😍

https://public.tableau.com/gallery/home-security-kevin-mccallister-style

Найдено тут:
https://news.1rj.ru/str/vizoftheday/457

История про суд над Мемориалом в комиксах от Кати Гущиной:
https://takiedela.ru/2021/11/komiks-iz-suda-nad-memorialom/

"Будущее уже здесь, оно просто распределено не очень равномерно" - Уильям Гибсон

Мрачные и лаконичные визуализации цитат и слоганов от Jack Butcher 😍

https://twitter.com/visualizevalue

Круговая или пироговая диаграмма (Пай-чарт)

Пай-чарт — парень хозяйственный, он интересуется бизнесом, но главная его страсть — готовка! У него не очень хорошее зрение, и сравнивать данные на глаз у него получается плохо, зато он очень наглядно может показать, сколько кусков пирога осталось в тарелке! Он опасается 3D, потому что уверен, что оно его жутко полнит. Отдельной же слабостью Пай-чарта является любовь к небольшим компаниям.

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

В идеале на пай-чарте можно отразить 2–4 доли целого, отсортировав их по убыванию, начиная от «полудня» по часовой стрелке.
Мелкие доли лучше объединить в «Прочее» и разместить в конце.
Легенду не стоит убирать далеко, лучше подписать значение показателя и названия категорий прямо около секторов.
Эффекты: градиент, тени и 3D — губительны для Пай-чарта.
Не пытайтесь кодировать в пай-чарте динамику или сравнение элементов.

#диаграммки

Обучение оффлайн и обучение онлайн.

Ещё есть вид обучения - в тексте, когда не сталкиваешься лицом к лицу с учениками, только в буквах. И в своём темпе.

Во всех видах есть свои плюсы.

Тот, где нет прямого контакта - самый спокойный, "безопасный", но тут очевидный минус - не ответил ученик, пропал... Что случилось, чем помочь? Не понятно? Скучно? Просто дела появились другие?
Неясно.

Онлайн - тоже интересно, относительно комфортно. Есть привязка ко времени и некоторое организационное напряжение... И конечно, не видишь часто лиц, но есть надежда на отдачу. И все равно часто вслушиваешься в тишину. Поняли? Не поняли? Ушли чай пить? Довольны? Шутить или говорить серьёзнее?
Напишите плюсик в чат.

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

Мне нравится обучать.
А вы обучаете? Как? И как вам больше нравится?

Диаграмма рассеяния или Точечная диаграмма (Скаттер‑плот)

Скаттер-плот — очень любознательная диаграмма, обожает статистику и научную фантастику, обижается, когда ее (его?) считают задротом. Может отобразить больше параметров, чем другие диаграммы, и страшно этим гордится, потому что может увидеть между ними никем не замеченные связи. Правда, если данные слишком рассредоточены, то толку от них мало, так что скаттер-плот очень радуется, когда на диаграмме выявляется некоторый тренд — поэтому скаттер очень дружит с лайн-чарт.

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

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

#диаграммки

Alli Torban визуализировала по этапам процесс её фриланс проектов.

Это было сделано для программы, которую они с Will Chase скоро запускают. Если что, по ссылке можно узнать подробности и записаться в лист ожидания.

https://twitter.com/AlliTorban/status/1475548418240126977?t=XAo8Y17q32LXNF7kmWev5Q&s=19

Как вам такой виз-иллюстрация? По-моему, довольно мило, только я начала её читать слева, с ног... Следуя логике чтения и направлению движения персонажа.
А начало у автора, судя по этапам - с головы 🤔

Перевела несколько советов фрилансера Alli Torban, которые показались мне полезными. Подробности по ссылке ниже:

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

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

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

https://dataviztoday.com/shownotes/70

Таблица

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

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

#диаграммки

С наступающим!

В новом году давайте будем за все хорошее, против всего плохого! 🥳

Здоровья вам ❤️

Гистограмма и Бар-чарт

Очень похожие, но все-таки разные. Когда-то в сообществе визуализации мы обсуждали - в чем же различие?

Суету наводит Excel и некоторые другие программы, где в русском переводе называют столбчатые диаграммы гистограммами, не особо заморачиваясь. Даже в русской википедии путаница продолжается ( в английской все ок).

Итак, отличия:

- Гистограмма служит для конкретной цели: показать частотность распределения величины по интервалам.

- Гистограмма вертикальна, бар-чарт активно применяется в горизонтальном виде

- У гистограммы промежуток между барами минимален или его вообще нет, у бар-чарта промежуток есть.

- Гистограмма работает с одной переменной, бар-чарт с двумя (что спорно, потому что бывает в гистограмме: параметр по возрастам).

- Значения на оси Х у гистограммы всегда последовательны, у бар-чарта не обязательно.

Подробности про гистограмму лучше читать на англоязычной вики:
https://en.wikipedia.org/wiki/Histogram

Знаете еще отличия? делитесь!

#диаграммки

Tom Larkworthy делится подборкой блокнотов observablehq с датавиз, дизайн и математическими работами.

Коды можно посмотреть по ссылке ниже.

https://dev.to/tomlarkworthy/100-beautiful-and-informative-notebooks-of-2021-23lg