Инструменты для создания инфографики

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

В частности, я спрашиваю:

• Какие комбинации инструментов используются (например, один инструмент для создания графиков, другой для объединения графиков и текста в конечную инфографику)?
• Являются ли какие-либо инструменты векторной графики (например, Illustrator) более или менее подходящими для этой задачи, чем другие?
• Существуют ли онлайн-инструменты, которые полезны в процессе сборки?

(В качестве примера того, что мне интересно делать [но в гораздо более скромном масштабе], http://xkcd.com/980/ )

Разработка инфографики - большая часть того, что я делаю. Вот грубая разбивка того, что я использую.

• Вероятно, 95% работы над инфографикой я делаю в Illustrator. Вы захотите сохранить как можно больше в векторном формате, потому что точное масштабирование, выравнивание, группировка, настройка и изменение очень важны. Если это хорошая презентация полезной информации, то могут потребоваться разные версии: интернет, печать, постер, интерактивные, небольшие изображения для социальных сетей, миниатюры ... и, возможно, даже обновленная версия с данными следующего года. Если вы сохраните гибкость, вы поблагодарите себя позже. Несколько специфических возможностей Illustrator:

  • Его инструменты диаграмм, которые являются ржавыми и разочаровывающими, но точными и заслуживающими использования (несколько советов: не забывайте использовать sи rмасштабировать и поворачивать, обычные методы не работают, а когда вам нужно разбить и разгруппировать диаграммы, всегда держите сгруппированные копировать) и обойти обходные пути, необходимые в Corel Draw . Тем не менее, я понимаю, что у Inkscape есть некоторые плагины, и они улучшаются в этом отношении, в то время как Adobe игнорирует их откровенно устаревшие графические инструменты . Как бы мне ни нравился Illustrator, я бы сразу бросил вызов, если бы у конкурента были хорошие, современные, надежные инструменты построения графиков. Не поддавайтесь искушению копировать, разгруппировать и редактировать диаграммы из Excel - это работает, они вставляются как векторы, но где-то вдоль линии они слегка искажаются и теряют точность.
  • Его функции для применения эффектов к точно нарисованным фигурам регулируемым образом, например, к художественным кистям, шаблонным кистям и эффектам преобразования. Другие векторные программы имеют подобные функции, но не в той же степени. Все, что делает элементы многократно используемыми, настраиваемыми и реконфигурируемыми, помогает.
  • Есть множество сценариев, когда вам нужно делать что-то точным численным способом. Когда вам нужно сделать что-то необычное и точное, часто есть сценарий для этого. Кроме того, палитра Align великолепна и имеет неочевидные удобные приемы, такие как точное наложение вещей .

• Я редко использую InDesign, если изображение не является частью многостраничного документа (хотя некоторые люди используют его для всей текстовой стороны рисунка, размещая каждый элемент из Illustrator). Два исключения, где я использую это:

  • Все, что построено на табличном формате (даже в этом случае, рекомендуется хранить полностью графические элементы в виде файлов иллюстраторов и размещать их по мере необходимости - особенно для всего, что настраивается на основе данных, таких как спарклайны) - InDesign отлично подходит для размещения данных, но ничего не может сделать с этим)
  • Если это очень много текста, то больше похоже на макет журнала с различной графикой, чем на рисунок с фрагментами текста

• Photoshop иногда очень удобен для случаев, когда использование растровой графики неизбежно, а Fireworks может быть полезен для подготовки сложных вещей для Интернета или для набора вариантов с такой же базовой структурой. Я использую оба довольно редко для инфографики, хотя есть некоторые люди, которые разрабатывают одноразовую простую инфографику для сети, главным образом используя Photoshop или Fireworks.

• Если вам вообще интересна интерактивная инфографика, и если вы или коллега знаете какой-либо javascript, другое преимущество Illustrator (также справедливо для Inkscape и CorelDraw) заключается в том, что он может экспортировать SVG, который можно использовать в качестве интерактивных векторных элементов в браузере. ,

  • Если вы хотите пойти по этому пути, посмотрите Raphael и gRaphael, которые могут использовать SVG и работать над всем, от IE6 до iPad.
  • Стоит знать о D3 , который также является SVG (проще в использовании, но не работает в IE <8) и часто используется графическим отделом New York Times ,
  • Processing и Processing.js ( HTML5 canvas ) также довольно популярны и используются различными громкими именами в интерактивной графике данных, такими как Jer Thorp и Ben Fry .

