Интерактивная визуализация человека. Интерактивная визуализация данных как инструмент управления бизнесом. Определить точное назначение продукта

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

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

Но остановится ли на этом процесс развития технологий визуализации? Конечно, нет. Что нас ждет в будущем? Ответ на этот вопрос можно найти, проследив историю визуализации, ведь не зря говорят: «Без знаний прошлого нет будущего».

Краткий экскурс в историю

Поскольку мы с вами говорим о визуализации, давайте и ее историю представим в наглядном виде – именно так ее изобразил Майкл Фрэндли (Michael Friendly), автор книги Handbook of Data Visualization:

До 17 века – Ранние карты и диаграммы

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

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

1600-1699 – Измерения и теории

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

Именно в этот период появилась система координат, родилась теория верности и демографическая статистика.

Иллюстрацией того времени может послужить работа Кристофера Шайнера (Christopher Scheiner), датированная 1630 годом. Позднее Эдвард Тафти использовал для нее термин «маленькие множества», подразумевая под ним повторение одного элемента много раз для отображения динамики и происходящих изменений.

На этом рисунке запечатлены пятна на солнце, наблюдавшиеся в течение месяца:

1700-1799 – Новые графические формы

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

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

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

1850 – Начало современной графики

К этому времени появились основные виды графиков: круговая, столбиковая, площадная диаграммы. Отправной точкой современной графики считается знаменитая визуализация холеры на улицах Лондона, сделанная Джоном Сноу:

В 1858 году сестра милосердия и общественный деятель Великобритании Флоренс Найтингейл изобрела первую круговую диаграмму — ее она использовала в Крымской войне с целью показать, что намного больше солдат умерло от болезней (синий), чем на поле боя (красный) или по другим причинам (черный):

1900-1950 – Смутные годы

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

1950 – 1975 – Возрождение

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

В это время появляются первые интерактивные визуализации. Примером может служить визуализация Ричарда Бейкера:

В 1973 году американский ученый Герман Чернов использовал изображения лиц для визуализации данных. Лица Чернова - это отображение многомерных данных в виде человеческого лица, его отдельных частей. Ниже — пример оценки юристами 12 судей по Лицам Чернова:

1975 – н.в. – Интерактивная и динамическая визуализация высокого разрешения

Сегодня мы имеем широкий доступ к инструментам анализа и визуализации данных. Ключевыми моментами, которые ознаменовали эпоху интерактивной и динамической визуализации, можно считать возникновение интерактивных систем, возможность взаимодействовать с моделями (в том числе и 3D), увеличение мощности компьютеров наравне с удешевлением технологий.

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

Яркий пример визуализации этой эпохи – визуализация сети Интернет, сделанная Opte Project:

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

Говорить о визуализации данных и не упомянуть – это всё равно, что рассказывать об истории создания персональных компьютеров и ни словом не обмолвиться о Стиве Джобсе. D3 (от англ. Data Driven Documents) – это без преувеличения самая важная и доминирующая на рынке JavaScript библиотека с открытым исходным кодом, которая обычно используется для создания SVG-графиков. SVG (от англ. Scalable Vector Graphics) – это в свою очередь формат векторного изображения, поддерживаемый веб-браузерами, но ранее мало использовавшийся.

Библиотека D3 во многом обязана своей популярностью внезапному интересу к SVG со стороны веб-дизайнеров, что в значительной степени объясняется тем, как выигрышно векторные графики выглядят на экранах с большим разрешением (в частности, на Retina-дисплеях, используемых в устройствах Apple), которые становятся всё более распространёнными.

«Будем честными, если задача состоит в визуализации данных на основе SVG, то для её решения все остальные библиотеки даже рядом не стояли», – говорит Moritz Stefaner , независимый эксперт в области визуализации данных и владелец компании Truth & Beauty . «Есть также немало интересных проектов, созданных на базе D3, как, например, NVD3 , который предоставляет стандартные графические компоненты – готовые к использованию, но кастомизируемые; или, скажем, Crossfilter – просто выдающийся инструмент для фильтрации данных».

