H5P Interactives

Create simple, fun and interactive online learning activities.

Using the H5P Interactive Video Tool

This guide uses an H5P object. For getting started on placing H5P into a space, please see Inserting H5P in VU Collaborate.

The H5P Interactive Video Tool is a HTML5 based interactive video content type that helps you to add multiple choice and fill in the blank questions, pop-up text and other types of interactions to videos. This is a powerful content type for engaging students and testing knowledge in an active online environment.

You can enrich videos with explanations, extra pictures, tables and questions. Quiz questions support adaptivity, meaning that you can jump to another part of the video based on the user's input. Interactive summaries can also be added, and will appear at the end of the video. 

H5P is very user friendly. While exploring, you will see Demos and a range of Examples. Click these while creating objects to get inspiration and ideas. H5P.org also offer their own tutorial on this object, with an example included. 

Below are the steps to use the H5P interactive video tool:


Step One: Create a New Interactive Video

1. In the Learning Space choose the module you want the H5P to be in, click on New then New Document.


new new documentv1


2. In the Insert Stuff menu, scroll down and click H5P Learning Object.

Insert Stuff


h5p learning object

3. In the H5P tool, click Add Content.

dd content


4. Choose Interactive Video


choose interactive video


Note: If you click on Details, a summary of the tool and an option for a demonstration will appear. You can click Content Demo to check more details. If you are satisfied with your tool selection, click Use


contentdemo and use


5. Add a Title for the new object that will be easy to remember and find. 




Step Two: Add Your Video

You can add a video from an external link or upload one from your computer. For the purpose of this guide, we'll use a Youtube video from an external link. H5P supports a lot of different video streaming sites, and you can experiment with your own footage too.

When you select the Interactive Video content type, the main Interactive Video Editor area will appear. Creating the interactive video object is done entirely in this screen, in your browser.


1. Click the box with the grey dashed border under Add a Video.


add a video


2. A pop-up box will appear. Click Upload Video File to add a video from your own computer, or paste a link to a video source on the web. 


video file and link


3. Click Insert to add your video to the H5P object.


4. Click Edit copyright to add details of the video copyright, whether it is yours or belongs to someone else. For more information about copyright and why it matters for external content, please see the article Adding Content Without Breaching Copyright.


edit copyright


5. Click the Interactive Video tab to expand options for how the video playback appears to the student.

interactive video tab

This is only for video files and is not supported for YouTube Videos. If you are using a YouTube Video, go to Step Three.  

6. Enter a title that will help contextualise the object if you are grading it or viewing student progress - use something that you will remember easily.


st growing


7. In some cases, the title you enter will appear on the video before it plays. You can disable this option by checking the tickbox next to Hide title on video start screen.




8. Add a short description to help contextualise the video for students. This is optional.




9. Add a Poster image that will appear at the start of the video before it plays. This is optional.

Note: Poster images will not work for YouTube videos, and may not work well in combination with a description (above).




After all of this information has been added, you are ready to move on to adding interactions and making the video come to life.


Step Three: Add Your Interactions

Interactive videos in H5P can contain text, images, navigation buttons, questions, and much more. You can choose to pause the video when an interaction appears, skip to another point (timecode) in the video depending on a question's answer, or have buttons that are optional and pop up with extra information while the video is playing, with no interruption to the video.


1. In the Interactive Video Editor, click the Add Interactions tab at the top. This will take you to a screen that previews the video that you have either uploaded or embedded in Step Two.


add interactions


2. You can add images, tables, links, and several different question types to a H5P interactive video. For the purpose of this tutorial, we are going to start by inserting a text interactive. Find a place in the video where you would like to add extra context or information. Click the T icon to add a text item.


T icon


3. Set a Display time that determines when, and how long, the interaction will appear. This will automatically show the timecode of where you have navigated to in the video, and last for ten seconds.

Note: The Display time, Pause video, and Display as settings are common to all of the interactives you can add to this video.


the display time section with two fields showing a timecode that lasts for ten seconds. The pause video option appears on the right of these fields, with an empty tickbox


If you want the video to pause when this particular interaction appears, check the tickbox next to Pause video.  This is useful with interactions as it makes it clear to the viewer that they are expected to complete the activity.  Be sure to make the times the same, otherwise the viewer will miss 10 seconds of the video when they complete the activity.


the pause video option highlighted to the right of the display time


4. Choose whether you want the interaction to display as a Button or a Poster. A button needs to be clicked before the text (or other interaction) can be viewed, but a poster is already expanded and appears as an overlay on the video at the specified time.

Tip: You can adjust the size, position and shape of posters and buttons after they are created. 

