Using H5P Interactive Content (possibly the best activity tool for Courses by EDSPORA admin)

Search Knowledge Base by Keyword

Search Knowledge Base by Keyword

You are here:
< All Topics
Table of Contents

Have you ever wanted to have a quiz question pop up while a student watches an online video that you’ve assigned?  Wouldn’t it be neat if you could choose from a variety of question types (multiple choice, fill in the blank, long answer, discussion, etc.)?  And wouldn’t it be unbelievable if the quiz results automatically flew into the EDSPORA gradebook?

All of this is possible with an interactive video tool from H5P! H5P is a suite of interactive media tools that you may use in your EDSPORA course. Interested in learning more? Interested in learning more? See below for basic instructions to get started right away. 

Available content types

H5P is a dynamic community, and is constantly improving and changing – new interactive content types are added regularly.  As such some of the content types featured in H5P’s online authoring tool may not be available within EDSPORA. If you find one that you’d like to use  and you don’t see it in EDSPORA, let us know!

Accordian

Accordion H5P Tool Illustration of vertically expandable items.

Create vertically stacked expandable items

Description

Reduce the amount of text presented to readers by using this responsive accordion. Readers decide which headlines to take a closer look at by expanding the title. Excellent for providing an overview with optional in-depth explanations.

This functions as a presentation and includes the following interactivity(s):

Use

This is a multi purpose content type that can be integrated into an aggregator content type, or used on its own.

Sample

Agamotto

Agamotto H5P Tool Illustration of interactive slide show.

Create an interactive slideshow.

Description

A free HTML5-based content type that allows users to compare and explore a sequence of images interactively. Authors can decide to add a short explanatory text for each image.

This functions as and includes the following interactivity(s): – multimedia

Use

When you have content that works in layers (e.g., you start with a map, then show areas of interest, then show data on specific points, etc.). 

Arithmetic Quiz

Arithmetic Quiz H5P Tool Illustration of mathematical signs

Create time-based arithmetic quizzes

Description

This functions as and includes the following interactivity(s): – game- question

Audio

Upload an audio recording.

Description

Audio enables you to upload an audio file or select a URL from which it can pull an audio file. It allows you to select a full or minimal player as the user interaction, and it will also allow you to enable controls and autoplay. The end user can also download or embed the audio file.

This functions as a presentation.

Use

A stand alone content type, this cannot be incorporated into others.  Audio provides an alternative mode of content presentation to text and images. It can be used for updates, interviews, to record and share feedback for students, or an extension of a discussion after class.

Audio Recorder

Audio Recorder H5P Tool illustration of microphone.

Create an audio recording

Description

Audio Recorder allows you to record your voice and play it back immediately or download a .wav file for future use. It is a fitting content type for open-ended questions and language courses.

Important note: This content type currently has limited browser support. It works on Edge, Chrome, and FireFox. We hope more browsers will implement support for the ways this content type does recordings.

This functions as an assessment and includes the following interactivity(s): – multimedia.

Chart

Chart H5P Tool illustration of pie and bar charts.

Generate bar and pie charts

Description

Need to present simple statistical data graphically without creating the artwork manually? Chart is your answer.

Features:

  • Select between bar and pie chart view
  • Add label and value to each data element
  • Select background color each data element
  • Set font color for each data element

This functions as a presentation and includes the following interactivity(s): – multimedia

Use

A stand alone content type, this cannot be incorporated into others.

Collage

Collage H5P Tool illustration of image collage.

Create a collage of multiple images with preconfigured layout options.

Description

The Collage tool allows you to put together images into one of eleven preconfigured layouts or compositions. The Collage tool will allow you to configure the height, outerframe size, and image spacing (inner frame size) for the layout. It will also allow you to adjust the pan and zoom on the individual images in the layout.

This functions as a presentation and includes the following interactivity(s): – multimedia

Use

This is a multipurpose content type that can be integrated into an aggregator content type, or used on its own.

The Collage tool is useful whenever you need more than one image on a page, or when visual content in the form of a collage is needed. Other examples are to show the steps in a process or snapshots of a topic.

Sample

Column

Column H5P Tool illustration of content groupings.

Column layout for H5P Content

Description

Organize your content type into a column layout with H5P Column. Content types that address similar material or share a common theme can now be grouped together to create a coherent learning experience. In addtion, authors are free to be creative by combining almost all of the existing H5P content types.

H5P Column is also a way to easily share multiple content types simultaneously as it can be embedded or downloaded just like any other H5P.

This functions as both an assessment and a presentation and includes the following interactivity(s):

Use

As an aggregator, Column serves as a framework to compile other content types (Integrable Content Types) into a common H5P entity.

Sample

Course Presentation

