Scribd
Upload
115 views

H5P Using An Interactive

Rafael Scapin presented on using the interactive content tool H5P in Moodle. H5P allows users to easily create interactive HTML5 content types like interactive videos, presentations, drag and drop activities, and assessments. It has advantages like being mobile friendly, free to use, and supported by Moodle. Scapin demonstrated how to start using H5P both in the cloud at h5p.org and by installing the H5P plugin in Moodle. He highlighted several popular H5P content types and provided examples.

Uploaded by

Amira Sophia
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
115 views

H5P Using An Interactive

Rafael Scapin presented on using the interactive content tool H5P in Moodle. H5P allows users to easily create interactive HTML5 content types like interactive videos, presentations, drag and drop activities, and assessments. It has advantages like being mobile friendly, free to use, and supported by Moodle. Scapin demonstrated how to start using H5P both in the cloud at h5p.org and by installing the H5P plugin in Moodle. He highlighted several popular H5P content types and provided examples.

Uploaded by

Amira Sophia
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 40

Copie de diffusion et de conservation autorisée par la licence CC-BY-NC-ND

Diffusé par le Centre de documentation collégiale dans EDUQ.info - 40 p. PDF

Moodle Day 2018


May 25th, 2018

H5P: Using an Interactive


Assessment Tool in Moodle

Rafael Scapin, Ph.D.


Coordinator of Educational Technology
Dawson College
Content

• What’s H5P?
• Starting Using H5P
• Integrating H5P and Moodle
• Questions
What is H5P ?

• How many of you have heard of H5P ?

• How many of you are actually using H5P


with Moodle?
What is H5P ?
• H5P is a free and open-source content
collaboration framework based on JavaScript

• Abbreviation for HTML5 Package

• It aims to make it easy for everyone to create,


share and reuse interactive HTML5 content.

• Platforms you can use it: Moodle, WordPress


and Drupal
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
Advantages of H5P
• Mobile friendly content - experience the same
rich, interactive content on computers,
smartphones and tablets.

• Free to use - H5P is a completely free a open


technology, licensed with the MIT license.

• Supports xAPI

• Supported by the Moodle Community


Starting Using H5P

In the cloud:

http://h5p.org

A Moodle plugin
Starting Using H5P in the Cloud

• Create a free account in


http://h5p.org

• Create your content

• Embed it into Moodle or share it


Starting Using H5P in the Cloud

https://h5p.org/
Starting Using H5P in the Cloud
Starting Using H5P in the Cloud
Using H5P in Moodle
Starting Using H5P in Moodle

Note: You must


install the H5P
plugin first
H5P Content Types
• H5P makes it easy to create interactive content by
providing a range of content types for various
needs.

• As of today there are 47 different content types


available in the H5P library.
Top H5P Content Types
For Moodle Teachers
1. Interactive Video

The Interactive video content type allows you to


add interactions on top of video clips.

Interactions such as images, elaborating text, links


and quizzes pop up while the learner watches the
video.
1. Interactive Video

Demo: https://h5p.org/interactive-video
2. Course Presentation

The Course presentation content type allows you to


create a slide-based presentation of your learning
material.

Elements such as keywords, links, pictures, audio


and video clips, as well as various quiz types can
be embedded seamlessly right into the presentation
for a richer learning experience.
2. Course Presentation

Demo: https://h5p.org/presentation
3. Drag and Drop

The Drag and drop content type allows learners to


drag a piece of text or an image and drop it on one or
more corresponding dropzones.

Drag and drop can be used to test the learner's


knowledge on a given topic as a variation to
Multichoice questions.
3. Drag and Drop

Demo: https://h5p.org/drag-and-drop
4. Find multiple hotspots/Find the Hotspot
The Drag and drop content type allows learners to
drag a piece of text or an image and drop it on one or
more corresponding dropzones.

Drag and drop can be used to test the learner's


knowledge on a given topic as a variation to
Multichoice questions.
4. Find multiple hotspots/Find the Hotspot

Demo: https://h5p.org/find-multiple-hotspots
5. Image Juxtaposition
A free HTML5-based image content type that allows
users to compare two images interactively.

Demo: https://h5p.org/image-juxtaposition
6. Guess the Answer
A free HTML5 based content type allowing creatives
to create challenges where the user is to guess an
answer based on a picture.

Demo: https://h5p.org/guess-the-answer
7. Audio Recorder
• A free HTML5 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

Demo: https://h5p.org/audio-recorder
8. Mark the Words
• A free HTML5 based question type allowing
creatives to create challenges where the user is to
mark specific types of verbs 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
8. Mark the Words

Demo: https://h5p.org/mark-the-words
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
9. Timeline

Demo: https://h5p.org/timeline
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
10. Multiple Choice

Demo: https://h5p.org/multichoice
11. Memory Game

• A free HTML5-based memory game content type


allowing authors to add their own images (and
optional text) to a memory game.

• To play the game, users search for image pairs,


which will display a specified text message once a
matching pair has been found
11. Memory Game

Demo: https://h5p.org/memory-game
Starting Using H5P in Moodle
H5P.com is coming!

H5P is launching a service for those


who want to use H5P without having
to set up and maintain their own web
site or hosting solution for H5P.

https://h5p.com
Resources

H5P.org
http://www.h5p.org

H5P Tutorials
https://h5p.org/documentation/for-authors/tutorials
Contact
Rafael Scapin, Ph.D.

rscapin@dawsoncollege.qc.ca

https://twitter.com/rscapin

https://www.slideshare.net/rscapin

http://dawsonite.dawsoncollege.qc.ca

You might also like