Authoring Tools, Best Practices, Content Creation, Instructional Design, LMS Training, Moodle, Pukunui Australia, Pukunui Hong Kong, Pukunui Malaysia

How to use H5P in Moodle: Interactive Video

By  Putri Nor Atteya

H5P is a free and open-source content collaboration framework based on JavaScript. It is an abbreviation for HTML5 Package and aims to make it easy for everyone to create, share and reuse interactive HTML5 content. You can go to the H5P site to see more types of interactive content. Interactive videos, presentations, quizzes, timelines, and more have been developed and shared using H5P. H5P has been used widely in many LMS platforms, including Moodle. H5P Interactive video is an HTML5-based interactive video content type that allows users to add multiple choice and fill-in-the-blank questions, pop-up text and other types of interactions to their videos using only a web browser.

In this blog post, I will guide you on how we can start to use the H5P interactive video feature in Moodle.

Interactive Video example

Here is an example of an interactive video made using H5P. Try playing the video, and then we’ll look at how to create this within your Moodle site.

Steps to create H5P Interactive Video in Moodle

  • In an editing teacher role, on your Moodle course, click “Edit mode”.
  • Click “Add an activity or resources.
  • Select H5P activity
  • Insert a Name for the activity and click on “content bank (opens in a new window)” from the package section to create a new H5P.
  • Click “Add” and select “Interactive Video” from the list.

Steps on embedding a pre-recorded video into H5P

  • Click on the “+” section to select your video
  • Paste the video source URL and click on Insert.

Using H5P Bookmarks

You can use the H5P Bookmark feature to create segments in your video. This can effectively chunk up your videos into smaller parts.

  • Go to the segment of your video where you would want to create a Bookmark. Click on the “Bookmark Icon” and “+ Add bookmark”. Please give it a name, and you are good to go!
  • You can delete a bookmark by selecting it from the bookmark menu and then clicking on the “x” icon.

Adding H5P Interactions

Previously we have embedded video in H5P, created bookmarks to add steps, and now it is time to add interactions in H5P.

  • Click on “Add Interactions
  • You can select the type of H5P interactions you would like to use from the list of icons.
  • Here’s the list of H5P interactivity types you can use (from left to right)
    • Label > Text > Table > Link > Image > Statements > Single Choice Set > Multiple Choice > True/False > Fill in the blanks > Drag & Drop > Mark the Words > Drag the Words > Crossroads > Navigation Hotspot

There are many H5P Interactive Content types that you can create. If you need help developing interactive content and learning more about H5P,  contact us today. 

Putri Nor Atteya

Putri's passion for eLearning can be traced back to 2015, when she spent significant time working on various eLearning tools. As an LMS Consultant and trainer, she specializes in Moodle platform and H5P

related posts:

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}