Презентация
Продолжаем осваивать сервис H5P и сегодня мастерим презентацию, да не простую, а интерактивную. На любой слайд такой презентации можно добавить задание: вопрос, викторину, флеш-карточку... Всего около 10 различных упражнений. А ещё можно встроить изображение, гиперссылку, таблицу, видео, аудио... Возможности практически безграничные.
Вот что получилось у меня. Слайды с заданиями и вопросами отмечены кружочками.
https://h5p.org/h5p/embed/39965
Теперь несколько довольно много слов о том, как смастерить такую интерактивную презентацию.
Первые шаги
Если вы впервые заглянули на сайт сервиса H5P, нужно зарегистрироваться (подробнее о регистрации - здесь).
В личном кабинете нажимаем “Create New Content”, придумываем название для презентации (Title) и выбираем из выпадающего списка подходящий шаблон. Называется он “Course Presentation”.
В центре - слайды презентации для редактирования. Вверху и справа - панель инструментов для добавления элементов. Вот весь список слева направо:
- Текст.
- Ссылка на веб-ресурсы.
- Изображение.
- Видео.
- Аудио.
- Гиперссылка с переходом на другой слайд.
- Задание с заполнением проспусков в тексте.
- Вопрос с выбором одного правильного ответа.
- Вопрос с выбором нескольких правильных ответов.
- Вопрос “Правда или ложь?”
- Задание "Drag and Drop".
- Викторина на основе утверждений.
- Упражнение с переносом слов.
Если нажать на "плюсик" в правом верхнем углу, возможностей станет ещё больше. Теперь можно ещё добавить:
- Упражнение “Отметь слова”.
- Диалог-карты.
- "Непрерывный текст" (большой текстовый массив).
- Экспортируемый текст
- Таблицу.
- Интерактивное видео ( том, как его создавать и редактировать - здесь).
- Контент из Twitter.

У каждого слайда можно устанавливать фоновое изображение, загружая его с ПК (не более 16 Mb), или заливку фона. Чтобы добавить в презентацию новый слайд, нажимаем “+” справа внизу.

Для добавления элемента в презентацию щелкаем на него “мышью” на панели инструментов. Открывается окно для редактирования. Все объекты можно свободно перемещать “мышью” по рабочему полю, менять их размер и удалять.
Элементы презентации
Текст, добавляемый в презентацию, можно форматировать, прикреплять к нему ссылки, оформлять в виде кнопки (опция не действует при редактировании большого массива текста).
Редактирование обычного текста
Редактирование "непрерывного текста"
Экспортируемый текст отображается на слайдах презентации в виде окошка, в которое зритель при желании может добавлять свои комментарии. Этот текст можно сохранить на ПК.
Это окно для добавления гиперссылки.

Изображение загружается с ПК.
А видео - по ссылке из YouTube или с компьютера (не более 16 Mb). В разделах “Visuals”, “Playback” и “Add video track” скрываются дополнительные видеонастройки. Не проходим мимо!
Аудиофайл загружаем с ПК (не более 16 Mb). Можно устанавливать размер, выбирать дизайн (обычный или минималистичный), настраивать автозапуск.
Сервис позволяет делать ссылки с одного слайда презентации на другой. Для этого нажимаем на значок “якорь” и указываем номер слайда для перехода или выбираем предыдущий / последующий слайд. Надпись для перехода можно сделать невидимой.

Также в презентацию можно добавить небольшую таблицу в 2 столбика и 2 строки. Данные помещаются в готовый шаблон (просто заменяем названия строк и данные ячеек).

Вопросы и задания
При добавлении в презентацию вопросов, упражнений и интерактивного видео открываются необходимые редакторы для работы. Остаётся только заполнить шаблон - и дело в шляпе!
Задание с заполнением пропусков (Fill in the Blanks)
Добавляем инструкцию и текст с пропущенным словом. Пропущенное слово выделяется в тексте “звездочками” с двух сторон. Можно добавить неправильный вариант ответа: в этом случае варианты нужно разделить косой чертой (/). Если необходимо добавить подсказку, ее добавляют после вариантов ответа и ставят перед ней двоеточие. Пример текста с пропуском: Сервис работает в *браузере / мобильном приложении : то, чем вы пользуетесь каждый день*.
К одному слайду можно привязать несколько текстов с пропусками. Чтобы добавить новый текст, нажимаем “Add text block”.
А ещё к вопросу можно добавить изображение (Image) или видео (Video), выбрав их из выпадающего списка в разделе “Media”.

