Наши журналы
Опубликовать статью Вход и регистрация
Расширенный поиск
Разделы статьи

ОСОБЕННОСТИ ИНТЕРАКТИВНОЙ ИНФОГРАФИКИ ПО ЭКОЛОГИЧЕСКОЙ ТЕМАТИКЕ

Научная статья
Краснопевцева К.С.
Орлова Е.Ю.
DOI:
https://doi.org/10.23670/IRJ.2021.110.8.109
Выпуск: № 8 (110), 2021
Опубликована:
2021/08/17
PDF

ОСОБЕННОСТИ ИНТЕРАКТИВНОЙ ИНФОГРАФИКИ ПО ЭКОЛОГИЧЕСКОЙ ТЕМАТИКЕ

Научная статья

Краснопевцева К.С. 1, *, Орлова Е.Ю.2

1 ORCID: 0000-0002-4013-3196;

1, 2 Российский государственный университет им. А.Н. Косыгина, Москва, Россия

* Корреспондирующий автор (xenya.kras[at]gmail.com)

Аннотация

Экологические проблемы человечества ставят новые вопросы перед всеми отраслями деятельности, в том числе перед графическим и информационным дизайном. Требуется визуализировать все большие объемы данных в сфере защиты окружающей среды. Статичная инфографика, которая использовалась для этих целей на протяжении длительного времени, сменяется интерактивной инфографикой, обладающей рядом преимуществ и особенностей: интерактивность, драматургическая структура, макет и сторителлинг. Они находят отражение в визуализации экологической информации. Исследуются актуальные примеры интерактивной инфографики, визуализирующей данные о природе и ее проблемах. Делаются выводы относительно отличительных черт экологической интерактивной инфографики (использование карт и картограмм как основного типа отображения информации, внедрение среднего и высокого уровня интерактивности, линейно-нелинейной и нелинейной драматургии, применение особой цветовой гаммы) и ее тенденции (добавление звука, анимации, видео, 3D объектов).

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

ASPECTS OF INTERACTIVE INFOGRAPHICS ON ENVIRONMENTAL ISSUES

Research article

Krasnopevtseva K.S.1, *, Orlova E.Yu.

1 ORCID: 0000-0002-4013-3196;

1, 2 A.N. Kosygin Russian State University, Moscow, Russia

* Corresponding author (xenya.kras[at]gmail.com)

Abstract

Environmental problems of humanity pose new questions to all branches of activity, including graphic and information design. It is necessary to visualize increasingly large amounts of data in the field of environmental protection. Static infographics, which have been used for this purpose for a long time, are being replaced by interactive infographics, which have a number of advantages and features such as interactivity, dramatic structure, layout, and storytelling. They are reflected in the visualization of environmental information. The current examples of interactive infographics that visualize data about nature and its problems are also examined. The article draws conclusions regarding the distinctive features of interactive ecological infographics (the use of maps and cartograms as the main type of information display, the introduction of medium and high levels of interactivity, linear-nonlinear and nonlinear drama, the use of a special color scheme) and its trends (the addition of sound, animation, video, 3D objects).

Keywords: interactive infographics, data visualization, environmental problems, storytelling, dramatic structure.

Начиная с конца прошлого века загрязнение окружающей среды является не просто актуальной темой сегодняшнего дня. Его масштабы разрослись до глобальной проблемы человечества. Среди семнадцати целей устойчивого развития, принятых 25 сентября 2015 года 193 странами-участницами ООН, есть несколько, фокусирующихся на экологии: принятие срочных мер по борьбе с изменением климата и его последствиями, сохранение и рациональное использование океанов, морей и морских ресурсов в интересах устойчивого развития, защита, восстановление экосистем суши и содействие их рациональному использованию, рациональное управление лесами, борьба с опустыниванием, прекращение и обращение вспять процесса деградации земель и прекращение процесса утраты биологического разнообразия [11]. Защита окружающей среды является уже не трендом, а насущной необходимостью, охватывающей все сферы жизни общества и все отрасли деятельности, в том числе и дизайн. Как пишут М.В. Панкина и С.В. Захарова в статье «Экологический дизайн как направление современного дизайна. Определение понятия», экологический подход в проектировании, явившийся откликом на экологические проблемы современности, привел к формированию различных направлений в дизайне (устойчивый, зеленый, экологический), актуализирующих возможности дизайна в сохранении и защите природной среды [4]. Графический и информационный дизайн так же могут вносить свой вклад и помогать достигать цели устойчивого развития.

