CC BY
30УДК 371
ИНФОГРАФИКА — ВОЗМОЖНОСТИ социальных сервисов в решении психолого-педагогических задач
Андрей Валентинович Диков,
доцент кафедры «Информатика и методика обучения информатике и математике» Педагогического института им. В.Г. Белинского Пензенского государственного университета, кандидат педагогических наук, e-mail: an171@rambler.ru
Если проанализировать методику изложения учебного материла в образовании, то даже без специального исследования можно констатировать превалирующую роль вербального и текстового видов. Несмотря на информатизацию и компьютеризацию сферы образования, доля невербального всё ещё остаётся недостаточной для эффективного развития правого полушария. Правое полушарие, создающее специфический пространственно-образный контекст, имеет решающее значение для творчества. Левое полушарие в большей степени ориентировано на прогнозирование будущих состояний, а правое — на взаимодействие с опытом и с актуально протекающими событиями. В левом полушарии сконцентрированы механизмы абстрактного, а в правом — конкретного образного мышления.
• инфографика • социальные медиа-сети • социальные медиа-сервисы
В процессе индивидуального развития выраженность межполушарной асим метрии меняется. Научные исследования свидетельствуют о том, что межполушарная асимметрия вносит существенный вклад в проявление высокого интеллекта человека1. Поэтому чрезвычайно важно развитие не только левого, но и правого полушария. Для этого можно с успехом использовать в учебном процессе подходящие социальные медиа-сервисы информационной графики.
Наиболее распространённое определение инфографики описывает её как
1 Диков А.В. Онлайн безопасность в сетях стори-теллинга. Школьные технологии. М.: Народное образование. — 2018. — № 6. — С. 51-58.
визуальное представление текстовой информации и числовых данных. Объединяя в одно целое текст, изображения, числовые диаграммы, схемы и в последнее время видео, инфографика — эффективный инструмент для представления данных и объяснения сложных проблем, который может быстро привести к лучшему пониманию учебного материала.
По словам Хайме Серра, одного из самых влиятельных дизайнеров инфогра-фики в мире за последние два десятилетия инфографика — это форма общения, использующая визуальный и письменный язык. Оба языка дополняют друг друга, являются частью целого и поэтому не могут быть поняты в отдельности.
Инфографика обладает способностью представлять сложные данные в краткой и наглядной форме, она эффективно раскрывает большую тему, делая информацию легко усваиваемой, обучающей и интересной.
Хорошая инфографика должна быть точно сфокусирована на целевую аудиторию и основную идею. Важный элемент инфографи-ки — заголовок. Исследователи из Массачу-сетского технологического института (США) провели эксперимент, чтобы определить, как люди обрабатывают инфографическую информацию. Они обнаружили, что хорошие заго-
Рис. 1. Примеры инфографики
ловки — ключ к удержанию аудитории. Они привлекают зрителя или читателя, вводят в тему и заставляют узнать больше.
В отличие от отдельных диаграмм и графиков инфографика фокусируется на потоке из множества визуальных элементов.
На рисунке показаны примеры инфографики, размещённые на веб-странице ЬИрв: //infogram.com/page/infographic (рис. 1).
Облака слов — один из способов графического представления текстовой информации. О сервисах, поддерживающих создание и обмен облаками слов, написано в статье «Конструируем графическое облако из учебного материала»2.
Интерактивная инфографика [ЬМ:рв://тЬ-gram.com/] — социальная сеть для создания и хранения числовых диаграмм, географических карт и инфографики. В отличие от диаграмм, созданных в электронных таблицах, инфографика обладает свойством графического динамизма и интерактивности. Если подвести курсор мыши к какой-либо части диаграммы, то она начнёт реагировать.
Сервис поддерживает следующие типы диаграмм: столбиковая диаграмма, круговая диаграмма, график, диаграмма с областями, точечная, пузырьковая, табличная (рис. 2).
Среди необычных типов диаграмм присутствуют графическая, облако слов, карта дерева и измерительный прибор.
Так, с помощью диаграммы «измерительный прибор» удобно продемонстрировать соотношение водных ресурсов и суши у земной поверхности, а также суммарный процент пустынь (рис. 3).
2 Диков А.В. Конструируем графическое облако из учебного материала // Школьные технологии. —
2018. — № 2. — С. 75-82.
mttmmt mttmmt ttttttt mttmmt mttmmt
._ s S.Mt. Zion JZ
X°The xx Hot chip^
.i The Life s
S^ Casiotone for the Painfully Alone
Microphones
Boards of Canada
Рис. 2. Типы диаграмм сервиса Infogram
После регистрации на сайте появится графическое меню, где можно выбрать либо создание нового документа инфографики, либо создание нового графического отчёта или слайда, либо создание графического поста для Facebook и другие типы инфографики. Также можно просмотривать и редактировать созданные проекты.
Для создания диаграммы на инфографике (или другом проекте) необходимо выбрать вариант «Add chart». Пиктограмма «Экран»
отвечает за предварительный просмотр документа в браузере вместе с динамическими эффектами. Выход из предварительного просмотра производится по клавише Esc. Двойной щелчок на диаграмме в автоматически созданном документе открывает справа табличную область с числовыми и текстовыми данными, соответствующими диаграмме. В этой области можно изменить текущие данные на свои (рис. 4).
Рис. 3. Диаграмма «Измерительный прибор»
Рис. 4. Область данных диаграммы
Как только диаграмма создана, она автоматически вместе с документом помещается в библиотеку проектов пользователя. В библиотеке хранятся как окончательно сделанные работы, так и находящиеся в стадии разработки. Все работы опубликованы (кнопка «Public») в Интернете как вебстраницы, поэтому доступна опция «Embed», то есть внедрение документа в виде виджета на свой сайт, блог, дистанционный курс или в презентацию (PowerPoint 2010). Для создания личных проектов необходимо перейти на платный аккаунт.
В приведённом примере видно, что документ опубликован как веб-страница по адресу https: //infogram.com/--
1898193531189/./.
Мы рассмотрели создание простой диаграммы. Если выбрать первый пункт — создание инфографики, то в документ, содержащий диаграмму, можно добавлять дополнительную информацию:
• диаграмму;
• карту;
• текст;
• геометрическую фигуру;
• рисунок из файла;
• видео с YouTube или Vimeo;
• презентацию с SlideShare или Flickr;
• внешнюю гиперссылку или анимирован-ную картинку с сервиса Gify.
Каждое добавление появляется в виде отдельного блока, который можно перемещать по документу или удалить.
В Интернете функционирует бесплатный сервис Draw.io [https://www.draw.io/], в котором можно быстро строить диаграммы по шаблону, но не числовые, а так называемые организационные. Организационная диаграмма — это смесь графического и текстового представления информации. В результате такого смешения получается компактное и содержательное информационное произведение (рис. 5).
Кроме органограмм в draw.io можно строить блок-схемы, технологические диаграммы, UML, ER и сетевые диаграммы. Сервис используется для создания дерева решений, пирамиды или матричной структуры, иллюстрации шагов в процессе или отображения событий на временной шкале (рис. 6).
Сервис не содержит публичной библиотеки диаграмм, но позволяет организовать совместную разработку диаграммы, публичный просмотр с комментариями, хранение созданных документов в известных облачных хранилищах типа Google Drive, экспортирование диаграммы в популярные графические форматы (png, jpeg).
Создавать информационную графику из менее структурированной текстовой информации позволяет социальный медиа-сервис easelly [https://www.easel.ly]. Сервис содержит в библиотеке сотни профессионально разработанных инфографичес-ких шаблонов, часть из которых бесплатная. Шаблоны можно настроить с помощью значков, диаграмм, иллюстраций и изображений их библиотеки сервиса.
Рис. 5. Шаблон организационной диаграммы в сервисе draw.io
Редактор методом drag-and-drop позволяет менять изображения и текст, изменять цвета и шрифты, загружать собственные изображения и иллюстрации и многое другое. Пример созданной инфографики в этом сервисе можно посмотреть в приложении.
Сервис позволяет загружать инфографику в любом основном формате, делиться ею,
вставлять на веб-страницу и даже пригласить другого члена команды отредактировать её совместно в easelly.
В рунете много лет функционирует сайт «5ш^» (от англ. 5 копеек) [http://5coins.ru/]. Этот ресурс посвя-щён инфографике по-русски. Команда энтузиастов решила внести лепту, в дело
Рис. 6. Виды диаграмм сервиса draw.io
популяризации этого интересного направления визуализации данных. На 5coins можно найти инфографику российских авторов, а также адаптированную версию инфографи-ки со всего мира.
Оригинален сервис PicLits [http://www. piclits.com/] — сервис для создания простой инфографики как сочетание текста и картинки. Текст должен поместиться на одном изображении (рис. 7). Сервис позволяет помещать комбинацию слов на изображение с помощью мыши. Это может быть просто предложение, или заголовок, или стихотворение, цитата, текст и тому подобное. Слова можно помещать на картинку либо методом drag-and-drop из предложенного набора, либо свободным стилем (Free style method). Инструмент доступен через смартфоны и планшеты.
Единственный недостаток сервиса, на мой взгляд, отсутствие возможности загружать изображение. Текст размещается пользователем только на картинки из коллекции сервиса, которых довольно много.
К инфографике также можно отнести набирающие популярность во всём мире как форма изложения информации комиксы.
Сервис ComicMaster [http://comicmaker. comicmaster.org.uk/] представляет собой оригинальное веб-приложение по созданию комикса. Сервис абсолютно бесплатный. Создание комикса начинается с разметки страницы. Для этого предлагается несколько вариантов шаблонов (set comicrows), из которых можно скомбинировать макет страницы (рис. 8). Разметка представляет собой деление страницы на строки, в которых выделены ячейки. В результате страница представляет собой последовательность кадров разного или одинакового размера. После окончания создания макета нажимаем кнопку DONE, чтобы перейти к следующему этапу разработки.
После создания разметки страницы комикса появляется главное меню (ASSETS) для размещения контента. Первый пункт меню — выбор фона (backgrounds). Выбор сделать из шести представленных картинок. К сожалению, возможности загрузить фоновую картинку не предоставлено данным сервисом. Фоновый рисунок помещается в любую выбранную ячейку шаблона. Таким образом, каждая ячейка может иметь отличный фон от соседней ячейки. Второй пункт главного меню — выбор героя комикса (character art). Количество
Рис. 7. Рассказ на изображении
Рис. 8. Панель разработки комикса в сервисе ComicMaster
героев тоже ограничено числом четыре, но зато они весьма оригинальны в своём роде. На следующем месте главного меню находится выбор формы для текста речи (speech bubbles) героя комикса, а далее следует выбор формы текста мыслей (thought bubbles) героя комикса (рис. 9). Текст можно печатать после щелчка на кнопке с изображением буквы «Т». К сожалению, кириллица не поддерживается сервисом.
Очередной пункт главного меню — выбор подходящей формы (caption boxes) для ком-
ментариев к сцене. Следующий шаг — можно выбрать спецэффекты (special effects) — графическим образом оформленные непроизвольные вскрики. Последний пункт главного меню сервиса — выбор реквизита, к которому относятся различные гад-жеты, начиная от ключей и телефонов и заканчивая кружками. Размещаемые объекты можно накладывать друг на друга, а специальной кнопкой перемещать их выше или ниже.
Рис. 9. Шаблоны оформления комикса
Каждую созданную страницу комикса необходимо сохранить. Для просмотра страницы комикса имеются удобные инструменты: увеличить масштаб, перемещение страницы влево или вправо, вверх или вниз, вернуть масштаб на 100% и другие. Также имеются инструменты удаления страницы или вывода на печать.
Существуют аналогичные сервисы для создания комиксов. К ним относятся MakeBeliefsComix [http://www.makebeliefs-comix.com/] и Bubblr [http://www.pimpam-pum.net/en/content/bubblr].
Bubblr — это сообщество, где люди могут создавать комические полосы (фотоновеллы), используя фотографии из социального фотохостинга Flickr, выстраивая последовательность картинок, на которые сервис позволяет добавлять текстовые выноски в форме пузырьков и тем самым создавать инфографи-ку. Все комиксы сохраняются в архиве на сервере Bubblr.
Сервис MakeBeliefsComix позволяет создавать небольшие комиксы, максимум из девяти сцен. Панель разработки комикса (рис. 10) имеет удобные и понятные визуальные инструменты. Один из недостатков сервиса — невозможность написания диало-
гов на русском языке. Но можно использовать так называемый транслит — передачу текста с помощью чужого алфавита.
Создатель проекта Bill Zimmerman предполагает MakeBeliefsComix как место для получения удовольствия, создавая собственный мир комиксов. Его надежда состоит в том, что, давая разработчикам выбор персонажей с разными настроениями и возможность написать слова и мысли для них, они будут задействовать творческий потенциал и исследовать новые возможности. Он считает, что нет большей силы в жизни, чем сила воображения, чтобы освободить нас от наших непосредственных проблем и стимулировать усилия, чтобы найти новые решения.
Всё чаще педагоги, обучающие врачи и родители, которые работают с учениками с особыми потребностями, находят MakeBeliefsComix полезным ресурсом, чтобы помочь таким детям самовыражаться и общаться. На сервисе есть раздел, который показывает идеи и советы, присланные теми, кто использует сайт с учащимися, которые имеют ограниченные возможности. Среди комических характеров есть персонажи с ограниченными физическими
Рис. 10. Панель разработки комикса в сервисе MakeBeliefsComix
возможностями, чтобы отразить разнообразие пользователей, в том числе лиц с особыми потребностями.
На сервисе MakeBeliefsComix есть раздел COMIX Printables, который включает более 500 графических письменных приглашений в 50 категориях, чтобы помочь ученикам и учителям писать и выражать себя. Можно распечатать шаблоны с этого раздела и использовать дома и в школе, чтобы писать и раскрашивать. Учебные Printables могут быть использованы со студентами, учающими-ся по программам английский как второй язык. Они обеспечивают образовательный ресурс для преподавания художественной словесности и искусства. Printables являются частью миссии MakeBeliefsComix для поощрения людей всех возрастов, чтобы выразить творческий потенциал посредством письма, рисования и рассказывания историй.
Pixton [https://www.pixton.com/] — ещё одна социальная сеть по созданию комиксов и обмену ими. Как утверждает сервис, тысячи школ по всему миру используют Pixton. Через ресурсы приложения можно общаться с другими педагогами, использующими Pixton. К таким ресурсам относятся: загрузки классных мероприятий и планы уроков [https://www.pixton.com/ schools / teacher-resources/lesson-plans / subjects / ela/], совместная работа над проектами с классами по всему миру.
При входе в сервис предлагается идентифицировать себя либо с рабочим, либо с преподавателем, либо с учащимся, либо с человеком, желающим развлечься. С преподавателя взимается плата за каждого ученика.
Как можно использовать комиксы в образовании рассказано на одном из обозреваемых сер-
3
висов :
1. Создание автобиографической истории. В начале каждого нового учебного года школьники создают автобиографический комикс о себе и своих семьях или суммирующий самые важные вещи о своей жизни.
3 Zimmerman B. 25 ways to use makebeliefscomix.com
in the classroom. Дата посещения: 03.02.2017. http://www.make-
beliefscomix.com/How-to-Play/Educators/
«а «а
Каждый учащийся может выбрать мультипликационный персонаж в качестве аватара. После того как школьники сделают свои полосы, нужно поощрить их обменяться своими комиксами с одноклассниками, чтобы узнать больше друг о друге. Ученики также могут создавать информационные ленты, которые суммируют их индивидуальные интересы, чтобы помочь учителю узнать больше о них;
2. Практика с новыми словарными словами. Озадачьте школьников созданием комической истории с использованием новых словарных слов, которые преподаются. Ученики должны заполнить формы диалогов и мыслей для разных персонажей мультфильмов. Это поможет ученикам практиковать диалог и структуру языка в значимом контексте. Это ещё
и способ для учащихся улучшить своё письмо, чтение и повествующие навыки;
3. Практика с иностранным языком. Школьники могут создавать героев комикса, разговаривающих на иностранном языке. Соответственно для этих героев необходимо генерировать реплики
и мысли на их родном языке;
4. Организация групповой работы. Учащиеся разбиваются на пары или группы, чтобы создавать комиксы вместе. Такой подход поощряет взаимодействие и сотрудничество, дополняя навыки своих коллег;
5. Социальные навыки обучения. Создание комических сценариев для детей, страдающих аутизмом, — это способ научить их различным видам социального поведения, наблюдению за лицами разных персонажей, выбранных для мультфильмов;
6. Введение в творчество. Используйте разработку комиксов для знакомства учащихся с миром творчества и удовольствия, где используется собственное воображение в полной мере;
7. Дневники комиксов. Учащиеся могут создавать ежедневные комикс-дневники. Это обеспечивает способ переварить и интегрировать то, что они учат каждый день, а также задуматься о своей жизни и опыте. Призовите учеников использовать комических персонажей в качестве аватара для них, чтобы проанализировать свою жизнь, свои проблемы и свои тревоги. По сути дела, студенты могут увидеть себя в комиксах, которые они создают. Комиксы также позволяют школьникам выражать свои чувства и мысли
о том как происходит обучение в их классе;
8. Жизненные навыки. Практикуйте создание комиксов, в которых ученики могут моделировать реальную жизнь, сценарии, такие как поиск работы, встреча со школьным хулиганом или взаимодействие с трудным одноклассником. Например, физическое лицо собирается посетить врача или попало в аварийную ситуацию. Здесь можно практиковать словарный запас, который будет необходим для такой встречи — это может быть особенно полезно для тех студентов, которые изучают английский язык в качестве второго языка;
9. Местные или национальные новости. Предложите ученикам использовать символы для создания комиксов для комментирования местной или национальной политики. Возможно, эти мультфильмы могут быть опубликованы в школьной газете или информационном бюллетене;
10. Шутки ради. Создание комиксов
в классе просто ради чистого удовольствия и как способ помочь школьникам справиться со стрессом школы и повседневной жизни. Это обеспечивает идеальную активность для конца учебного дня или недели;
11. Общественная разговорная практика. После того как ученик закончит создание комикса, попросите его прочитать вслух или разыграть диалог, написанный для его персонажей. Это даёт возможность и структуру
для практики публичных выступлений и обмена мыслями с другими людьми;
12. Понимание литературных персонажей. Читая книгу или рассказ, учащиеся в своих комиксах связывают роли персонажей со своей личностью. Это помогает школьникам лучше понять персонажей в книге, которую они читают.
Разработанный план урока по обучению школьников онлайн безопасности с использованием комиксов можно посмотреть в статье «Онлайн безопасность в сетях
4
сторителлинга» .
WittyComix [http:/ /www.wittycomics. com/] полностью бесплатный и очень простой онлайн-сервис, который может быть полезен для тех, кто изучает языки. Сервис позволяет изобразить диалог между двумя персонажами. Всё, что нужно сделать, это выбрать заранее нарисованные сцены и героев, а затем добавить к ним текст на любом языке. Сервис не требует регистрации, но если требуется сохранить комикс в сервисе, то придётся создать аккаунт.
Write Comics [http://writecomics.com/] — онлайн-сервис для создания историй в форме комиксов. Регистрироваться или заполнять различные формы не требуется. Присутствует выбор фона в меню, персо-
«а ту*
нажей и пузырей для речи. Комиксом можно поделиться в социальных сетях.
Toondoo [http://www.toondoo.com/] — более развитый веб-сервис для создания комиксов. Имеет галерею публичных комиксов, в которой посетитель может не только просматривать комикс, но и оставлять комментарии и лайки к нему, печатать комикс и копировать код для вставки в блог и так далее. Полный спектр возможностей открывается после создания аккаунта. НО
4 Диков А.В. Онлайн безопасность в сетях сторителлинга / / Школьные технологии. —
2018. — № 6. — С. 51-58.
Infographics — Opportunities Social Services In Solution Psychological And Pedagogical Tasks
Andrey V. Dikov, Associate Professor of the Department «Computer Science and Methods of Teaching Computer Science and mathematics» Pedagogical Institute. V.G. Belinsky Penza State University, candidate of pedagogical sciences, e-mail: an171@rambler.ru
Abstract: The use of infographics in the educational process. Social services and their capabilities. The use of various tools of infographics and services in solving psychological and pedagogical problems.
Keywords: infographics, social media networks, social media services. Ispol'zovannye istochniki:
2. Dikov A.V. Onlajn bezopasnost' v setyahstoritellinga // Shkolnye tekhnologii. — 2018. — № 6. — S. 51—58.
2. Dikov A.V. Konstruiruem graficheskoe oblako iz uchebnogo materiala // Shkol nye tekhnologii. — 2018. — № 2. — S. 75-82.
3. Mezhpolusharnaya asimmetriya. — Vikipediya. Svobodnaya enciklopediya. Elektronnyj resurs. Data poseshcheniya: 28.03.2014. http://ru.wikipedia.org/wiki/Mezhpolusharnaya_asimmetriya.
4. Rotenberg V.S., Arshavskij V.V. Mezhpolusharnaya asimmetriya mozga i problema integracii kul'tur // Voprosy filosofii. — 1984. — № 4 — S. 78-86.
5. Zimmerman B. 25 ways to use makebeliefscomix.com in the classroom. Дата посещения: 03.02.2017.http://www.makebe-liefscomix.com/How-to-Play/Educators/