В разделе “Behavioural settings” доступно несколько дополнительных настроек:
- включить кнопки “Показать решение” и “Попробовать ещё раз”;
- автоматическая проверка ответа;
- убеждаться, что слово написано точно так же, как и в ответе;
- требовать заполнить все поля перед показом ответа;
- показывать поля для ввода данных отдельными строками;
- отмена масштабирования изображения;
- показ диалога подтверждения на проверку решения и показ правильного ответа.

Вопрос с одним правильным ответом (Single Choice Set)
К одному слайду можно прикрепить сразу несколько вопросов. Первый вариант ответа верный, остальные - неверные. Чтобы добавить ещё вариант ответа, нажимаем “Add answer”.

В разделе “Behavioural settings” можно установить время паузы в случае верных и неверных ответов, включить звуковые эффекты, кнопку повтора вопроса и кнопку “Показать решение”.

Вопрос с несколькими верными вариантами ответа (Multiple Choice)
К одному слайду можно прикрепить сразу несколько вопросов: вписываем в нужные окошки вопрос и варианты ответов. Правильные ответы помечаем галочкой. В разделе “Tips and feedback” можно добавить подсказки и обратную связь к каждому варианту ответа, а в разделе "Media" - прикрепить к вопросу видео или картинку.

В разделе “Behavioural settings” доступно несколько дополнительных настроек:
включить кнопки “Показать решение” и “Попробовать ещё раз”;
выбрать тип кнопки для ответа из выпадающего списка (автоматические, флажки, радиокнопки);
давать один балл только за выполнение всего задания целиком;
перемешивание ответов;
требование решения перед показом ответа;
отмена масштабирования изображения;
показ диалога подтверждения на проверку решения и показ правильного ответа.

И еще немножко настроек:

Вопрос "Правда или ложь?"(True/False Question)
Всё просто: в графу “Question” вносим какое-нибудь утверждение и отмечаем, правда это или нет. В разделе “Media” можно прикрепить изображение (Image) или видео (Video) к заданию.

И настройки к заданию:

Задание "Drag and Drop" (дословно: "Тяни и бросай")
Для начала в разделе "Settings" придумываем задание. Например: "Как называется это животное? Перенесите "мышью" на изображение верный ответ" и загружаем картинку, к которой нужно будет подобрать пару: текст, слово, изображение. На языке сервиса картинка называется "территорией вброса".

В разделе "Task" нажимаем на значок с изображением точки (Insert Drop Zone) и перетягиваем его на нашу картинку. Появляется рамочка, обозначающая границы "территории вброса". Границы можно растянуть на всё изображение или только на его часть.

Добавляем варианты ответа на задание. Выбираем значок "Text" и переносим его на картинку, вписываем нужный вариант ответа, меняем границы, если надо. Если вариант ответа - это картинка, выбираем значок "Image" (он находится рядом, справа) и повторяем манипуляции (изображение загружается с ПК).

Возвращаемся к основной картинке. Нажимаем на значок "карандашик" над ней и попадаем в редактор. Здесь "привязываем" картинку к нужному варианту ответа, отметив его галочкой, и, если надо, устанавливаем прозрачность изображения (чтобы его выделить). Не забываем нажать "Done".

И ещё немножко настроек.

Викторина на основе утверждений (Statements)
В графу “Introduction text” вписываем задание, например: “Выберите из предложенных утверждений верное”. В графы “Statement” вносим утверждения, первое из них - верное. В разделе “Tip” можно добавить подсказку отвечающему.