С каждым днем все больше экологических данных требуется донести до читателя. Однако у современного человека, окруженного информационным шумом, все меньше времени и желания читать длинные тексты. Выражение «Одно изображение заменяет собой тысячу слов» стало своеобразным лозунгом создателей контента. Уже несколько десятилетий для визуализации информации, в том числе экологической, применяют инфографику [1, С. 126–128], [2, С. 173-174], [3, С. 239-242]. Раньше использовали печатную информационную графику в книгах, учебниках, газетах и т.п. С развитием интернета она перетекла на сайты, а затем в социальные сети. Разрастались возможности ее создания, что привело к ее кризису из-за обилия некачественного материала [5]. Новым витком в развитии информационного дизайна стало появление интерактивной инфографики — визуальное представление информации, объединяющее различные элементы, например, изображение, текст, речь, звук и макет в единое целое и предлагает по крайней мере один вариант навигации для управления графикой [8]. Ее коммуникативная функция заключается в информировании, например, описывая или объясняя что-либо, или рассказывая фактическую историю. Она широко используется в том числе и как инструмент визуализации экологической информации, так как обладает рядом преимуществ по сравнению со статичной графикой. Однако интерактивная инфографика — это сравнительно новое явление. Поэтому для более эффективной визуализации сведений, посвящённых проблемам окружающей среды, необходимо его изучать и систематизировать сведения о нем.

Цель настоящего исследования – выявить особенности и отразить тенденции интерактивной инфографики экологической тематики в сети Интернет.

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

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

2) драматургическая структура — внутренние строение интерактивной графики, которое определят маршрут изучения информации, заложенный автором (линейная (строго предопределенный автором путь), линейно-нелинейная (путь обозначен, но возможны те или иные отступления от него) и нелинейная (пользователь сам решает, в каком порядке будет изучать материал));

3) макет и сторителлинг, которые могут включать в себя элементы, недоступные в статичной инфографике: анимация, звук, видео, 3D, кнопки управления и т. п.

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

Интерактивная инфографика «30 species 30 pieces» дизайнера и разработчика Брайана Джеймса посвящена исчезающим видам фауны. Каждый вид собирается из тридцати CSS-полигонов, становясь объемным, и перевоплощается в следующий при переходе к нему (см. рисунок 1) [7]. Как пишет сам автор, его проект — это «праздник генетического разнообразия и попытка напомнить о красоте, которую мы можем потерять в скором времени». Каждый вид, появившись на экране, совершает характерные для него движения, а у пользователя появляется возможность нажать на кнопки и узнать об этом животном (или птице), его угрозе, посмотреть видео о нем, или перейти на посвященный ему сайт и подробнее ознакомиться с информацией. Интерактивность в данном случае среднего уровня, а драматургическая структура линейно-нелинейная, так как зритель двигается в заданном автором направлении, но по ходу движения может изучать сведения в удобном для него порядке. В макет интерфейса проекта включены музыка и звуки, анимация объектов. Дополняет сторителлинг и усиливает эмоциональное воздействие на зрителя симуляция взрыва разлетающихся полигонов при нажатии на кнопку «УГРОЗА», а также контрастная цветовая гамма: пастельные цвета для исчезающих видов и черно-белое с красными участками окно с информацией о них.

26-08-2021 13-54-17

Рис. 1 – Интерактивная инфографика «30 species 30 pieces»

 

