В рамках дизайн-челленджа я сделала переверстку инфографики о статистике номинаций на премию «Оскар» — топ актёров, получивших наибольшее число номинаций. Ниже — разбор пяти приёмов, которые использовала при работе над визуализацией и которые легко применить в собственных проектах.
Что показывает инфографика
Инфографика визуализирует рейтинг актёров по количеству номинаций на «Оскар». Центральный элемент — горизонтальные бар-чарты с фотографиями актёров и аннотациями к ключевым закономерностям. Отдельно выделен Леонардо Ди Каприо как персонаж, наиболее ассоциированный с историей премии.
Пять приёмов, которые стоит взять на заметку
- Насыщенность цвета текста vs. элементов. Текст всегда выглядит светлее залитых фигур из-за своей разряженности. Чтобы компенсировать этот эффект, цвет подписей делается на несколько тонов насыщеннее цвета самих квадратиков — так текст визуально воспринимается как равнозначный элемент, а не как блеклая подпись.
- Аннотации как навигация. Текстовые аннотации не просто поясняют данные — они акцентируют внимание на интересных закономерностях и буквально ведут читателя по инфографике в нужном порядке.
- Легенда внутри первого элемента. Вместо того чтобы выносить легенду в отдельный блок, она встроена прямо в первый бар-чарт — на примере Мэрил Стрип. Читатель сразу понимает систему, не отвлекаясь на поиск пояснений.
- Серая обводка как визуальный маркер. Фотографии актёров, которые так и не получили «Оскар», выделены серой обводкой. Это лаконичный способ закодировать важную категорию без дополнительных подписей.
- Отдельный акцент на Леонардо Ди Каприо. Актёр, тесно связанный с историей премии, выделен в отдельный блок — это нарративный приём, создающий драматургию внутри визуализации.
Что сделать на практике
- Проверяйте контрастность текста относительно фона и соседних цветовых элементов — не только по формулам WCAG, но и визуально на реальных размерах.
- Встраивайте легенду в первый или самый показательный элемент графика вместо отдельного блока — это сокращает когнитивную нагрузку.
- Используйте аннотации как сторителлинг: каждая аннотация должна добавлять смысл, а не дублировать то, что видно и без неё.
- Применяйте визуальные маркеры (обводка, штриховка, прозрачность) для кодирования категорий, которые неудобно выносить в отдельную легенду.
- Выделяйте нарративно значимые кейсы в отдельные блоки — это создаёт историю, а не просто таблицу данных.
Вывод
Хорошая инфографика — это не только правильные данные, но и продуманная система навигации: цвет, аннотации, встроенная легенда и нарративные акценты работают вместе, чтобы читатель понял главное с первого взгляда. Большинство этих приёмов переносимы в любой BI-инструмент или инфографический редактор.