К одному слайду можно добавить несколько заданий-утверждений. Чтобы добавить новый набор утверждений, нажимаем большую синюю кнопку “Add statements”.
Задание с переносом слов (Drag Text)
Очень похоже на задание "Fill in Blanks", только слова для заполнения пропусков в тексте нужно брать из предложенного списка.
В разделе “Task description” - задание к упражнению. В разделе “Textfield” помещаем текст с пропусками, которые нужно заполнить. Нужное слово на месте пропуска отмечаем с двух сторон “звездочками”. Например: Осло - столица *Норвегии*.

Упражнение "Отметь слова" (Mark the Words)
В графу “Task description” вносим задание. В графу “Textfield” вписываем текст со словами, которые нужно найти и отметить. Слова, которые будут правильными ответами на вопрос, отмечаем с двух сторон значком “звездочка”, например: *ответ*.

Диалог-карты (Dialog Cards)
В разделе “Task description” помещаем задание. И начинаем создавать карточки.
Раздел “Text” - текст на лицевой стороне карточки (вопрос). Раздел “Answer” - текст для оборотной стороны (ответ). Чтобы перейти к редактированию новой карточки, нажимаем “Add dialog” слева. Карточки можно менять местами, перемещая их “мышью”. Удалить их можно, нажав на значок “крестик” справа.

К карточке можно прикрепить изображение (загрузить с ПК) и аудио (загрузить с ПК или по ссылке из Интернета). В разделе “Edit copyright”, если необходимо, указываем авторство изображения и аудиофайла.
В разделе “Tips” можно указать подсказки, дать дополнения или советы: “Tip for text” (для лицевой стороны карточки) или “Tip for answer” (для оборотной стороны).
В разделе “Behavioural settings”, как всегда, несколько полезных настроек:
показывать кнопку “Попробовать ещё раз” (Enable "Retry" button);
не показывать обратную навигацию (Disable backwards navigation) - в этом случае нельзя вернуться к предыдущим карточкам;
адаптировать текст под размер карточки, чтобы он помещался (Scale the text to fit inside the card);
перемешать карточки (Randomize cards).

Если к одному слайду прикреплено сразу несколько вопросов или заданий, можно настроить обратную связь - в разделе "Overall Feedback". Нажимаем "Add Range" и добавляем оценки в зависимости от количества правильных ответов. Например, если правильных ответов всего 20%, выбираем оценку "неплохо", если от 20 до 80% - "хороший результат", от 80 до 100% - "отлично". Кстати, сервис может распределить оценки автоматически: достаточно нажать "Distribute Evenly". Эта опция не работает только в случае с диалог-картами.

Очень интересно смотрится встроенное в презентацию интерактивное видео. Просто нажимаем на нужный значок справа и прямо внутри презентации приступаем к созданию видеоролика. О том, как его редактировать, подробненько написано здесь.
***
По умолчанию в конце презентации на последнем слайде будут подведены итоги всех заданий, упражнений и викторин. Можно узнать, сколько баллов завоёвано.
Ещё немного, ещё чуть-чуть...
Осталось в разделе “Behaviour settings” установить дополнительные настройки для презентации. Здесь можно настроить навигацию между слайдами и показ кнопок “Показать правильный ответ” и “Попробовать ещё раз” (Enable - показывать, Disabled - не показывать).

В разделе "Social Settings" можно добавить значки основных социальных сетей, чтобы делиться результатами пройденных в презентации испытаний.

В разделе “Text overrides and translations” можно перевести на русский язык надписи, которые будут появляться при показе презентации. Переводить абсолютно всё совершенно не обязательно: выбираем только нужное, а в случае затруднений обращаемся к Google Переводчику.
Как только работа над презентацией будет закончена, нажимаем “Save”. Ссылку можно взять вверху из строки браузера в режиме просмотра (View). Для того, чтобы получить код для встраивания на страницу сайта или блога, нажимаем внизу “Embed” (не забудьте указать в открывшемся окошке размеры в пикселях, чтобы видеоролик вписался в блог).
Ну вот, пожалуй, и всё. Удачи в освоении сервиса!одного правильного ответа.