Другая болезненная экологическая проблема современности — загрязнение Мирового океана пластиком нашла свое визуальное воплощение в проекте «Sailing seas of plastic», созданном новозеландским агентством Dumpark в 2014 году (см. рисунок 2) [10]. На этой интерактивной карте показана предполагаемая концентрация плавающего пластикового мусора в Мировом океане. Плотность рассчитывается с помощью числовой модели, откалиброванной по серии полевых данных, собранных в пяти основных океанах и Средиземном море. Кроме того, эта интерактивная инфографика показывает различные экспедиции парусных судов, участвовавших в сборе данных с 2007 по 2013 год, и позволяет исследовать все концентрации пластика, измеренные с помощью буксиров надводной сети и визуальных наблюдений. На главном экране открывается 2D карта мира с изображенными на ней скоплениями пластикового мусора в океане. Пользователю доступно зумирование, а также возможность нажатия на кнопки, в результате которого появляется инфографика с числовой информацией. Так в таблице с круговыми диаграммами можно изучить, в каком океане больше всего найдено пластика по весу или по количеству частиц. Помимо этого, доступно исследование результатов экспедиций, путь которых отражен на карте, а полученные данные — в тепловой таблице. В этом проекте интерактивность среднего уровня, нелинейная драматургия, а сторителлинг дополняется необычной цветовой гаммой: серая рельефная суша и темно-серые воды, на которых практически светятся белые кусочки пластика.

26-08-2021 13-54-36

Рис. 2 – Интерактивная инфографика «Sailing seas of plastic»

 

Другой значимый пример визуализации экологической информации — это проект российского отделения Гринписа «Sos! Воздух», который так же представляет собой интерактивную карту, на этот раз части территории России, на которой отмечены места жалоб пользователей на загрязнение воздуха, пункты контроля за воздухом, а также, нажав на значки, можно увидеть участки выбросов в атмосферу, которые осуществляют предприятия, или выхлопы автотранспорта (см. рисунок 3) [6]. Помимо прочего, доступна опция «Sos! Воздух. Сообщить о проблеме», что делает этот ресурс актуализирующимся в реальном времени. Средний уровень интерактивности и линейно-нелинейная структура концентрируют все внимание зрителя на конкретной проблеме и позволяют своевременно определять, загрязнен ли воздух в их районе и предупреждать других пользователей в случае опасности. Как и в прошлом примере, цветовая гамма карты выполнена в темных тонах с яркими пятнами загрязнений.

26-08-2021 13-56-46

Рис. 3 – Интерактивная инфографика «Sos! Воздух»

 

Необычными примером интерактивной инфографики, встроенной в онлайн-игру, является проект Управления ООН по снижению риска бедствий, посвященный природным катастрофам (см. рисунок 4) [12]. 3D карта, выполненная в стиле флэт-иллюстраций, заполнена многочисленными объектами, о которых можно получить информацию, присутствуют звуки и анимация. Уровень интерактивности здесь высокий, а драматургическая структура нелинейная, поселяющая выбирать разные сценарии изучения информации.

26-08-2021 13-57-08

Рис. 4 – Интерактивная инфографика «Play and learn to stop disasters!»

 

Наконец, не только общественные организации и заботящиеся об окружающей среде индивиды создают экологическую интерактивную инфографику. Тенденция вести дружелюбный к природе бизнес толкает предприятия на внедрение у себя на сайтах такой информации. Примером может служить крупная логистическая компания Brambles, которая в виде интерактивной инфографики (круговая диаграмма с иллюстрациями) рассказывает о своих экологических целях, стратегии, результатах (см. рисунок 5) [9]. Интерактивность этого проекта имеет средний уровень, линейно-нелинейную драматургию, анимацию.

26-08-2021 13-59-12

Рис. 5 – Интерактивная инфографика «Brambles Sustainability Framework»

 

Ввиду своей колоссальной важности для общества экологическая информация, особенно затрагивающая экологические проблемы, должна быть представлена наиболее эффективным образом. Зачастую, она нацелена не просто на донесение сведений до зрителя, но и на то, чтобы пробудить в нем сопереживание, а иногда и желание действовать. Создатели качественного «эмоционального» инфографического контента используют определённые приемы, которые помогают достигнуть основных целей. На основании изученных примеров можно выделить ряд особенностей и тенденций, характерных для экологической интерактивной инфографики.

  1. Экологическая информация чаще всего представлена на картах или картограммах, так как, как правило, с помощью них проще отразить закономерности и масштабы проблем. Однако они могут дополнятся графиками и таблицами, иллюстрациями.
  2. Интерактивность экологической инфографики может варьироваться от низкоуровневой до высокоуровневой, но, следует заметить, что средний и высокий уровень интерактивности имеют более высокий потенциал вовлечения пользователя в контент, что демонстрируется представленными выше примерами.
  3. Драматургическая структура в основном линейно-нелинейная или нелинейная и обуславливается сложностью и широтой информации.
  4. Цветовая гамма, как элемент сторителлинга, служит для усиления эмоционального воздействия на зрителя. Отмечается тенденция ухода от традиционных для подобной тематики цветов, в сторону более драматичных и контрастных.
  5. Как и в целом для интерактивной инфографики, для экологической существует тенденция внедрения в ее макет анимации, звуков, 3D объектов, иллюстраций и видео, помогающих захватывать и удерживать внимание зрителя.