Люди иногда используют более простые программы, такие как omnigraffle, для простых диаграмм, и идея инструментов создания инфографики с низким барьером для входа иногда всплывает, но те, которые я видел, были либо просто замаскированной заранее подготовленной инфографикой (например, визуально создать) или до смешного мелко (например, просто) .

Редактировать--

В настоящее время есть пара инструментов с низким барьером для входа, которые не на 100% отстой и которые добавляют что-то, что стоит упомянуть в стандартном инфографическом формате ( Vennage и infogr.am ). Они на ранних стадиях и немного сыры, и, поскольку они, по сути, являются игрушечными приложениями, они вряд ли когда-нибудь будут полезны для дизайнеров, за исключением тех, кто избегает ошеломляющей тривиальной работы («Текст и пара диаграмм? очень просто, вы можете сделать это сами, вот как ... ") - но есть кое-что, что стоит отметить: они экспортируются как HTML и SVG (infogr.am использует Raphael, Venngage использует HTML, CSS и D3).

Почему это важно? Потому что, если вы разрабатываете инфографику для публикации на веб-страницах, и если вы просто нажимаете png или gif и говорите, что работа выполнена без использования таких методов, чтобы выводить текст как фактический, реальный, живой, семантический текст в разметке веб-страницы, это будет означать, что сырые автоматизированные игрушки, подобные этим сайтам, будут производить продукцию, которая будет иметь преимущество перед вашей работой ... Я всегда использую Raphael для подобных вещей, потому что это единственное, что работает в старых IE и iOS.

Редактировать 2 ---

Влиятельный информационный дизайнер / пионер журналистики данных Альберто Каир недавно написал в блоге об инструментах торговли и опубликовал несколько видеоуроков по инфографике в Illustrator, предназначенных для начинающих (я не пробовал их, поэтому не могу за них поручиться). В популярном блоге dataviz Flowing Data также периодически появляются учебники, которые иногда представляют собой код, иногда статистику, иногда дизайн . Как правило, они предназначены для статистиков, стремящихся улучшить свои навыки проектирования и визуализации, чем наоборот, но могут быть полезны.

WebCode - это отличное и простое в использовании приложение для рисования векторов, которое мгновенно генерирует код JavaScript + Canvas, SVG или CSS + HTML. Он специально предназначен для веб-инфографики.

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

Я согласен с Лорен - иллюстратор для диаграмм. И можно использовать Illustrator для всего произведения. Однако я бы предпочел использовать Indesign для большого количества табличных данных, а не просто для нескольких страниц. Indesign обрабатывает данные таблиц намного проще, чем Illustrator.

На самом деле, большинство частей не создаются с использованием одного программного обеспечения. Диаграммы и графики, сделанные в Illustrator, фотографии или иллюстрации, возможно, завершены с использованием Photoshop. Затем все это в сочетании с таблицами в Indesign, так как Indesign имеет лучшие инструменты для работы с шрифтами.

Но в этом случае можно закончить целую часть в Illustrator или Photoshop.

«Инфографика» на самом деле не является какой-то конкретной технологией или даже эстетической. На самом деле это просто визуальное представление данных. Используйте любые инструменты, которые имеют смысл для вас. Для векторных иллюстраций Adobe Illustrator подходит. Inkscape - отличный вариант. Corel Draw может работать. Есть несколько вариантов.

К отличным ответам, которые уже даны, я просто хочу добавить пару ресурсов, которые немного расширяют границы (в любом случае, мой конверт) в том, что вы можете сделать графически с данными. (1) Книга Натана Яу «Визуализируйте это» (или веб-сайт текущий сайт), в которой, если я правильно помню, упоминается набор передовых инструментов для создания инфографики, и (2) выступление Джера Торпа на TED «Делая данные более человечными» http: // www.ted.com/talks/jer_thorp_make_data_more_human.html Наслаждайтесь временем, когда у вас есть несколько дополнительных минут!

Я использую Microsoft Word для создания инфографики с использованием макета публикации, инструментов форм, текстовых полей и руководств. Мне удалось очень просто составить диаграммы, подобные этим, и я хотел бы дать пошаговые видеоинструкции о том, как другие, у которых нет доступа к инструментам Adobe CS5, могут создавать информационную графическую библиотеку в MS Word. https://gumroad.com/l/MDDPA