Blended Learning Help Site Banner

H5P Interactives

Creat fun and simple online interactive learning activities

Using the H5P Course Presentation Tool 

Course Presentations use images, videos, text and interactive elements to present topics. Course presentations are used when you want to package a piece of learning content in a structured and interactive format. They are an interactive alternative to PowerPoint presentations. Learners swipe through slides to experience the learning material, while interacting by solving various quizzes, clicking hyperlinked content or watching videos along the way. There are a lot of engagement elements to be explored! 

Students can navigate in the presentation either by moving one slide at a time, jumping to a specific slide, or by accessing slides that contain a new topic. This helps students to have control over their learning - based on their skills and previous knowledge.

Presentations can be accompanied with formative self-assessments in the form of short quizzes. The quizzes are presented throughout the slides and contain multiple select and fill-in the blank responses to reinforce learning. After each quiz is taken, students receive immediate feedback for their answers and the opportunity to repeat any quiz.

Performance feedback can also be included by presenting the overall progress for each one of the formative assessments. This summary helps students to reflect on what topics they have mastered and what areas they still need to improve to make more progress.

H5P is very user friendly. While exploring, you will see options to Tour, the possibility to see Demos, and a range of Examples. Click these while creating objects to get inspiration and ideas. 

For instructions on how to locate and insert H5P Learning Objects, please see Inserting an H5P in VU Collaborate

Below are the steps to use the H5P course presentation tool:

 

Step One: Getting Started 


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, click to open the H5P Learning Object.

insert stuff icon in the HTML editor

 h5p learning object
 

3. In the H5P tool, click Add Content.

dd content

4. From the Content Type dropdown menu, select Course Presentation

course pre 

5. As mentioned, there are tutorials and examples available. We encourage you to explore these to get to know the objects and to have some interactive assistance.  

Note: If you click on Details next to the name of the object type, a summary of the tool and an option for a demonstration will appear. If satisfied with your tool selection, click Use

 6. The Course Presentation editing window will appear. Here you can make all your changes and create your presentation. 

course pre editing window

 

Step Two: Creating Slides


The bottom toolbar controls the slides. 

 toolbar

1. To add a slide, click the plus icon. 

toolbar1

2. To clone a slide you've created, click the two papers icon. 

toolbar2

3. To set a slide background, for either a full presentation template or a single slide, click the paintbrush icon.

 toolbar3

4. To sort the slides, click the arrow screen icons, left or right. 

toolbar4

5. To remove a slide that you have created, click the screen with a cross icon.

toolbar5

6. Click the double square to activate the side key word menu. These keywords should be added as you go. They will correspond with whichever slide you are working on when you add them, and can be used to navigate later on.
 

toolbar6

To change the settings of the keywords, click the Slides dropdown at the top of your presentation.

slides2

Tip: Don't forget to scroll to the bottom of the page to save the presentation at regular intervals. This will prevent you losing your work. Once saved, you will be able to view the presentation preview. To continue editing, click Edit

 

Step Three: Adding Content


The top toolbar contains everything you can add into your course presentation.

tool bar

3.1 Text 

Click the Text icon to insert text. Once you have entered text into the field, select Done.

text icon

Text Exemplar

The HTML editor has basic formatting controls. There is also the option of adding a link into the body of the text. 

The text will appear in the centre of the slide, and can be moved, resized or edited. 

example text

If you click Display as button in the text editor, it will appear as a small blue button in the shape of an information icon. You can also change the size of the icon by clicking the drop down menu of Button size.

display as button

text button

Which when clicked, it will show the information in a popup window.

Note: This cannot be seen in the editor mode but will be clickable when previewing the presentation. 

3.2 Link

Click the Link icon to insert a link.

link icon 

Fill in the fields and copy in the URL you would like to link and click Done

Link URL Exemplar 

The link will appear as per the title you created. It is also possible to display this link as a button.

Link URL Displayed in Slide

3.3 Image

Click the Image icon to insert an image. 

Top toolbar with image icon highlighted

 Click the Green plus icon to choose your image and upload it. Enter alternative text for accessibility and click Done. It is also possible to display this link as a button.

Image Icon with Alternative Text Exemplar

3.4 Shapes

Click the Shapes icon to insert a shape. 

 shape icon

Choose the shape you would like to add.

choose shape

Edit the selected shape by clicking the drop down menu of Fill color, Border color, Border width and Border style. Once the editing is complete, select Done

Shapes Edit

3.5 Video