Конфликт интересов Не указан. Conflict of Interest None declared.

Список литературы / References

  1. Балакирева С.В. Использование современной информационной технологии инфографики в изучении экологии / С.В. Балакирева, Д.Р. Булатова // Экологические проблемы нефтедобычи: материалы VII Международной конф. с элементами научной школы для молодежи – Уфа: Изд-во «Нефтегазовое дело», 2018. — С. 126–128.
  2. Балакирева С.В. Использование инфографики на предмете «Промышленная экология» / С.В. Балакирева, М.И. Маллябаева // Интеграция науки и высшего образования в области био- и органической химии и биотехнологии: материалы XI Всероссийской научной интернет-конференции / ред. кол.: Р.А. Исмаков и др. – Уфа: Издательство УГНТУ, 2017. — С. 173–174.
  3. Кузнецова Е.Ю. Геоинфографика как способ визуализации в экологическом образовании / Е.Ю. Кузнецова // Природа и человек в пространстве культуры: материалы Всероссийской научно-практической конференции с международным участием, посвящённой Году экологии в РФ (кафедра этики, культурологии и связей с общественностью факультета философии и социологии БашГУ (г. Уфа, 27 апреля 2017 г.). Ч. 1 / отв. ред. З.Я. Рахматуллина. — Уфа: РИЦ БашГУ, 2017. ― С. 239–242.
  4. Панкина М.В. Экологический дизайн как направление современного дизайна. Определение понятия / М.В. Панкина, С.В. Захарова // Современные проблемы науки и образования. – 2013. – № 4; [Электронный ресурс] URL: http://www.science-education.ru/110-9670 (дата обращения: 21.03.2021).
  5. Симакова С. И. Инфографика: прошлое, настоящее, будущее / С. И. Симакова, В. В. Федотовский // Знак: проблемное поле медиаобразования. 2016. №3 (20). [Электронный ресурс] URL: https://clck.ru/WpBHv (дата обращения: 24.03.2021).
  6. Sos! Воздух // Greenpeace. — 2021. — [Электронный ресурс] URL: https://clck.ru/WpBJR (дата обращения: 29.03.2021).
  7. James B. In pieces: 30 species 30 pieces / B. James // Species in pieces. — 2015. — [Electronic resource] URL: http://www.species-in-pieces.com/# (accessed: 26.03.2021).
  8. Black A. Information Design: research and practice / A. Black, P. Luna, O. Lund et al. ― New York: Routledge, 2017. ― 767 p.
  9. Brambles Sustainability Framework // Brambles. — 2020. — [Electronic resource] URL: https://www.brambles.com/interactive-infographic (accessed: 28.03.2021).
  10. How much plastic is floating in our oceans? // Sailing seas of plastic. — 2014. — [Electronic resource] URL: https://app.dumpark.com/seas-of-plastic-2/# (accessed: 27.03.2021).
  11. Open Working Group proposal for Sustainable Development Goals // United Nations Department of Economic and Social Affairs. — 2015. — [Electronic resource] URL: https://web.archive.org/web/20151006035004/https://sustainabledevelopment.un.org/sdgsproposal/ (accessed: 23.03.2021).
  12. Play and learn to stop disasters! // UN Office for Disaster Risk Reduction. — 2018. — [Electronic resource] URL: https://www.stopdisastersgame.org/#1540395527198-8935bc1b-b063 (accessed: 25.03.2021).