A free HTML5-based presentation content type which allows users to add multiple choice questions, fill in the blanks, text, and other types of interactions to their presentations using only a web browser. Create engaging presentations with H5P and Course Presentation in publishing systems like Canvas, Brightspace, Blackboard, Moodle and WordPress.

Description

Course presentations consist of slides with multimedia, text, and many different types of interactions like interactive summaries, multiple choice questions and interactive videos. Learners can experience new interactive learning material and test their knowledge and memory in Course Presentations.

Dialog Cards

Description

Dialog cards can be used as a drill to help learners memorize words, expressions or sentences. On the front of the card, there’s a hint for a word or expression. By turning the card the learner reveals a corresponding word or expression. 

Dictation

A free HTML5-based content type that allows you to create dictation exercises.

Description

You can add audio samples containing a sentence for dictation and enter the correct transcription. Your students can listen to the samples and enter what they have heard into a text field. Their answers will be evaluated automatically.

Documentation Tool

Description

The documentation tool aims to make it easy to create assessment wizards for goal driven activities. It can also be used as a form wizard.

Drag and Drop

A free HTML5-based drag and drop question type allowing creatives to create many forms of drag and drop using only a web browser. 

Description

Drag and drop questions enable the learner to associate two or more elements and to make logical connections in a visual way. Create Drag and drop questions using both text and images as draggable alternatives. H5P Drag and drop questions support multiple draggable to drop zone combinations; one-to-one, one-to-many, many-to-one and many-to-many.

Drag the Words

A free HTML5 based question type allowing creatives to create text based challenges where users are to drag words into blanks in sentences.

Description

Drag the Words allows content designers to create textual expressions with missing pieces of text. The end user drags a missing piece of text to its correct place, to form a complete expression.

Essay

A free HTML5-based content type that allows students to receive instant feedback to a text that they have composed. Authors can define a set of keywords that will trigger individual responses

Description

The text which students created will be scanned for keywords that have been defined by an author before. Several options allow to make this rather simple approach still quite flexible for giving feedback.

Fill in the Blanks

Description

Learners fill in the missing words in a text. The learner is shown a solution after filling in all the missing words, or after each word depending on settings.

Find Multiple Hotspots

A free HTML5 based question type allowing creatives to create an image based test where the learner is to find the correct spots on an image.

Description

This content type can be used for questions where the end users for instance are to find all the hotspots in an image. The end users are provided with relevant feedback based on where they click.

Find the Hotspot

A free HTML5 based question type allowing creatives to create an image based test where the learner is to find the correct spot on an image.

Description

This content type allows end users to press somewhere on an image and get feedback on whether that was correct or incorrect according to the task description.

Find the words

A free HTML5-based word search activity that allows authors to create a list of words that will be drawn in a grid. The learners’ task is to find and select the words in the grid. 

Flashcards

Free interactive HTML5 flashcards. Create a set of stylish and intuitive flashcards that have images paired with questions and answers.

Description

This content type allows authors to create a single flash card or a set of flashcards that have both questions and answers. Learners are required to fill in the text field and then check the correctness of their solution.

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.

Description

This content type allows authors to upload an image and add a suitable description. End users can guess the answer and press the bar below the image to reveal the correct answer. 

Iframe Embedder

Description

The Iframe embedder makes it easy to make an H5P of already existing JavaScript applications.

Image Hotspots

A free HTML5 based content type allowing creatives to add hotspots to images. Hotspots may reveal texts, images and videos when clicked.

Description

Image hotspots makes it possible to create an image with interactive hotspots. When the user presses a hotspot, a popup containing a header and text or video is displayed. Using the H5P editor, you may add as many hotspots as you like.

Image Juxtaposition

A free HTML5-based image content type that allows users to compare two images interactively. 

Description

You can choose between a horizontal slider and a vertical slider, set its starting position and optionally label your images.

Image pairing

A free HTML5-based image pairing activity that allows authors to create pairs of images to be matched. Learners are presented with the unpaired images and have to either use drag and drop or click on the images they think matches. Since it is not required for both images in a pair to be the same, authors are also able to test the understanding of a relation between two different images.

Description

Image pairing is a simple and effective activity that requires learners to match pairs of images. Since it is not required for both images in a pair to be the same, authors are also able to test the understanding of a relation between two different images.

Image Sequencing

A free HTML5 based image sequencing content type that allows authors to add a sequence of their own images (and optional image description) to the game in a particular order. The order of the images will be randomized and players will have to reorder them based on the task description. 

Description

The Image Sequencing content type challenges the learner to order a randomized set of images according to a task description. 

Image Slider

A free HTML5-based image slider allowing users to create responsive image sliders with a full-screen mode in a user-friendly way.

Description

Present your images in an appealing way with ease. Authors just have to upload images and provide alternative texts for the images.

