Датавиз в BI • Алиса Ручкина
2.2K subscribers
362 photos
25 videos
1 file
266 links
Графики, дашборды, датавиз 📈

Канал Алисы Ручкиной о разработке дашбордов, визуализации данных и секретах китайской BI-системы FineBI.

По вопросам рекламы и сотрудничества: @alisaruchkina

Начни отсюда: https://xn--r1a.website/finebi_design/454
Download Telegram
Это будет легендарно!

На новогодних каникулах я особенно интенсивно смотрю сериал "Как я встретил вашу маму", и вспомнился вопрос от коллеги про легенду.

Цветовая легенда (легенда цветовых обозначений) — это перечень элементов данных, отображаемых на диаграмме, и соответствующие им цвета.

Как создать легенду для двух показателей?
Рассмотрим это в следующем посте👇

#база
Создание легенды для нескольких мер (показателей)

После добавления нескольких мер в полку оси перетащим TargetName в Color, и тогда появится легенда. В видео кастомизируем ее: переименуем пилюли и поменяем местоположение. (Upd. Начиная с версии 6.0.15 TargetName называется Indicator Name)

Готово! Продолжаем праздники😊

#хак #практика
👍4
Пироги и бары

"Это круговая диаграмма, описывающая мои любимые бары. А это столбиковая диаграмма, демонстрирующая мои любимые пироги."

В продолжение темы сериала "Как я встретил вашу маму", мне было особенно смешно в 22 серии 4 сезона. Это серия, в которой один из героев (Маршалл) увлекся графиками и делал их по любому поводу.

А что вы думаете про пайчарты?
Ставьте 👍, если считаете пайчарты одним из рядовых способов визуализации со своими правилами, и 👎, если считаете их злом.

Посмотрим, кого будет больше!

#fun #пайчарт #барчарт
👍5👎4
Реабилитация пайчартов

Тема круговых диаграмм всегда вызывает живые дискуссии. Пользователи просят их, потому что подсознательно нам нравится круглое. В то же время BI-аналитики зачастую относятся к пайчартам негативно, потому что:
при неправильном использовании они вводят в заблуждение
они занимают много места, а плотность информации низкая
случаи их использования ограничены числом возможных категорий (до 5) — если категорий больше, то выбираем стандартный барчарт

Однако если использовать пайчарты с соблюдением рекомендаций, то может это не абсолютное зло?

Если интересно глубже погрузиться в тему, рекомендую посмотреть это выступление Надежды Андриановой, в котором она реабилитировала круговые диаграммы по следующим причинам:

1️⃣ Выбор пайчарта или барчарта определяется нашей личной способностью воспринимать визуализацию.

2️⃣ Пайчарт круглый, значит есть гарантия, что ничего не отрезано. На уровне подсознания нам понятно, что отображен весь массив информации.

3️⃣ Его хорошо воспринимают, потому что часто используют.

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

5️⃣ Главная проблема возникает тогда, когда мы говорим о сравнении секторов между собой. На самом деле, роль пайчарта заключается в сравнении сектора с целым, и в таком случае этот способ донесения информации более правильный.

6️⃣ Пайчарт эффектный и убедительный.

Все эти преимущества можно использовать, применяя определенные правила:

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

Нужна правильная компоновка: сортировка по убыванию по часовой стрелке начиная с 12 часов.

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

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

Примеряя эти рекомендации к FineBI, рассмотрим в следующем посте, как быстро и просто улучшить пайчарт⬇️

#пайчарт #теория
🔥3
Пайчарт на раз-два-три

По умолчанию при выборе типа графика Pie Chart Файн отображает кольцевую диаграмму (он же пончик, бублик или Donut Chart). Чтобы превратить круговую диаграмму в пайчарт, нужно выбрать в настройке Radius коэффициент внутреннего диаметра равным 0 градусов (Upd. Начиная с версии 6.0.15 это кнопка Filled).

Далее:
🔹 Сортируем по убыванию меры
🔹 Указываем меру в процентах как долю от целого, для чего предназначен пайчарт. Сделаем для него отдельное вычисление, потому что иначе в следующем шаге при добавлении названия в подпись данных Quick Calculation - Proportion in the group будет рассчитываться некорректно
🔹 Подкорректируем визуал: сделаем акцент в цветах, добавим название категорий ближе к данным, чтобы пользователь не тратил время на соотнесение цвета сектора с легендой, но вынесем их вне графика и оставим обводку между долями в цвет фона (Upd. по рекомендациям 2 и 3 от Nick Desbarats)

#пайчарт #практика
👍41
Пайчарты в бизнес-среде

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

#пайчарт #теория
👍1
Повторим график из логотипа канала

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

Построим его в 4 шага:
1. Загружаем данные.
2. Создаем вычисляемые индикаторы для показателей, которые должны принимать отрицательное значение и находиться ниже нуля.
3. Выбираем кастомный тип графика и перетаскиваем все необходимые пилюли в рабочую область. Включаем накопление для индикаторов.
4. Корректируем визуал: размер, цвета, сетка, оси и др.

А что в документации?
По традиции смотрим в конце😀 В документации приведены 2 способа построения, однако не учитывается кейс с накоплением.

