История одной работы

Алексей Смагин (@BlackPineapple) — о том, как делать ваши графики понятными и красивыми. А в деталях учу этому искусству на курсе «Эстетика в графиках»

визуализацияграфикиВан Гог

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

Для начала дисклеймер. Есть такие идеи, которые практически невозможно передать при помощи простейших видов графиков. Точнее, возможно, но это будет совсем не то. У Кати была цель — рассказать, в каких странах жил Ван Гог, и где проходили самые плодотворные годы его творчества. К такой задаче надо подходить креативно.

Когда на консультации Катя спросила, какой вид графика можно использовать, я сразу придумал такой вариант: отрезком можно показывать время жизни в городе, а площадью нанизанного на него круга — количество работ (картинка 1). Чуть позже я предложил второй вариант — Гант, где высота столбика будет показывать количество работ, а ширина — продолжительность жизни в городе (картинка 2).

Катя попробовала оба варианта, и Гант показался нам более удачным. Хотя первая идея тоже была интересной 🙂

Затем Катя предложила ещё одно косметическое улучшение — связать столбики линиями. Хорошая получилась метафора пути, и в целом картинка стала более связной (картинка 3).

Я попросил Катю перенести города поближе к столбикам, и в первой оформленной версии (картинка 4) график уже зажил.

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

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

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

P.S. Катя в комментах выложила ещё несколько вариантов, которые у неё были до консультации. Тоже интересно посмотреть :)

Диаграмма с кругами и отрезками по оси времени: точки соответствуют городам Ван Гога, площадь кругов кодирует количество работ в каждом месте.
Вариант с кругами: время жизни и количество работ через площадь точек.
Гант‑диаграмма: горизонтальные столбики показывают продолжительность пребывания Ван Гога в городах, высота столбцов кодирует число работ.
Гант‑вариант: ширина = продолжительность, высота = количество работ.
График с соединяющими линиями между столбиками: метафора пути художника, связывающая периоды жизни в разных городах.
Добавление линий связывает столбики и создаёт ощущение пути.
Оформленная версия графика в светлой палитре с подписями городов и временной осью, близкая к финальному визуальному стилю работы.
Первая оформленная версия с городами рядом со столбиками.
Версия графика с использованием цвета для обозначения городов, увеличенным шрифтом и улучшенной читаемостью подписей и оси времени.
Добавление цвета и увеличение размера текста для читаемости.
Финальная композиция: столбики кодируют работы в день, площадь — общее число работ, подписи обозначают города и даты, понятная визуальная иерархия.
Финал: высота = работы в день, площадь = общее число работ.
Альтернативная финальная версия графика с той же логикой кодирования: ясные подписи, связь между периодами и акцент на плодотворные годы.
Ещё один окончательный вариант с усиленным акцентом на продуктивность.