display as section with the button radial on the left selected, the whole area is highlighted and includes a brief definition of the difference between a button and a poster


5. If you have selected a Button (default) for the text item, you can enter a Label. This could be something as simple as "Click here!". Adding a label is optional. If you have selected Poster, you will not have the option to add a label.


the button label field, highlighted and with some text entered as an example


6. Enter some Text to display. You can add hyperlinks, headings and line breaks using the rich text editor.


the text field highlighted and empty


3.1 Adding links to interactions

This and the following are optional. If you do not want to add an external URL or skip to another part of the video, move on to the next substep.


1. Click the Go to on click tab to expand options for skipping throughout the video. 


the go to on click button highlighted underneath the text field


2. Click Type to select where you want the student to be directed when they click on this interaction.

  • If you select Timecode, the student will be skipped to another part of the video when this button is clicked.
  • If you select Another page (URL) you can enter a link that will open when this button is clicked.


the go to on click area expanded, with the type dropdown menu open. The two options are timecode and another page URL


3. Click Done to insert the Text interaction into the video.


the done button highlighted in the top right hand corner of the screen


3.2 Adjust Size / Position and Add More Interactions

Your new text interaction will appear on the video. You can edit, delete, move, and adjust the size of the interaction before you move on to creating the next one.

1. Click and drag your new interaction to move it to a new position.


the example video with the new button placed on it, and position details visible. The area that the button appears in is highlighted and a preview of the label appears on the left


Tip: If you have created a button with a label, make sure you drag it somewhere on the video where it can be clearly and easily read.


the same button with label and options visible moved to a different position on the same frame of the video


2. You can insert several different H5P question types into interactive videos from this toolbar. For this guide, we're going to use a single choice set question. For more information about this question type in H5P, please see Using the H5P Single Choice Set Tool. For more information about question types in H5P, see our category on H5P interactives.


different question types


3. In the Single Choice Set tool, enter your Question in the first field.


the single choice set editor with sample text entered, it reads: What's the best time of year to plant strawberries?


4. Once you've finished configuring your question, click Done. Your question (set here to Poster) will appear on the video. Adjust position and size until the scroll bar on the right is no longer visible.


The single choice set question inserted as a poster, with four possible answers. The edit options appear at the top of the question


You can keep adding different kinds of interactions to make the video more engaging and challenging for students. Interactions will appear as dots on the playback bar at the bottom of the video.

Note: Not all question types will appear to the student as they appear to you in the Interactive Video Editor -- if this is your first time creating an interactive video with H5P, you will need to preview your work (outlined in Step Five) to see how the questions look.

There are a lot of different interaction types that are not covered in this guide. These are available in the toolbar at the top of the video. Click around and explore the different options to add interactivity to your video. Many of these options have their own guides on how to set them up (for example, Using the H5P Multiple Choice Question Tool for how to configure multiple choice questions), so be sure to check the H5P Interactives category if you get stuck.


the toolbar at the top of the add interactions screen, with the video below it. Several options are highlighted


5. Click Summary task when you have finished adding all your interactions. This will help you build a summary that appears at the end of the video to test students' knowledge in the moment. Adding a summary to your interactive video is optional - you can skip this substep and head straight to Step Four if you don't want to add a summary task.


summary tsk


3.3 Add a Summary task

This step is optional and can be skipped if you don't want to test students at the end of the video. Summary tasks help review what has been conveyed or learned throughout the video, or a general test of knowledge related to the topic (like a pop quiz).

Note: Summary tasks in interactive videos are based on the H5P summary tool; if you're having trouble with these steps, it may be useful to check out Using the H5P Summary Tool.

1. Enter some Introduction text to explain the task. H5P automatically generates the text "choose the correct statement".


introduction text


2. Add your first statement. This is a complete sentence that the student can choose as an answer (like in a multiple choice question). The first statement is the correct answer; if using multiple sets, ideally all of the correct answers will work together to form a complete paragraph or 'summary' of the video.


two statement fields, the first one highlighted and filled out with sample text, which reads: strawberries are best planted in the middle of winter


3. Click Add statement to add more options for students to choose from. H5P automatically generates two blank statements per set.


the add statement button highlighted below the statement fields


4. Click Tip to expand the tip tab. Tips add information that helps students choose the right answer. This is optional, and a tip can be added for each set of statements.


the tip tab highlighted below the add statement button


5. Enter some Tip text if you've chosen to include a tip for this set of statements.


the tip tab expanded and the tip text field highlighted


6. Below the tip tab, click Add statements to create a new set of statements. If you choose to create multiple sets of statements, these will appear at the end of the interactive video one at a time.


the add statements button highlighted underneath the tip tab