#барчарт #практика
👍9
Соблюдаем принцип сходства (similarity)

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

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

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

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

#uxui #гештальтпринципы #цвет
👍3👌3
Особенности китайской визуализации

На этом фото в Ведомостях изображен обвал фондовых индексов на китайской бирже во время коронавируса в 2020 году.

Ставь реакцию, если тоже сначала подумал, что это ошибка👍
Я сначала не поверила и провела фактчекинг в Интернете, чтобы убедиться.

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

Первый раз увидела такую интересную особенность у Романа Бунина в этом посте.

#chinaviz #цвет
👍5🔥4
Чем больше я знаю, тем больше понимаю, что ничего не знаю (Сократ)

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

А еще как датавиз-энтузиасту мне было приятно, что помимо технических была пара вопросов о правильном выборе графика и рекомендациях по визуализации.
👍2🔥2👏2
Обучение

Для подготовки к тесту для начала стоит посмотреть курс из 8 уроков на Youtube-канале "Все о BI FineBI, Qlik Sense, Tableau, Power BI". В нем подробно разбираются все темы, необходимые разработчику дашбордов. После долгих праздников не бывает лишним освежить знания😊
Upd. 18/09/24: ссылка на плейлист уроков на Rutube

Ставь 👍, если любишь тесты так же, как я! Завтра для вас будет еще одна интересная ссылка😉

#знания
👍9🔥1
Тест второй, но короче

У меня подарок для любителей тестов, поставивших 👍 к предыдущему посту!

Это ссылка на другой тест по FineBI. У него другой формат: 4 вопроса, без регистрации и без выдачи сертификата.

#news
4🆒2
План-факт. Перекрывающие столбцы

Для полноценного анализа важны не только сухие фактические значения, но и контекст. Например, сравнение с прошлым периодом или планом. Один из способов показать плановые и фактические значения — с помощью перекрывающих столбцов (overlapping bars). Такую диаграмму еще называют "градусник" или "термометр".

Построим их в FineBI таким образом:
🔹 Как и для всех комбинированных визуализаций, выбираем тип графика Custom Chart. Заполняем оси измерением и мерами (фактическая, плановая). Для обеих мер выбираем отображение в виде Rectangular Block. (Upd. Можно и для одной, как добавлено в этом посте)
🔹 Создаем вычисляемые индикаторы, равные выбранным мерам, но со знаком "минус", и кладем их во вкладку Size. Например, для поля Sales это будет индикатор size_Sales: - SUM_AGG(${Sales})

Остается только подобрать ширину столбцов и выбрать цвет

Как сделать визуализацию минималистичнее? Об этом расскажу в следующем посте✌️

#барчарт #градусник #практика
👍3🔥1
План-факт. Буллетчарт, или пулевая диаграмма

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

Построение в FineBI будет даже проще, чем для предыдущего способа в виде градусника:
🔹 Выбираем тип графика Custom Chart. Заполняем оси измерением и мерами (фактическая, плановая). Для фактической меры выбираем Column Chart, а для плановой — Rectangular Block.
🔹 Создаем вычисляемый индикатор "0" со значением 0 и кладем его в Size для плановой меры.

Готово

#буллетчарт #практика
2👌2👍1
Планирование с помощью диаграммы Ганта

В начале года многие составляют списки дел, которые хочется реализовать в предстоящем году. Ставь 👍 к посту, если у тебя есть такой план!

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

Что в теории?
Диаграмма Ганта — это тип столбчатых диаграмм, который используется для представления длительности и последовательности задач в проекте. График был назван в честь Генри Л. Ганта, который представил его в 1910 году.

По сути диаграмма Ганта состоит из полос, ориентированных вдоль оси времени. Каждая полоса на диаграмме представляет отдельную задачу в составе проекта (вид работы), её длина — это длительность между началом и завершением работы.

В следующих постах я покажу, как визуализировала свой план обучения, и построим диаграмму Ганта по шагам😉

#гант #теория
👍5🔥1
Построение диаграммы Ганта

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

🔹 C помощью функции DATESUBDATE cоздаем числовые вычисляемые поля "Начальная позиция" и "Длительность", которые будут служить координатами точек относительно начала года.

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

🔹 Выбираем Custom Chart, отображение в виде Rectangular Block и наполняем рабочую область, как в документации или на этой картинке.

Столбец dummy ("") в моем графике используется для появления горизонтальных осей, чтобы визуально сопоставлять полосы и названия задач.

Продолжение⬇️
#гант #практика
🔥3
Визуализация диаграммы Ганта

В качестве заключительных штрихов:
✔️Добавим новый срез данных в виде раскраски по типу задачи
✔️Отсортируем задачи по дате начала: в теме сортировки есть пример
✔️Добавим на полосках подпись дат с помощью новых столбцов, рассчитанных функцией FORMAT()
✔️Добавим линию "Сегодня" с помощью нового столбца, рассчитанного аналогичного столбцу "Начальная позиция", но до даты NOW()
✔️Отредактируем оси и выровняем названия измерений по левому краю, чтобы получился ровный прямоугольник

Идея создания диаграммы Ганта из коробки уже добавлена в реестр FanRuan, а пока будем пользоваться инструкцией из документации✌️

#гант #практика
👍4👌2