О чем разговор
На предмете "Визуализация данных в образовании", который преподаю в МГПУ, начали говорить про варинаты представления данных. Вспомнили довольно много - круговые и столбчатые диаграммы, точки на плоскости, разделение по квадратам и т.д.
Голосуйте своими "лайками", если понравится материал - сделаю расширенный заход на типы представления данных.
В конце занятия один из магистрантов говорит: а как же анимация? Начинаем выяснять, о чем разговор. Чаще всего под анимацией понимают последовательное появление текста на слайде Power Point. Но тут другая ситуация: есть, говорит, ролик из ТЭД, где прям все круто анимировано, и это влияет на качество восприятия материала.
Отвечаю, что врядли, но пришлите ссылку на ролик, глянем что к чему. Ссылка была отправлена в чат. В процессе просмотра ролика решил сделать разбор увиденного - действительно есть о чем поговорить.
Ссылка на ролик:
Далее будут скрины из ролика и мои комментарии о них.
Разбор используемых приемов
В глаза бросается насыщенный данными экран, специализированный интерфейс демонстрируемой программы и панелька Windows XP (прям вспомнил, прослезился 🥹 ). В целом, демонстрация пузырьков диаграммы не большая новость (особенно в 2025 году).
Важно отметить, что такой тип диаграммы строится на 3х параметрах из набора данных: ось Х, ось У, размер круга.
На этом слайде скомбинировано несколько способов представления информации: текст, стрелочки около одного слова из пары, столбчатое представление, логическое разделение слайда на 3 части:
- верхняя часть - заголовок
- средняя часть - пары названий стран
- нижняя часть - средний балл правильных ответов (3 столбца)
Сейчас в тексте чаще встречаются 🧐 и ☝🏻, когда пишут о чем-то важным и ☕️, когда предлагают выпить чаю. Главная идея, что к "слою текста" слайда можно добавить "слой стрелочек", который будет работать в паре с ним: обеспечивать связи, демонстрировать закономерности, управлять вниманием зрителя. При этом если убрать текстовую подлодку - стрелочки потеряют свою информативность.
Также можно сделать ту самую анимацию последовательного появления или сделать два разных слайда (есть сервис, в котором собираемся показывать свою презентацию не поддерживает анимации и трансляцию).
Здесь очень классно сделано "движение данных" по экрану. Выглядит действительно здорово и красочно, но:
Для создания такого ролика используется специальное самоличное ПО (по словам автора)
При этом любую анимацию с данными можно разложить набором картинок и последовательным их показом. Еще можно сделать "в ручном формате" такую диаграмму (линии, кружочки и фоновая сетка из линий) и придать плавность перемещения элементам функцией Трансформация в PowerPoint. Но для этого у вас должна быть свежая версия.
Листайте галерею - этот прием встречается у докладчика несколько раз
На этом слайде вижу два интересных подхода к визуализации данных.
1. Выделение ярким цветом кружочков, о которых докладчик рассказывает в данный момент. Таким образом он удерживает внимание зрителей на конкретных данных.
2. Создание "следа перемещения" - данные за предыдущий период остаются на слайде, а поверх появляются данные нового периода. Таким образом "раскладывается движение" и мы видим всю динамику изменения данных во времени.
Такие приемы очень классно использовать когда нужно показать переход между уровнями обучения в школе, метапредметность, движение документа по организационному процессу и т.д.
Интересное сочетание применения нескольких типов визуализации - график, закрашенные области, подписи данных, круговые диаграммы (монета разделяется на сектора).
В моем видении перегружено, сейчас я бы такой слайд не делал, особенно на темном фоне. С другой стороны сверху хватает свободного места, подписи минималистичные, есть цветовая дифференциация по типам подписей. Но это явно сделано ручным наложением нескольких изображений (а по видео еще анимирован разлет кусочков монеты).
Молния добавляет драматичности, но никак не влияет на содержание. В динамике может быть смотрится не плохо, но для себя использовать бы такой прием не стал.
Не забудьте полистать галерею
На этих изображениях показал наглядно (да-да, мы про визуализацию), как докладчик формирует общий контур из отдельных частей. Стандартная диаграмма с накопленным эффектом и разделена на последовательное появление. Может быть имеет смысл, чтобы с первого шага не перегрузить зрителя.
Важно понимать: с какой аудиторией вы общаетесь. Если это профессионалы, так еще и мотивированные на слушание вас, то можно смело грузить сложными схемами и большим объемом данных. С вашими пояснениями они точно вникнут и смогу задать сутевые вопросы. Если они не профи, так еще и не мотивированные, то они и на представлении первых двух слоев "поплывут" и потеряют к вам интерес. Скажу банальность, но необходимо собюдать баланс между сложностью визуализации и развлечением аудитории. Развлекать не обязательно шутками и мемами (хотя прикольно). Достаточно использовать простые и красочные образы.
Прием интересный, смотрится здорово, но также не влияет на содержание данных, не упрощает их понимание. В правой части слайда двигаются названия стран совместно с их слоями на диаграмме. Такой прием демонстрирует последовательное перетекание и, если не отвлекаться, можно четче уследить "откуда что взялось".
Любовь автора к пузырьковым диаграммам видна невооруженным взглядом, а еще они действительно максимально наглядно в его тематике показывают большое количество данных. Но тут отмечу другие приемы:
легенда диаграммы - хоть нет подписей, но цветовое разделение позволяет соотнести с ними названия стран.
подписанный шаг на осях - каждая ось имеет свой масштаб и крайне важно это подсветить. Он не обязательно должен начинаться с нуля. главное, чтобы он был понятен зрителю. А еще не обязательно ограничивать себя рамками осей, но об этом позже.
текст на фоне - цифры года сделаны контурными, полупрозрачными и помещены на задний план. С одной стороны они присутствуют на слайде, с другой они не перетягивают на себя особо много внимания. Мы ипользовали такой прием в презентации магистерской программы "Обеспечение безопасности образовательной организации". Пишите в комментариях, если хотите ее посмотреть.
В случае докладчика, при наведении курсора на кружки всплывала дополнительная информация.
На этом слайде докладчик последовательно проваливается сначала в кружок страны, потом областей и потом выделяет крайние их значения. Таким образом мы видим ярко фиолетовые Арабские страны, прозрачные кружочки остальных стран и выделенные крайние значения - ОАЭ и Йемен.
Листайте галерею и ищите оригинальный ход докладчика
Даю вам 30 секунд, чтобы найти "не багу, а фичу" визуализации.
30...29...28.... 2....1....0!
На нижней левой стрелке докладчик выходит за размеченную область. Делает он это специально, демонстрируя выход значений за края имеющейся шкалы. При этом автор соблюдает масштаб шкалы, что является крайне важным для корректной визуализации данных.
На этом слайде также используется такой прием - выход за размеченные пределы. Он позволяет показать выбросы в данных и крайние значения. Повторюсь, главное чтобы соблюдался масштаб выбранной шкалы.
Помимо прочего тут соединены линейные графики и пузырьковая диаграммы. Так еще линейный графики состоят из одинакового количества точек. Это тоже важный момент - чтобы сравнивать какие-либо данные, они должны быть рядоположны и единообразны. А то получится, что будете сравнивать кислое и длинное.
Листайте галерею
Тут докладчик решил, что мало ему графиков и диаграмм, надо выпускать более серьезное оружие - дизайн. Да, делаем скидку на то, что это было двадцать (ДВАДЦАТЬ КАРЛ) лет назад, мягкой графики и "стекла" еще не делали, но тут и ядреные цвета, и разноформатные цветы, и неровные линии. Кстати такие сейчас тоже хорошо заходят в разных дизайнах.
Вероятно особого внимания заслуживает слайд с перечнем технологий: ныне покойный Flash, здравствующих Illustrator, Power Point, After Effect и не сильно популярный Freehand (старенький векторный графический редактор).
Получается даже тут сквозит идея, что с данными надо работать не только математически, но и творчески. Ведь "от руки" нарисовать можно все что угодно, а если это пр=одкрепить цифрами и отдельными расчетам - то будет совсем хорошо. Вероятно именно так развивалась инфографика, как графическое представление данных.
Удобный прием при работе с большим количеством данных это применение чекбоксов для выбора того, что надо демонстрировать. В правой части экрана это видно. Сейчас можно реализовать различным веб-инструментам, сводной таблицей в экселе с парой форму или каким другим пакетом обработки данных.
Завершает наш разбор применение экспоненциальной шкалы. Такой ож оправдан в том случае, когда очень большой разброс данных с одной стороны и не важна избыточная точности с другой. Для качественного анализа вполне подойдет.
Выводы
Подготовка визуализации это большой, трудоемкий и сложный процесс. Если вы ждали, что я скажу "Это все просто, берем раз-два-три, дунули-плюнули и готово!" то нет, так не могу )))
Важно отметить, что наглядно продемонстрировано хорошее сочетание объемных данных, цели их демонстрации и работы по подбору визуального ряда (в том числе то, что сейчас смотрится не так уж ярко типа молний или вырви глаз рамок).
Так что не бойтесь сочетать графические инструменты и статистические пакеты, понимайте свою целевую аудиторию и ставьте корректные цели для демонстрации!
На связи!