7. Enter the time that you want the summary to Display at.


the display at section highlighted underneath the add statements button, with a subtitle that reads: number of seconds before the video ends


8. Overall Feedback can be designed to appear depending on the percentage of correct answers a student has achieved. To add a range, click Add Range and select the minimum and maximum percent for this feedback. If you would like a specific amount of ranges, H5P will calculate the percentages for you. Click Add Range 5 times, then click Distribute evenly: the percentages will adjust themselves. 

Write the feedback in the text field and select at what point it should appear before the end of the video. 


Overall feedback


Step Four: Configure Behavioural Settings

Behavioural settings determine how your video is going to display and work for students, including any questions you may have added in the previous step.


1. Click the Behavioural settings tab to open up the behavioural settings area. You can choose not to change any of these options, but we will look at each of them and what they do in this guide.


behavioural settings


2. Enter a timecode in the Start video at field if you want the video to start at a certain point (for instance, skipping a long title card in an external video).

    Tick Auto-play video if you want to start playing the video automatically.

    Tick Loop the video if you want the video to run in a loop.


start video


3. Use the Override "Show Solution" button dropdown menu to enable or disable the show solution button on questions placed in the video. Leaving this blank will allow you to change the solution button's visibility for each individual interaction.


show solution


4. Use the Override "Retry" button dropdown menu to determine the presence of the Retry button on questions placed in the video. As above, leaving this blank will allow you to change the button's visibility for each individual interaction.


retry button


5. The following options are all disabled by default, and can be enabled by checking their indivdual tickboxes:

  • Select Start with bookmarks menu open if you are using Bookmarks to help students navigate the video. Bookmarks can be added in the Add interactions tab and allow users to skip to a particular point in the video, like a table of contents.
  • Select Show button for rewinding 10 seconds to give students an extra navigation tool in case they have missed a question or want to go back quickly to review information in case of interruptions.
  • Select Prevent skipping forward in a video to disable user navigation when the video plays, meaning that students won't be able to jump around the video and must watch and engage with interactions in a pre-determined order. This is a particularly useful setting if you have set up some of your interactions to jump to different timecodes, or are using bookmarks for navigation.
  • Select Deactivate sound to permanently remove sound from this video. 




All of these options are designed to give you more control over how students engage with the video you have created, and understanding them will help you create more complex and targeted content that speaks to your expertise and course outcomes. When you are happy with your settings and interactions, we can move on to previewing this new interactive video.


Step Five: Preview and Publish Interactive Video Object

At the bottom of the screen you can adjust your H5P's settings (you can leave these settings by default or make alterations):

1 - Display options: (previously 'Display and copyright buttons') What options do you want to be visible for the user, for example you can tick the display download button to enable students/staff to download the H5P to their own computer. You can also tick the Display embed button, which allows the user to embed the H5P into their HTML editor in VU Collaborate for example.

2 - Folder: (previously 'My Content') All your content will be saved in one spot, within a root folder.

3 - Publish: This option allows you to make the H5P Unpublished (content can not be inserted into VUC), Protected (content can be inserted into VUC) or Public (visible to the public using a content link and the content can be inserted into LMS and be embedded). Protected is the default setting and it is recommended to leave this setting as it is. 

4 - Collaborators: (previously 'Authors') In this setting you can add and search for other collaborators and give them access to edit your H5P's. For example, if you are teaching a unit with another staff member and you would like them to have access to edit your H5P's, then you can use the search field to locate another staff member by typing in their full name. 

5 - Sharing: (previously called 'Select value') This is where you share your H5P with others, so they can view and clone your content. There is a folder allocated for each college, for example 'Arts and Education', select your College.

Note: To know more about Sharing and Collaborators, please see H5P Sharing and Collaboration.

6 - Send Score to LMS: (previously 'Send to Gradebook') In this section you can link your H5P directly to VU Collaborate and also link it to your gradebook. It is recommended to leave this setting as it is, and NOT send the results to the gradebook. 


title new h5p


1. Click Save and Insert. A preview of the interactive video will appear.  This will help you see how your questions appear to students and whether enough time to answer them has been allotted.


save and insert


preview interactive video


2. The H5P object is now ready to add to your space. Click Insert to add the interactive video to the document.




3. Alternatively, you can click Save.


h5p save 


4. Then click Insert.


h5p insert


Further Support

Visit the VU Collaborate Help site at https://vucollaboratehelp.vu.edu.au for up to date information and resources on blended learning or email This email address is being protected from spambots. You need JavaScript enabled to view it..

Contact ITS Service Desk on (03) 9919 2777 or via self-service http://servicedesk.vu.edu.au for further technical support.