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

Наш абсолютный фаворит — визуализация потерь во Второй мировой «Fallen.io», автор: Нил Хэлоран (Neil Halloran).

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

Схожий по формату интерактивный анализ урбанизации Восточной Азии, автор: Нади Бремер (Nadieh Bremer):

Карта, столбиковые диаграммы, точечные гистограммы и графики интерактивно связаны друг с другом. Полная визуальная картина азиатской демографии в 2000 и 2010 гг. дополнена лаконичными выводами. Анализ, достойный курсовой работы по социологии, поместился на девяти интерактивных слайдах — блестяще!

Газета «Гардиан» опубликовала Тест «Насколько хорошо вы знаете свою страну» с вопросами о демографии:

Интересна визуализация результатов «ответы / факты», а также выводы, в целом и по конкретным вопросам.

Классный трёхмерный график (большая редкость!) появился в «Нью-йорк-таймс» — поверхность доходности короткосрочных и долгосрочных гособлигаций:

Авторы утверждают, что график показывает ценность денег сейчас, в ближайшем будущем и на годы вперёд, но простым смертным, вроде меня, уловить суть прогноза сложновато. Зато я обращаю внимание на минималистичность интерфейса (график сложен сам по себе, чтобы утяжелять его дополнительными элементами), пояснения «для чайников», сопровождаемые поворотом графика под нужным углом, и цветовое кодирование, которое хотя и дублирует значения по вертикальной оси, необходимо для считывания рельефа поверхности.

Там же, примечательная история похудения — 4 года жизни мистера Стива Лочнера, описанные кривой колебаний веса:

На графике задокументированы взлёты и падения, наградные татуировки и поворотные жизненные решения, периоды диет и приступы обжорства, есть даже классические фото «до и после». Можно посмотреть каждый завтрак, обед и перекус, занесённый Стивом в приложение «Loose It», с помощью которого он следил за питанием и весом. В заключении на фоне кривой Лочнера показаны результаты других (менее успешных) пользователей приложения.

«Уолл-стрит-джорнал» порадовал яркой и содержательной визуализацией случаев заражения инфекционными заболеваниями до и после массовой вакцинации во всех 50 штатах:

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

А вот классные спортивные визуализации.

У нью-йоркского марафона появилась интерактивная визуализация результатов (вроде той, что мы уже третий год подряд делаем для Московского :-)

Изумительная визуализация Питера Кука о пилотах Формулы-1: все победители и призёры на одной диаграмме с сортировкой по возрасту, годам участия и количеству гонок.

Необычное, но одобренной нашим футбольным экспертом Дамиром, представление результатов футбольных матчей, автор: Том Лоуренс (Thom Lawrence). Прямоугольники — атаки, цветом закодирована скорость:

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

Ещё один достойный внимания жанр — визуальные объяснения. В прошлом году Майк Босток опубликовал подробную и очень наглядную статью об алгоритмах сортировки с элементами визуализации:

В этом году появились достойные последователи. Визуальное объяснение принципов машинного обучения от r2d3:

Иллюстрация формулы условной вероятности, автор Виктор Пауэлл (Victor Powell):

И о погоде. Нам приглянулся симпатичный график температуры в Нью-йорке на фоне среднего и рекордных значений:

Лабораторная вариация на тему:

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

С наступающим Новым годом!

Спрашивает Жанна Гугунова из «HeadHunter»:

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

Попробуем отобразить все три параметра на одной интерактивной визуализации. Пусть по оси X будет количество вакансий, по оси Y — количество резюме, а среднюю зарплату покажем размером точки. Рынок труда в Москве в ноябре по топовым профсферам будет выглядеть так:

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

Видим, что самые активные профсферы — «Продажи» и «Начало карьеры», причём в первой конкуренция относительно низкая (3 резюме на вакансию), а во второй — высокая (более 10). Конкуренция в большинстве профсфер превышает 5 резюме на вакансию, нет ни одной профсферы ниже единицы, то есть дефицита кадров не наблюдается нигде.

По средним зарплатам с большим отрывом лидирует «Топ-менеджмент», но и конкуренция там самая большая, более 20 резюме на вакансию. Самые низкие средние зарплаты — в профсферах «Администрация» и, как ни странно, «Банки»; они даже ниже средней зарплаты в «Начале карьеры».

Добавим на график временную динамику. История одной профессиональной области будет выглядеть так:

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

На графике проявилась форма, похожая на букву «s». Это сезонные рост (весна-лето) и спад (осень-зима) активности на фоне увеличения конкуренции. В «Продажах» активность в ноябре 2015 года осталась на том же уровне, что и в ноябре 2014 года, а вот конкуренция выросла с 2 до 3 резюме на вакансию.