Click the Video icon to insert a video. 

video

Click the Plus icon to upload your video. Enter any settings you would like to adjust and click Done. It is also possible to display this link as a button.

edit video2

Your video will appear as a thumbnail image with a play button in the centre. 

thumbnail video

3.6 Go to slide

Click the Anchor icon to insert a Go to slide.

anchor icon

Enter the Title text and click the drop down menu of Go to. If you choose Specific slide number, enter the number of the slide that you would like the student directed to. Then click Done.

edit specific slde

The Go to slide will appear as a box frame. When hovered over with the cursor, it will be highlighted and your title text will appear. When clicked on, it will take the student to the slide previously specified. 

Blue background with broken lined box.

3.7 Audio

Click the Audio icon to insert an audio file. 

audio icon

Add a title for the audio in the Title field. Click the Plus icon to upload your audio. Enter any settings and controls you would like to adjust. Once complete, select the Blue tick button

Audio Settings

3.8 Question Types

There is a range of question types available to insert from the top toolbar. The detailed guides on creating these types are linked below. 

This icon is for Using the H5P Fill in the Blanks Tool.

Q type 1

This icon is for Using the H5P Single Choice Set Tool.

Q type 2

This icon is for Using the H5P Multiple Choice Question Tool.

q type 3

This icon is for Creating True/False Questions.

q type 4

This icon is for Using the H5P Drag & Drop Tool.


drag and drop

This icon is for Using the H5P Summary Tool.

summary tool

The Three-dot icon on the right of the presentation will reveal more options when clicked. 

three dot icon

This icon is for Using the H5P Drag & Drop Text Tool.

text drag and drop

This icon is for Using the H5P Mark the Words Tool.

mark the words

This icon is for Using the H5P Dialog Card Tool.

dialog card

This icon is for continuous text. 

continous text

This icon is for exportable text. This tool leaves space for students to free write answers that can then be exported for assessment. 

exportable text

Write the Label and it will appear in your presentation with a text box below it for students to write in. Once complete, select Done

step 43 Copy

This icon is for creating a table. This tool provides a template to fill in.

 table

This icon is for Using the H5P Interactive Video Tool.

three dot video

Click the Twitter icon to insert a Twitter feed. 

twitter

Enter the details of the Twitter account and the amount of Tweets, then click Done

step 46 Copy

Note: Clicking Remove while editing an object will result in a popup menu confirming that you wish to remove this element from your presentation. 

 

Step Four: Finalising Your Presentation


1. Scroll down and click Behavioural settings. Modify the behavioural settings by ticking off the boxes or/and clicking the drop down menus. 

behaviour settings 

2. Click Social Settings. Tick off the boxes to display the share icons. 

social settings

3. Click Text overrides and translations. Click the drop down menus to edit language. 

text overrides and translations

 

Step Five: Publishing Your Presentation


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 - Publish: This option allows you to make the H5P Unpublished (content cannot 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 the LMS and be embedded). Protected is the default setting and it is recommended to leave this setting as it is. 

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

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, you can use the search field to locate another staff member by typing in their 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 learn more about Sharing and Collaborators, please see H5P Sharing and Collaboration.

6 -LTI Settings (previously 'Send Score to LMS') 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. 

course presentation tool settings

 After adjusting your H5P object, you can click Save and Insert or Save.

1. Click Save and Insert. A preview of the course presentation will appear.

course pre save and insert 

2. The H5P object is now ready to add to your space. Click Insert to add the course presentation.

 insert

3. Alternatively, you can click Save.

h5p save 

4. Then click Insert.

h5p insert

 

An Example of a Course Presentation in VU Collaborate with Tips


Course presentation h5p

Visuals

Course Presentations appear as above. The navigation bar at the bottom shows how many slides there are, and each slide with an interactive activity has a small white dot. There are a variety of display options for a range of activities, for example, the highlighted text is one of three ways that a link can be embedded.

Tips

1. Think of these as activities for students and try to minimise the association with PowerPoint Presentations.

2. Use Creative Commons images to present impressive visuals.

3. Explore the tutorials, help guides and H5P website to understand the tools you are using.

In VU Collaborate, you can access H5P from any HTML editor where the Insert Stuff button appears.

There is a lot of training available to learn to use H5P, as the integrated tool has many objects available in addition to Course Presentation. You can create these yourself or send a request through and have the basic shell developed. From here, you will need to review, edit and insert.

Review Edit and Insert Course Presentation

 


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.

Admin Only