Processing.js – это «родственный» проект Processing, который позволяет визуализировать данные, используя веб-стандарты и исключая необходимость в каких-либо плагинах. «Для того, чтобы начать работать с Processing, вам не нужно знать JavaScript, потому что у Processing свой собственный язык программирования», – поясняет эксперт по визуализации данных из Нидерландов Jan Willem Tulp . Как пользователь, вы просто пишете код на языке Processing, вставляете его на свою веб-страницу и спокойно позволяете Processing.js позаботиться обо всём остальном».

«Отрицательный момент ожидает вас, когда вы начнёте работать над более сложными проектами: IDE (от англ. Integrated Development Environment) покажется вам немного ограниченным», – продолжает Jan Willem Tulp.

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

В то время как D3 и Processing предоставляют общие инструменты для различных типов визуализации, Gephi решает более конкретные задачи. Gephi – это бесплатная библиотека с открытым исходным кодом, предназначенная для сетевой визуализации. Но даже в рамках этой узкой специфики Gephi предоставляет море возможностей. Хотите ли вы смоделировать взаимоотношения сотрудников внутри компании или передачи мячей во время футбольного матча, с помощью Gephi вы сможете визуализировать подобные взаимосвязи.

Как и Processing, Gephi очень прост в установке. Сразу после установки следует непосредственно импорт данных, их сортировка, и можно приступать к визуализации. «Получившиеся изображения могут быть экспортированы и вставлены в любой веб-документ, чтобы ваша аудитория могла в дальнейшем использовать их и делиться ими в сетях», – говорит Benjamin Wiederkehr.

Dygraphs

Dygraphs – это быстрая и гибкая в использовании JavaScript библиотека с открытым исходным кодом, предназначенная для построения интерактивных графиков и позволяющая анализировать и интерпретировать очень плотные массивы данных. В отличие от Vega, библиотека Dygraphs предлагает кастомные настройки, но обладает тем же преимуществом работы во всех основных браузерах. Кроме того, Dygraphs изначально интерактивна, а это значит, что некоторые функции (например, zoom, pan или mouseover) присутствуют по умолчанию, в то время как, скажем, функция “pinch-to-zoom” на мобильных устройствах – это уже просто приятный бонус.

С чего начать?

Даже при наличии такой информации мир визуализации данных может показаться новичку тёмным лесом. Так что же советуют эксперты?

«Первое, что я бы посоветовал, это познакомиться с максимальным количеством существующих на сегодня инструментов, чтобы быстро создавать стандартные графы», – говорит Moritz Stefaner. «Особенно на начальном этапе проекта очень важно иметь возможность быстро генерировать много диаграмм с целью изучения объёма, глубины и «текстуры» данных. Лично я использую Tableau и Gephi, но помимо них ещё CartoDB , незаменимый для работы с картами, и совсем недавно появившуюся библиотеку с открытым кодом RAW , отлично подходящую для быстрого создания интересных графов».

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

«Очень важно с самого начала спросить себя, с каким именно форматом данных вам предстоит работать», – говорит Scott Murray. «Задача стоит в визуализации временного отрезка? Может быть это категориальные данные? Ответы на подобные вопросы могут повлиять на ваше решение. Некоторые библиотеки, вроде D3, универсальны и могут работать с различными типами данных. Другие же более специфичны в отношении типов данных, например, Gephi или Sigma.js – инструменты, предназначенные для сетевой визуализации. Если вы знаете с самого начала, с чем вы работаете, вдумчиво выбирайте из существующих библиотек ту, которая лучше всего подойдёт для вашего типа данных».

В чём плюсы онлайн комьюнити?

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

«Начинающим я бы посоветовал для старта библиотеки Processing или D3», – говорит Jan Willem Tulp. «Обе они располагают большой пользовательской базой и солидным числом примеров, на которых можно поучиться».

