H5P is rapidly becoming the best choice for creating interactive contents right from your browser window. The presentation covers the basics of H5P project and How It can be used with Moodle. The presentation delivered during iMoot 2017 (#imoot17) also includes the top 10 H5P content types which can be used in Moodle course to add interactive elements.

1. Using H5P with Moodle
The top 10 H5P activities for Moodle teachers
By - Jaswinder Singh

2. Topics to be covered
• What is H5P?
• Major advantages of H5P
• How it can be used with Moodle?
• Sharing and Reusing H5P activities
• Content Types in H5P
• Top 10 H5P content types for Moodle teachers

3. Who Am I?
• Passionate about the power of
Moodle
• Want to improve the Education
system in India
• Author of the Book – “How to
use Moodle 2.7”
• Organizer of First MoodleMoot
India (#MootIN16)
• Blogger at MoodleWorld
www.moodleworld.com

4. What I Do?
Definitely, NOT THIS Instead, I play with these in my full time job.

5. Questions for the audience
1. How many of you are aware about H5P Project?
2. How many of you are aware that it can be used with Moodle?
3. How many of you are actually using H5P with Moodle?

6. H5P is rapidly becoming the best platform for
creating interactive content right from your browser.

7. What is H5P
• H5P acronym for HTML5 Package.
• Free and open-source content collaboration
framework
• Based on JavaScript
• The goal is to make it easy for everyone to
create, share and reuse interactive HTML5
content.
• Can be used for Interactive videos,
presentations, quizzes, games, interactive
timelines etc.
• designed to have a minimum of platform
specific code and a minimum of backend code

8. Major advantages of H5P
• Easy to create HTML5 content – right from your browser window
• Share - Content Seamlessly Across Any H5P Capable Site
• Reuse and modify - Content in Your Browser at Any Time
• Mobile friendly content - experience the same rich, interactive content on
computers, smartphones and tablets alike.
• Free to use - H5P is a completely free and open technology, licensed with
the MIT license.
• Supports xAPI
• Supported by Community like Moodle

9. Supported Platforms
• WordPress
• Moodle
• Drupal

10. Beware!!!
• Don’t use H5P for exams.
• It is currently possible for people with programming skills to cheat in
H5P interactions and obtain the full score without knowing the correct
answers

11. Moodle & H5P
• Moodle plugin can be
downloaded from
https://moodle.org/plugins/mod
_hvp
• By default, the plugin will
download and install the
recommended content types.
• You must have content types
installed in order to create new
H5P content.
• When students complete an
activity, their performance is
recorded in the Moodle
Gradebook.

12. Sharing & Reusing H5P activities
• Download the existing H5P file
• Upload it to the new platform
• Customize the options without reinventing the wheel again.
• That’s it.. Pretty simple!!

13. H5P Content Types
• H5P makes it easy to create interactive content by providing a range of
content types for various needs.
• As on date there are 33 different content types available in the H5P
library.
• Content types are updated to new version frequently.
• If there are new minor or major versions available for a library existing
content created with older versions of that library won't be upgraded
automatically. Click the upgrade buttons next to the libraries to upgrade
existing content to the newest version.

14. Top 10 H5P Content Types
For Moodle Teachers

15. 1. Interactive Video
• A video with interactive elements appearing on the screen, including
annotations, questions, links.
• Grab the learners attention in short span of time.
• All question types can be configured to perform adaptive behavior.
• Allow bookmarking so that learners can skip to specified sections of the
video on demand.
• Demo - https://h5p.org/interactive-video

17. 2. Course Presentation
• Free HTML5- based presentation
• A series of slides, may include video and audio, questions, and links.
• Learners can experience new interactive learning material and test their
knowledge and memory in Course Presentations
• Easily editable in browsers through a WYSIWYG drag and drop based
authoring tool.

19. 3. Drag and Drop
• HTML5 based drag and drop question type to make engaging challenges
• Allow creative teachers to create many forms of drag and drop using
only a web browser.
• Use both text and images as draggable alternatives.
• Support one-to-one, one-to-many, many-to-one and many-to-many.
• Can be used to test the learner's knowledge on a given topic

21. 4. Find multiple hotspots/Find the
Hotspot
• Question type allows to create an image based test
• Learner has to find the correct spots on an image.
• Students are provided with relevant feedback based on where they click.
• As teacher, you can select how many correct hotspots need to be found
before marking the question as complete.

23. 5. Image Juxtaposition
• Allows users to compare two images interactively.
• Choose between a horizontal slider and a vertical slider.
• Set its starting position & optionally label your images.
• Great tool to tell your image stories like Before & After Season etc.

25. 6. Guess the Answer
• Create challenges for students to guess an answer based on a picture.
• Simply upload an image and add a suitable description & solution.
• Students guess the answer and press the bar to reveal correct answer.
• Easy to use and can be create in seconds.

27. 7. Audio Recorder
• Record your voice and play back or download a .wav file of your
recording.
• Suitable content type for open-ended questions and language courses.
• ** Limited Browser support as on date – Edge, Chrome & Firefox

29. 8. Mark the Words
• Create challenges where the user is to mark specific types of words in a
text.
• Student highlights words according to the task description and is given a
score.
• Add as many expressions and correct words as you like
• Supereasy for the teacher to setup (correct answer to be kept in
asterisks.)

31. 9. Timeline
• Create interactive timelines.
• Allows you to place a sequence of events in a chronological order.
• For each event you may add images and texts.
• Include assets from Twitter, YouTube, Flickr, Vimeo, Google Maps and
SoundCloud

33. 10. Multiple Choice
• An easy to use and effective assessment tool
• Create challenges where the user is to identify one ore more correct
choices.
• Learner is given immediate performance feedback.
• Can be used for testing well-defined skills related to a certain topic

35. 11. Memory Game
• Allows authors to add their own images (and optional text) to a memory
game.
• Users needs to search for image pairs.
• Better used for testing the memory of your students.

37. Thank You