Список литературы на английском языке / References in English

  1. Balakireva S.V. Ispol'zovanie sovremennoj informacionnoj tehnologii infografiki v izuchenii jekologii [The use of modern information technology infographics in the study of ecology] / S.V. Balakireva, D.R. Bulatova // in Jekologicheskie problemy neftedobychi: materialy VII Mezhdunarodnoj konf. s jelementami nauchnoj shkoly dlja molodezhi [Environmental problems of oil production: materials of VII International conference with elements of a scientific school for youth]. Ufa: Publishing house «Neftegazovoe delo», 2018. pp. 126–128. [in Russian]
  2. Balakireva S.V. Ispol'zovanie infografiki na predmete «Promyshlennaja jekologija» [Use of infographics on the subject "Industrial ecology"] / S.V. Balakireva, M.I. Malljabaeva // in Integracija nauki i vysshego obrazovanija v oblasti bio- i organicheskoj himii i biotehnologii: materialy XI Vserossijskoj nauchnoj internet-konferencii [Integration of science and higher education in the field of bio- and organic chemistry and biotechnology: materials of the XI All-Russian scientific Internet conference]. Redkol.: R.A. Ismakov et al. Ufa: UGNTU Publishing house, 2017. pp. 173–174. [in Russian]
  3. Kuznecova E.Ju. Geoinfografika kak sposob vizualizacii v jekologicheskom obrazovanii [Geoinfographics as a way of visualization in environmental education] / E.Ju. Kuznecova // in Priroda i chelovek v prostranstve kul'tury: materialy Vserossijskoj nauchno-prakticheskoj konferencii s mezhdunarodnym uchastiem, posvjashhjonnoj Godu jekologii v RF (kafedra jetiki, kul'turologii i svjazej s obshhestvennost'ju fakul'teta filosofii i sociologii BashGU [Nature and Man in the Space of Culture: Materials of the All-Russian Scientific and Practical Conference with International Participation, dedicated to the Year of Ecology in the Russian Federation (Department of Ethics, Culturology and Public Relations, Faculty of Philosophy and Sociology, Bashkir State University] (g. Ufa, 27 aprelja 2017 g.). Pt. 1 / ed. Z.Ja. Rahmatullina. Ufa: RIC BashGU, 2017. pp. 239–242. [in Russian]
  4. Pankina M.V. Ekologicheskij dizajn kak napravlenie sovremennogo dizajna. Opredelenie ponyatiya [Ecological design as a direction of modern design. Definition of the concept] / M.V. Pankina, S.V. Zaharova // Sovremennye problemy nauki i obrazovaniya [Modern problems of science and education]. – 2013. – № 4. [Electronic resource] URL: http://www.science-education.ru/110-9670 (accessed: 21.03.2021). [in Russian]
  5. Simakova S. I. Infografika: proshloe, nastoyashchee, budushchee [Infographics: past, present, future] / S. I. Simakova, V. V. Fedotovskij // Znak: problemnoe pole mediaobrazovaniya [Sign: problematic field of media education]. 2016. №3 (20). [Electronic resource] URL: https://clck.ru/WpBHv (accessed: 24.03.2021). [in Russian]
  6. Sos! Air // Greenpeace. — 2021. — [Electronic resource] URL: https://clck.ru/WpBJR (accessed: 29.03.2021).
  7. James B. In pieces: 30 species 30 pieces / B. James // Species in pieces. — 2015. — [Electronic resource] URL: http://www.species-in-pieces.com/# (accessed: 26.03.2021).
  8. Black A. Information Design: research and practice / A. Black, P. Luna, O. Lund et al. ― New York: Routledge, 2017. ― 767 p.
  9. Brambles Sustainability Framework // Brambles. — 2020. — [Electronic resource] URL: https://www.brambles.com/interactive-infographic (accessed: 28.03.2021).
  10. How much plastic is floating in our oceans? // Sailing seas of plastic. — 2014. — [Electronic resource] URL: https://app.dumpark.com/seas-of-plastic-2/# (accessed: 27.03.2021).
  11. Open Working Group proposal for Sustainable Development Goals // United Nations Department of Economic and Social Affairs. — 2015. — [Electronic resource] URL: https://web.archive.org/web/20151006035004/https://sustainabledevelopment.un.org/sdgsproposal/ (accessed: 23.03.2021).
  12. Play and learn to stop disasters! // UN Office for Disaster Risk Reduction. — 2018. — [Electronic resource] URL: https://www.stopdisastersgame.org/#1540395527198-8935bc1b-b063 (accessed: 25.03.2021).