The next two images are always preloaded so switching between images will usually be snappy with no delay for loading the next image.

Images may be experienced as part of the page or in full-screen mode. When used as part of the page the system will pick a fixed aspect ratio depending on the images being used. Authors may decide to handle aspect ratios differently.

Impressive Presentation (ALPHA)

Description

Unfold your creativity on an infinite 3D canvas. Images, text and other H5Ps can be combined to create presentations with 3D transitions between steps. This content type is experimental, creating Impressive Presentations might be very difficult, and impossible for people not familiar with 3D creation tools.

The authoring tool is only tested in Google Chrome, does not work in Firefox.

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.

Description

Mark the words allows content designers to create textual expressions with a defined set of correct words. The end user highlights words according to the task description and is given a score.

For the editor it is super easy to create a click the words challenge. The editor types in the text and encloses the words that the user is supposed to click, the right answers, in asterisk like *correctWord*.

Features

  • Add as many expressions and correct words as you like
  • End users can highlight any word within the expressions
  • Mark the words can be included in PresentationInteractive video and Question set content types

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.

Description

Create your own memory games and test the memory of your site’s users with this simple yet beautiful HTML5 game.

Learn how to create a Memory game in this tutorial.

Multiple Choice

A free HTML5 based question type allowing creatives to create challenges where the user is to identify one ore more correct choices. 

Description

Multiple Choice questions can be an effective assesment tool. The learner is given immediate performance feedback. The H5P Multiple Choice questions can have a single or multiple correct options per question.

Learn how to create a Multiple Choice question in this tutorial.

Personality Quiz

Description

In this content type, the author defines a series of questions with alternatives, where each alternative is matched against one or more personalities. At the end of the quiz, the end user will see which personality matches the best. There are several ways of making this quiz visually appealing, by eg. representing questions, alternatives, and personalities using images.

Questionnaire

A free HTML5 based content type allowing creatives to create questionnaires. Questionnaires can be used as surveys or open ended questions. You may use multiple choice questions or text input questions.

Description

Gain feedback and ask open ended questions in Interactive Videos and other content types with Questionnaire. Questionnaire makes the user’s answers available via xAPI. This means that website owners may store the answers in many different ways. Answers may be stored in an LRS, the sites own custom storage or a script may for instance fetch the e-mail address and use it to send the user an e-mail. On H5P.org answers are stored in Google Analytics. 

To retry the questionnaire just refresh the page.

In order to enable H5P Questionnaire on your site you will need to:

  1. Enable LRS dependent content types under H5P Settings (the location of the settings will differ depending on the platform you’re using)
  2. Set up a service to process the events (typically an LRS)

Features

  • Create multiple choice or open ended questions
  • Require specific questions to be answered
  • Change the display text and show an image upon completion
  • Set the accessibility messages for screen readers

Quiz (Question Set)

A free HTML5 based content type allowing creatives to create quizzes. Many question types are supported like multiple choice, fill in the blanks, drag the words, mark the words and regular drag and drop.

Description

Question Set is your typical quiz content type. It allows the learner to solve a sequence of various question types. You can combine many different question types like MultichoiceDrag and drop and Fill in the blanks in a Question set. As an author there are many settings you can use to make it behave just the way you want it to. You may for instance customize the Question set with background images and define a pass percentage for the learner.

The Question Set also allows you to add videos that are played at the end. One video for success, another if the learner fails the test. This might motivate learners to try again if they fail so that they get to see the success video. 

Learn how to create a Question set in this tutorial.

Single Choice Set

A free HTML5 based content type allowing creatives to create simple and smooth quizzes consisting of single choice questions. 

Description

Single choice set allows content designers to create question sets with one correct answering alternative per question, in just a few seconds. The end user gets immediate feedback after submitting each answer. 

Features

  • Sound effects for correct and wrong (sound effects may be turned off)
  • Fully responsive design
  • Summary at the end showing the solution to all questions
  • Single choice sets can be included in Presentation and Interactive video content types

Speak the Words

A free HTML5-based voice recognition content type allowing authors to ask a question that should be answered with the user’s own voice. Speak the Words content is created using only a web browser in H5P supported platforms such as Canvas, Brightspace, Blackboard, Moodle and WordPress.

Description

Create your own questions and make the user answer with their own voice.

Important note: This content type has limited browser support and currently works only on Chrome.

Speak the Words Set

A free HTML5 based voice recognition content type allowing authors to create sets of questions answered by a user’s own voice. Speak the Words Set makes use of the Speak The Words content type. All you need is this content type and H5P.com or the H5P plugin for publishing systems like Canvas, Brightspace, Blackboard, Moodle and WordPress to start creating. The speech engine used is currently only available in the Chrome browser. 

Description

