Интерактивный плакат — это большое такое изображение, к которому в виде меток («горячих точек») прикрепляются ссылки на веб-ресурсы и разные мультимедийные объекты: видео, аудио, презентации, слайд-шоу, игры, опросы…

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

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

А вот и мой небольшой пример — «Животные Лапландского заповедника».

С помощью Удоба сделать такой плакат не так уж и сложно. Итак, приступим…

Регистрация

Для начала давайте зарегистрируемся. Заходим на стартовую страницу сервиса и нажимаем «Создать пользователя».

Заполняем предложенную форму: имя пользователя, адрес электронной почты, пароль, капча… В заключение нажимаем кнопку «Регистрация».

На указанный адрес электронной почты придёт письмо с одноразовой ссылкой для входа на сайт. Переходим по ней.

Осталось нажать «Войти», чтобы перейти к созданию собственной библиотеки на сайте.

Нажимаем на кнопку «Создать библиотеку». 

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

Выбираем — загружаем

Из списка шаблонов выбираем тот, который называется «Интерактивные области на изображении» (Image Hotspots).

Придумываем название плакату. Загружаем с ПК фоновое изображение для него, выбираем из выпадающих списков вид иконки (метки, «горячей точки») и её цвет.

Всё дело в точках

Теперь самое интересненькое: прикрепляем метки к изображению. Щёлкая «мышкой», выбираем на картинке место для «горячей точки» (Позиция метки), придумываем ей название (Заголовок) и выбираем тип контента (Элемент содержимого): видео (Video), изображение (Image) или текст (Text).

Самое замечательное в этом сервисе, что к одной метке можно прикрепить сразу несколько типов контента (видео с текстом, изображение и видео, а можно и всё сразу): для этого нажимаем “Добавить item”.

Текст можно редактировать: менять размер, начертание букв (полужирное, наклонное). К словам можно прикреплять ссылки (выделяем нужное слово или словосочетание и нажимаем на значок с цепочкой).

У картинки указываем название и альтернативный текст, по желанию — текст при наведении курсора.

Видеоролики загружаются по ссылке из YouTube или с ПК. У них настройки побогаче.

В разделе “Визуализация” выбираем опции видеоплеера и добавляем постер к видеоролику, а в разделе «Воспроизведение» устанавливаем автоматическое воспроизведение видео и воспроизведение “по кругу”.

Чтобы добавить новую метку на изображение, нажимаем “Добавить hotspot”. А в заключение нажимаем “Сохранить”.

Мы ребята поделистые…

Для того, чтобы получить код для встраивания на страницу сайта или блога, нажимаем внизу “Вставить”.

Копируем код из открывшегося окошечка. 

Код будет выглядеть примерно вот так:

<iframe src=»https://udoba.org/h5p/embed/2832» width=»1014″ height=»622″ frameborder=»0″ allowfullscreen=»allowfullscreen» allow=»geolocation *; microphone *; camera *; midi *; encrypted-media *» title=»Животные Лапландского заповедника»></iframe><script src=»https://udoba.org/sites/all/modules/h5p/library/js/h5p-resizer.js» charset=»UTF-8″></script>

Кстати, из этого кода можно извлечь ссылку для красивого полноэкранного просмотра плаката. Эту ссылку я выделила красным.

Чтобы вновь вернуться к редактированию проекта, нажимаем на вкладку «Редактировать» вверху.

Кстати, а вы знаете, что с помощью «горячих точек» на картинке можно создавать интересные игры и викторины? Но об этом уже в другой раз.