Посмотрим на историю других профобластей:

«Айти» и «маркетинг» демонстрируют форму похожую на «продажи», но не такую симметричную. В 2014 году они делаю два витка активности (промежуточное затишье в мае), конкуренция растёт почти непрерывно, не считая небольшого спада в мае-июне 2015. «Начало карьеры» — ещё более искажённая «s» с быстрым ростом конкуренции (с 7 до 10+ резюме на вакансию) и большими «провалами» в январе и мае — во время студенческих сессий.

Посмотрим на динамику рынка в целом (гифка):

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

Присылайте вопросы о визуализации данных на почту: data@datalaboratory.ru. При участии Кирилла Беляева, Романа Бунина и Дамира Мельникова. Спасибо Службе исследований «Headhunter» за предоставленные данные. Подписи на осях скрыты по просьбе заказчика, поведение профсфер на графике соответствует реальному положению дел.

Спрашивает Константин Когут:

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

Смотрите, как визуализировали похожую информацию о заключённых тюрьмы в Гуантанамо дизайнеры «13pt», выигравшие с этой работой престижный конкурс «Малофей»:

Каждый заключённый показан отдельной линией, истории персонажей подписаны прямо на графике рядом с линиями. Думаю, служители науки достойны такого же уважительного обращения :-)

Начните с того, что выделите линии жизни в общей массе:

Такое представление позволяет проследить за судьбой каждого преподавателя, видно общее количество преподавателей за год и как оно получилось: сколько ушло, сколько пришло. Легко показать превращения преподавателя в доцента и доцента в профессора (преподавателей лучше расположить на нижнем этаже графика, профессоров — на верхнем):

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

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

Присылайте вопросы о визуализации данных на почту: data@datalaboratory.ru, ответы публикуются ежемесячно.

Спрашивает Алексей Булгаков из компании «Bicotender»:

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

Ключевые свойства тендера — стоимость и индустрия. Интересно узнать, какое соотношение тендеров по индустриям, как оно меняется со временем, какие индустрии преобладают в разных регионах. Обозначим индустрию цветом и покрасим регионы на карте цветом главной (по объёму закупок) индустрии, а на диаграмме покажем суммарные объёмы РФ в разбивке по индустриям:

При наведении на месяц видим главные индустрии в этом месяце по регионам; при наведении на регион — временное распределение закупок по индустриям в нём:

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

При наведении на тендер показана подробная информация о нём:

На визуализации показаны только электронные аукционы, завершённые с августа 2014 по июль 2015. Видим, что самые «жирные» индустрии — строительство, медицина, финансы. Строительство преобладает в большинстве регионов, его активность предсказуемо падает в зимние месяцы. В январе самый низкий объём завершённых тендеров по всем индустриям. Что касается регионов, лишь некоторые активно используют систему электронных аукционов: это Москва и Московская область, Санкт-Петербург, Нижний Новгород, Самара, Краснодарский и Краясноярский края, с 2015 года к ним присоединилась Волгоградская область. В других регионах электронные аукционы единичные, касаются одной-двух индустрий, их объёмы незначительны. Во многих регионах (показаны белым цветом) они вообще не проводились.

Живой прототип: https://tenders.datalaboratory.ru/

Присылайте вопросы о визуализации данных на почту: data@datalaboratory.ru, ответы публикуются ежемесячно. При участии Дамира Мельникова.

Спрашивает Паша Омелёхин:

Чтобы ответить максимально по делу, я уточнила у Паши, о каких графиках идёт речь.

Кирпичик данных — это один ответ. Проявив его, Паша показал откуда берутся средние значения, как ответы распределены по оценкам и во времени. Отличная работа с микроуровнем!

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

Данные отвечают на вопросы пользователя. Отранжируем вопросы и ответы по важности:

1. «Что происходит сейчас?» — средняя оценка за неделю по каждому критерию и свежие комментарии.
2. «Как изменилась ситуация за последнее время?» — динамика средних оценок и история комментариев.
3. «Что стоит за средними оценками? Насколько они достоверны?» — распределение конкретных ответов.

Исходные графики показываю только динамику (2), пашин вариант даёт доступ к детальным данным (3). Проявим на макроуровне все данные с соответсвующим важности весом — оценку за прошлую неделю крупным числом, динамику ярким графиком, распределение полупрозрачным облаком на фоне:

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

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

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

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

Присылайте вопросы о визуализации данных на почту: data@datalaboratory.ru, ответы публикуются ежемесячно.