Интерактивный отчет — структурированное резюме достижений компании. Читатель изучает информацию, перемещаясь между разными блоками результатов;

Рассказ об инфраструктуре компании — последовательный рассказ о подразделениях и филиалах компании. Читатель узнает, какой вклад вносит каждый объект в улучшение экологической обстановки; 

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

Интерактивная карта

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

Карточки с разными форматами данных

‍
У карточки каждого объекта есть несколько страниц, которые в разных форматах рассказывают о его работе. Внутри карточек можно сочетать текст, иллюстрации, карты и графики, чтобы разнообразить визуальное наполнение проекта и дать читателю больше информации.

‍

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

‍

Синхронизация текста и визуального ряда

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

Интерактивные тесты

‍

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

‍

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

Визуальное кодирование

‍

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

‍

Анимация ключевых процессов

‍

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

‍

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

Смена направления скролла

‍

Горизонтальный скролл сменяется вертикальным, это делает изучение страницы более динамичным.

‍

Наличие героя

‍

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

‍

Подробные иллюстрации

‍

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

‍