H5P Interactive Book Tool

H5P's Interactive Book tool allows users to put together large amounts of interactive content, including interactive videos, questions, course presentations and more on multiple pages that students can access through a menu of Pages.

Example:

This Interactive Book example has a mixture of content and tasks. Each page in the book has its own URL, allowing you to link to a specific page in a communication or worksheet with learners. 

Note: H5Ps are created in the course Content Bank. After you are satisfied with the H5P you have created, position the H5P on your main course. Refer to the instructions in Adding an H5P Activity to the Courseware for detailed steps on how to do this.

1. Click on the Content bank in the Navigation drawer.

2. In the Content bank, click on the Add button.

3. Locate the Interactive Book tool icon in the drop-down list. 

4. The Interactive Book editing screen appears.

5. Type a Title for this book.

6. Check or uncheck Enable book cover.

If you choose not to Enable Book Cover, go to the section Adding Pages (Column).

If the Enable book cover option is checked, the Cover Page accordion button appears.

1. Click on the Cover Page accordion button. 

2. In the Cover description field, type a description of the interactive book.

3. In the Cover medium drop-down, an image or a video can be added to the book cover page.

1. If Image is chosen, click on the Add button. 

2. Choose the image from your device.

3. Click on the Metadata button.

4. Enter copyright details, similar to this example.

5. Click on the Save author button.

6. Click on the Save metadata button.

7. Add a description of the picture in the Alternative text box.

Note: The image will appear when the Interactive Book is launched. The image should be a landscape-oriented image. The students will click on the Read button to open the interactive book.

1. If Video is chosen, click on the Add button.

2. Type a Title of the video.

3. Click on the Video sources icon.

Paste the YouTube source of the video into the textbox. (https://youtu.be/kRPGPAnPNa8)

4. Click on the Insert button.

Note: An icon appears with the video host's name. 

Note: The video will appear when the Interactive Book is launched. Students click on the video Play button to view the video. If you wish to have the video play on its own, click on the Playback accordion option and then choose Auto-play video. 

The students will click on the Read button to open the Interactive Book.

1. Type the name of the first Page (column).

2. Click on the Content drop-down.

Note: Each Page or Column can have a variety of H5P learning objects. Currently these are the options available on Avenue (February 2024).

• Accordion
• Agamotto
• Audio
• Audio Recorder
• Fill in the Blanks
• Chart
• Collage
• Course Presentation
• Dialog Cards
• Documentation Tool
• Drag and Drop
• Drag the Words
• Essay
• Guess the Answer
• Table
• Text
• Iframe Embedder
• Image
• Image Hotspots
• Find the Hotspot
• Image Slider
• Interactive video
• Link
• Mark the Words
• Memory Game
• Multiple Choice
• Question Set
• Single Choice Set
• Summary
• Timeline
• True/False Question
• Video
• Image Choice

Note: There are too many tools to document here. For more information on these individual H5P features see H5P Content Types.

3. Choose the first content type, in this case Text.

4. In the Text textbox, type or paste text.

5. Click on the Add Content button to add more content.

6. Click on the Content drop-down.

7. Choose the content type, Audio.

8. Type the Title of the audio clip. 

9. Click on the Source files icon. 

10. Click on the Upload audio file icon.

11. Locate the audio (Mp3) file on your device and select it.

12. Choose the Player mode.

a. Minimalistic for a small icon;

b. Full for a controllable player;

Note: Do not check Enable Autoplay. Check Enable Controls.

13. To change the order of appearance of column items, use the Order item up or Order item down icons.

14. Click on the Add Content button to add more content.

15. Click on the Content drop-down.

16. Choose the content type, True/False Question.

17. Type a Title for the question.

18. Insert a statement or question in the Question text box.

19. Choose True or False for the Correct Answer buttons.

Note: More content could be added to this Page (Column). At this point we will add another Page.

20. Scroll up and click on the Add Page button.

21. Repeat the steps above using different content to create a new Page (Column).

22. Repeat adding Pages until the book is complete.

23. In the Behavioural settings section, change the base colour of the book.

Note: Ensure that colour contrast between the text and the background allows for good readability. 

24. Check Display table of contents as default, to have the left menu visible when the book loads.

25. Check Display Progress Indicators to show completion of Pages.

26. Check Enable automatic progress to remove confirmation buttons for learners so Pages without tasks (quizzes) are automatically marked as complete when viewed.

27. Check Display summary to allow end users to see the Summary & submit progress buttons.

Students will be greeted, in this case, with an Image Book Cover.

Students click on the Read button.

The Book Pages appear with a menu on the left side.

If the active Page has any interactive content, it appears in a sub-menu.

Questions appear as normal H5P questions on the Pages. 

Students answer all prompts/questions.

Upon completion of the Interactive Book elements, students click on the Summary & Submit button.

The Summary for the student appears.

At the top, a visual report of the Total score, Book progress and Interactions progress appears.

In the Summary section, each interaction is displayed with the title of the interaction or question, score, and a visual indicator of success. In this case a red dot. 

The final score is displayed at the bottom of this screen.

After the Summary report is read by a student, they must click on the Submit Report button or click on the Restart button to try the activity again, if allowed by the instructor.

After the learners have submitted their Interactive Book tasks, the teacher opens the H5P Interactive Book assignment on their course.

1. On the activity screen, click on the View all attempts link.

2. On the activity screen, click on the View user attempt(s) link.

A line stating the date, score, maximum score, time on task, completion of all tasks and a success indicator will appear.

Note: The first attempt indicates a fail under the Success field (8 out of 11). The second attempt indicates success (11 out of 11).

Some H5P tools are set to use offline manual grading.

If there are no interactions on a Page, the page does not have to be visited by a student to be graded correct (on Moodle).

3. Click on the View Report link.

A short report appears with more details about the student's progress.

Note: As the report shows, This attempt is completed is checked, indicating that it met the Moodle Activity Completion criterion Students must receive a grade to complete this activity. However, the Outcome is a Fail, indicating that not all questions were answered correctly.