Какую пользу приносит инфографика

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

Что такое инфографика

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

Программа обучения: "Инфографика: искусство презентации данных"

На примере ниже - инфографика доктора Джона Сноу. В 1854 году он искал причину болезни и гибели людей. Отметив на карте города все колодцы крестиками и сопоставив их с домами, где жили погибшие, он понял, что причина - загрязненная вода. Так он спас миллионы людей.

Карта Джона Сноу

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

Что нужно для создания инфографики

Визуализация данных в интерфейсах

Чтобы научиться делать такие макеты, нужно действовать по схеме:

Универсальная схема создания дизайн-макета, применимая и к инфографике

Что нужно для эффективной инфографики:

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

Программа обучения: "Продуктовый дизайнер"

Как правильно визуализировать данные

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

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

Как видно на графике, в Белоруссии и России самый низкий пенсионный возраст, но если посмотреть на цифры - "58" в Казахстане почти в два раза выше, чем "55" и "60" в Белоруссии

Если убрать искажение и добавить к сравнению данные о других странах, график не меняется:

Кажется, что пенсионный возраст в Японии в восемь раз больше, чем в Белоруссии

Если привести график к единой оси, окажется, разница не такая большая:

Данные не менялись, столбики графика почти сравнялись

Сравним объективный показатель - статистические данные о средней продолжительности жизни на пенсии:

Картина другая: показатель средней продолжительности жизни на пенсии у женщин в России близок к Польше и Германии

Если не знать, как визуализировать данные, можно привести пользователя к неправильному выводу.

Какую пользу приносит инфографика

1. Помогает верно и в правильной последовательности доносить информацию

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

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

Дорожный знак с визуализацией означает крутой поворот через 500 метров. Понятен даже иностранцам:

2. Социальная польза - то, чем можно поделиться

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

Пример инфографики с сайта adme.ru

3. Помогает донести эмоции и переживания

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

Открыть инфографику в полном размере

Согласно опросам, 44% британцев считают, что в трагедии погибло меньше 5 000 жителей Ирака - это в 200 раз меньше, чем на самом деле. На инфографике заблуждение выделили красным.

4. Решает бизнес-задачи

Инструкция по сборке мебели Икеа

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

Для сравнения, пример инструкции по сборке мебели российского производителя:

Здесь не требуется локализация на 40 языков и стоят другие бизнес-задачи, но эта инструкция гораздо сложнее.

5. Помогает быстрее принимать решения

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

Сколько весит мозг и сколько потребляет энергии: 3% от массы тела и 35% от всей энергии

У читателей есть ограниченный ресурс - "мыслетопливо". Задача дизайнеров - грамотно визуализировать информацию, чтобы не тратить "мыслетопливо".

Инфографика подталкивает к действию без решения сложных задач.

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

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

Инфографика не иллюстрирует реальность, а искажает её для упрощения восприятия.

Книги для создания сильной инфографики

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

Читать ещё: "Как сделать инфографику для статьи: 3 простых способа"

Визуализация данных:

• Говорим на языке диаграмм, Джин Желязны
• Визуальное мышление, Дэн Роэм
• Визуальные заметки, Майк Роуди

Текст и типографика:

• Пиши, сокращай, Максим Ильяхов
• Новая типографика, Ян Чихольд
• Живая типографика, Александра Королькова
• Типографика и верстка, Артем Горбунов

Психология принятия решений:

• Ловушки мышления, Чип Хиз
• Джедайские техники, Максим Дорофеев

Мнение автора и редакции может не совпадать. Хотите написать колонку для "Нетологии"? Читайте наши условия публикации. Чтобы быть в курсе всех новостей и читать новые статьи, присоединяйтесь к Телеграм-каналу Нетологии.