Speak the words set allows authors to combine multiple Speak the Words tasks into a set so they can be delivered together as a single piece of content, similar to Question Set. As an author, there are a few settings you can use to make it behave just the way you want it to. You may, for example, define different messages for different scores achieved by the learner.

Important note: This content type has limited browser support and currently works only on Chrome. 

Summary

A free HTML5 summary builder. This content type allows creatives to create challenges where the user is to choose between statements and build the correct summary.

Description

Summaries help the learner remember key information in a text, video or presentation, by actively buliding a summary about the topic at hand. When the learner has completed a summary, a complete list of key statements about the topic is the end result.

Learn how to create a Summary in this tutorial.

Timeline

A free HTML5 based content type allowing creatives to create interactive timelines. 

Description

This is Timeline.js developed by Knight Lab, packaged as an H5P content type in order to make timelines easily editable, shareable and reuseable. 

The Timeline content type allows you to place a sequence of events in a chronological order. For each event you may add images and texts. You may also include assets from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud.

Learn how to create a Timeline in this tutorial.

Timeline

A free HTML5 based content type allowing creatives to create interactive timelines .

Description

This is Timeline.js developed by Knight Lab, packaged as an H5P content type in order to make timelines easily editable, shareable and reuseable. 

The Timeline content type allows you to place a sequence of events in a chronological order. For each event you may add images and texts. You may also include assets from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud.

Learn how to create a Timeline in this tutorial.

True/False Question

A free HTML5 based content type allowing creatives to create true/false questions. 

Description

True/False Question is a simple and straightforward content type that can work by itself or combined into other content types such as Course Presentation. A more complex question can be created by adding an image or a video.

Virtual Tour (360)

A free HTML5 based virtual tour content type allowing users to add questions, texts and interactions to multiple 360 environments using only a web browser. 

Description

360 (equirectangular) and normal images may be enriched with interactivities like explanations, videos, sounds, and interactive questions. The images may also be linked together to give the user an impression of moving between environments or between different viewpoints within the same environment.

This content type may be used to give a feeling of exploring and learning within a realistic environment. It includes an easy to use drag and drop authoring widget making it easy for everyone to create their own virtual tours.

Learn how to create Virtual Tours (360) in this tutorial.

Features

The following H5P content types may be added to a Virtual Tour Scene:

  • Text
  • Image
  • Sound (both for the entire Virtual Tour, per room/scene and as buttons in the scenes.
  • Video
  • Single Choice Set
  • Interactive Summary
  • Connections to other scenes

Interactive Video

An HTML5-based interactive video content type allowing users to add multiple choice and fill in the blank questions, pop-up text and other types of interactions to their videos using only a web browser.

Description

Videos may be enriched with interactivities like explanations, extra pictures, tables, Fill in the Blank and multiple choice 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 be added at the end of the video. Interactive videos are created and edited using the H5P authoring tool in a standard web browser.

Learn how to create Interactive videos in this tutorial.

Features

The following H5P content types may be added to your video:

  • Multiple choice questions with one or more correct answers
  • Free text questions
  • Fill in the blank questions
  • Drag and drop questions
  • Interactive summaries
  • Single choice question sets
  • Mark the word activities
  • Drag and drop text
  • Images
  • Tables
  • Labels
  • Texts
  • Links

All question types can be configured to perform adaptive behavior, meaning that a correct answer could cause the user to skip to a specified place in the video while an incorrect answer could take the user somewhere else in the video. Typically, submitting a wrong answer will cause  the user to be directed to the place in the video where the answer to the question is presented.

You may also add bookmarks so that your users can skip to specified sections of the video on demand. 

Advanced fill the blanks

Description

Learners fill in the missing words in a text or choose the correct answer from a drop-down menu. For each blank, the learners are told if the entered answer is correct. If an answer is incorrect, an individual feedback text is shown for the exact mistake they’ve made and their attention is drawn to relevant parts of the text. If they only make a minor mistake, they get a warning message telling them what the exact problem is.

Authors enter text and mark blanks with ____. The correct answers, incorrect answers, and the respective feedback texts are then entered in another section below. Authors can also mark parts of the text as ‘highlight sections’ by surrounding them with !!. They can then reference these highlight sections when they enter the feedback texts for incorrect answers.

‘Advanced Fill in the Blanks’s is most useful in second language learning, where you can give the users individual hints, why certain tenses or word forms can’t be used in this case. While it is possible to have a ‘Check’ button at the bottom of the exercise and give feedback for all blanks at once, it makes more sense to enable the auto-check setting as the user is guided through the ‘fill the blanks’ exercise step by step.

If you don’t want to use individual feedback or ‘drop-down’ mode, the regular ‘Fill in the Blanks’ content type is easier to use and might be the better choice.

Leave a Reply