Онлайн комьюнити в сфере визуализации данных не только даёт ответы на многие вопросы, но и наглядно демонстрирует один из главных парадоксов инфографики. Каждый приходит в отрасль со своим образованием и опытом, поэтому некоторые специалисты в области визуализации данных подходят к задачам с эстетической и художественной точек зрения, в то время как другие концентрируются на статистической составляющей вопроса. Статистики отлично разбираются в больших объёмах данных, но вынуждены изучать основы дизайна. Дизайнеры знают многое о создании эстетически привлекательных изображений, но им предстоит многое узнать о статистических методах.

«В центре всего – соглашение сторон о типе визуализации», – говорит программист-дизайнер

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

• Графики и диаграммы,
• Инфорграфика и схемы,
• Презентация и анализ данных,
• Интерактивный сторителлинг,
• Бизнес аналитика и дашборды,
• Научная и медицинская визуализация,
• Карты и картограммы.

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

Графики и диаграммы

Наверное самый привычный для нас вид визуализации данных. Используется как для презентации данных, так и для анализа. Встретить их можно и на работе, и в журнале и в научном отчете. Обычно знания о существующих типах диаграмм и графиков мы получаем из школы или из стандартного набора в экселе. Однако, мало кто знает, что мир графиков и диаграмм не ограничивается точечным графиком, столбиковой и круговой диаграммой. Существуют порядка 15 общеизвестных типов диаграмм, а всего их более 60, при этом их количество увеличивается с каждым днём - люди придумывают новые типы для визуализации сложных и необычных данных. Подробно типы графиков и диаграмм мы рассмотрим в одной из следующих заметок.

Инфорграфика и схемы

Инфографика стала очень популярна в последние годы, хотя существуют уже давно. Инфографика относиться к журналистике данных, где графики и схемы объясняют какие-либо факты по выбранной теме. Обычно инфографика статична и представляет собой длинную «простыню» с картинками и текстом. Отличительной особенностью инфографики является то, что в ней приводятся уже готовые выводы, то есть читателя проводят за руку по выбранной теме и при этом приправляют это все цифрами и картинками. Часто используется рисованный или мультяшный стиль. Некоторые СМИ выпускают инфографику на ежедневной основе, например АиФ. Бум инфографики вызвал снижение общего уровня её качества. Часто используется не к месту или «для красоты», хотя конечно же есть замечательные и интересные примеры.

Примеры инфографики

Численность Наполеоновской армии во время русской компании, 1869 г.

Численность населения разных стран, 1912 г.

10 заповедей типографики

Взмах крыльев

Вегетарианцы в цифрах

Презентация и анализ данных

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

При анализе данных с помощью визуализации используют так называемое быстрое прототипирование - то есть создание большого количества различных визуальных представлений одних и тех же данных. Делается это для возможности нахождения скрытых, на первый взгляд, взаимосвязей и зависимостей, а также первичной оценки набора данных для возможности применения в дальнейшем более сложных инструментов анализа. Этот подход называется Eploratory data analysis (EDA), что на русский можно перевести как разведочный анализ данных. Основное отличие от презентации данных - визуализация здесь может быть «черновой» и некрасивой, но выполняется быстро и одним человеком или небольшой рабочей группой. Для этого чаще всего используют эксель, R или матлаб

EDA - один из инструментов data mining’a, по его проведению есть даже учебники

Примеры визуализации для EDA

Интерактивный сторителлинг

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

Примеры инетрактивного сторителлинга (переход на сайт при клике на картинку)

Бизнес аналитика и дашборды,

Визуализация активно используется в бизнесе. Принцип «говорите с данными» помогает компаниям зарабатывать больше, а клиентам получать лучший сервис. Для разового анализа обычно используется эксель или R. Однако это не удобно если необходимо следит за какими-то показателями (KPI) на постоянной основе. Для отслеживания рутинных KPI используют дашборды - дисплеи на которых выведены все необходимые показатели в одном месте в виде графиков, диаграмм и таблиц.

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

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

Примеры картограмм (переход на сайт при клике на картинку)

Подводя итоги

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